@import "bootstrap/scss/functions";
@import "bootstrap/scss/mixins/breakpoints";
@import "../styles/bootstrap-variables";

.sources {
    margin: {
        top: 6.4rem;
        bottom: 6.4rem;
    };
}

.legals {
    font: {
        size: 1.2rem !important;
    };
}

.homeCard {
    display: flex;

    &-container {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border-radius: 2rem;
    }

    &-content {

    }


    &-actions {

    }
}

.searchAppointment {
    display: flex;
    flex-direction: column;
    padding: 9vh 3.2rem;
    background: linear-gradient(45deg, mix(white, $secondary, 85%), mix(white, $primary, 85%));
    border-radius: 2rem;

    &-title {
        max-width: 75vw;
        margin: 0 auto 3.2rem;
        text-align: center;
        font: {
            weight: bold;
        };

        @include media-breakpoint-up(lg) {
            max-width: 45vw;
        }
    }

    &-form {

        .geoloc {
            img.icon {
                height: 1em;
            }
            > button {
                background: red;
            }
            button {
                display: block;
                width: 100%;
                padding: 0.375rem 2.25rem 0.375rem 0.75rem;
                font-size: calc(1.285rem + 0.42vw);
                font-weight: 400;
                line-height: 1.5;
                color: rgb(33, 37, 41);
                background-color: rgb(255, 255, 255);
                background-repeat: no-repeat;
                background-position: right 0.75rem center;
                background-size: 16px 12px;
                border: 0px solid rgb(206, 212, 218);
                border-radius: 0.8rem;
                box-shadow: rgb(0 0 0 / 8%) 0px 0.3rem 0.25rem;
                appearance: none;
            }
        }
    }
}

.searchAppointmentForm {

    &-fields {
        max-width: 75vw;
        margin: auto;

        @include media-breakpoint-up(xl) {
            max-width: 50vw;
        }
        @include media-breakpoint-up(md) {
            label, select, input {
                font-size: 2.4rem;
            }
        }
    }

    &-action {
        margin: {
            top: 3.2rem;
        };
        text-align: center;
    }
}

.platforms {
    &-logo {
        margin: {
            top: 1.6rem;
            right: 3.2rem;
            bottom: 1.6rem;
            left: 3.2rem;
        };
        max-width: 75vw;

        &._doctolib {
            max-height: 6rem;
        }

        &._maiia {
            max-height: 5.2rem;
        }

        &._keldoc {
            max-height: 7rem;
        }

        &._ordoclic {
            max-height: 5.2rem;
        }
        &._pandalab {
            max-height: 9.5rem;
        }
        &._mapharma {
            max-height: 5rem;
        }
        &._avecmondoc {
            max-height: 4rem;
        }
        &._clikodoc {
            max-height: 3.2rem;
        }
        &._mesoigner {
            max-height: 6rem;
        }
        &._bimedoc {
            max-height: 5.5rem;
        }
        &._valwin {
            max-height: 10rem;
        }
    }
}
