/* ===================================
   RENDEZ-VOUS PAGE
=================================== */

.rdv-page {
    background: var(--white);
}


/* ===================================
   HEADING
=================================== */

.rdv-heading {
    margin-bottom: 8px;
}


.rdv-heading .section-label {
    margin-bottom: 2px;
}


.rdv-heading h1 {
    margin:
        0
        0
        4px;

    color: var(--title);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            1.8rem,
            2.35vw,
            2.35rem
        );

    font-weight: 400;

    line-height: 1.04;
}


.rdv-intro {
    max-width: 720px;

    margin: 0;

    color: var(--text-light);

    font-size: 0.82rem;

    line-height: 1.35;
}


/* ===================================
   MAIN CARD
=================================== */

.rdv-card {
    display: grid;

    grid-template-columns:
        285px
        minmax(0, 1fr);

    overflow: hidden;

    border:
        1px solid
        var(--border);

    border-radius: 11px;

    background: var(--white);

    box-shadow:
        0 3px 14px
        rgba(
            38,
            81,
            104,
            0.045
        );
}


/* ===================================
   INFO COLUMN
=================================== */

.rdv-info {
    padding:
        14px
        15px;

    background:
        linear-gradient(
            180deg,
            #f7fbfd 0%,
            #f1f8fb 100%
        );

    border-right:
        1px solid
        #dcebf2;
}


.rdv-info-item {
    display: grid;

    grid-template-columns:
        32px
        minmax(0, 1fr);

    gap: 10px;

    align-items: start;

    margin-bottom: 11px;
}


.rdv-info-item:last-child {
    margin-bottom: 0;
}


.rdv-info-icon {
    width: 30px;
    height: 30px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #eaf5fa;

    color: #4d98bd;
}


.rdv-info-icon svg {
    width: 17px;
    height: 17px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.75;

    stroke-linecap: round;

    stroke-linejoin: round;
}


.rdv-info strong {
    display: block;

    margin-bottom: 2px;

    color: var(--title);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 0.94rem;

    font-weight: 400;

    line-height: 1.18;
}


.rdv-info a,
.rdv-info p {
    margin: 0;

    color: var(--text-light);

    font-size: 0.74rem;

    line-height: 1.35;

    text-decoration: none;
}


.rdv-info a:hover {
    color: #347fa9;

    text-decoration: underline;
}


.rdv-info-separator {
    height: 1px;

    margin:
        2px
        0
        10px;

    background: #d8e8ef;
}


/* ===================================
   HOURS
=================================== */

.rdv-hours {
    margin-top: 4px;
}


.rdv-hours p {
    display: grid;

    grid-template-columns:
        64px
        minmax(0, 1fr);

    gap: 6px;

    margin-bottom: 2px;

    font-size: 0.69rem;

    line-height: 1.28;
}


.rdv-hours p span:first-child {
    color: var(--text);

    font-weight: 600;
}


.rdv-hours-note {
    margin-top: 6px !important;

    color: #82959f !important;

    font-size: 0.64rem !important;

    line-height: 1.32 !important;
}


/* ===================================
   BOOKING
=================================== */

.rdv-booking {
    min-width: 0;

    padding: 8px;

    background: #ffffff;
}


.rdv-booking-frame {
    width: 100%;

    overflow: hidden;

    border:
        1px solid
        #e0edf3;

    border-radius: 9px;

    background: #ffffff;

    box-shadow:
        0 2px 10px
        rgba(
            38,
            81,
            104,
            0.035
        );
}


.rdv-booking iframe {
    width: 100%;

    display: block;

    border: 0;

    background: #ffffff;
}

.rdv-widget-full-link {
    display: none;
}


/* ===================================
   DESKTOP: FIT ENTIRE PAGE IN VIEWPORT
=================================== */

@media (min-width: 1001px) {

    .rdv-page {
        min-height:
            calc(
                100svh
                - var(--desktop-header-height)
                - 28px
            );

        height:
            calc(
                100svh
                - var(--desktop-header-height)
                - 28px
            );

        display: flex;

        padding:
            8px
            0;
    }


    .rdv-page > .container {
        width:
            min(
                94%,
                var(--container-width)
            );

        display: flex;

        flex-direction: column;

        min-height: 0;
    }


    .rdv-heading {
        flex: 0 0 auto;
    }


    .rdv-card {
        flex: 1 1 auto;

        min-height: 0;
    }


    .rdv-info,
    .rdv-booking {
        min-height: 0;
    }


    .rdv-booking {
        display: flex;
    }


    .rdv-booking-frame {
        flex: 1;

        min-height: 0;
    }


    .rdv-booking iframe {
        height: 100%;

        min-height: 0;
    }

}


/* ===================================
   SHORT DESKTOP
=================================== */

@media (min-width: 1001px) and (max-height: 850px) {

    .rdv-page {
        padding:
            5px
            0;
    }


    .rdv-heading {
        margin-bottom: 5px;
    }


    .rdv-heading h1 {
        margin-bottom: 2px;

        font-size: 1.85rem;
    }


    .rdv-intro {
        font-size: 0.75rem;

        line-height: 1.28;
    }


    .rdv-card {
        grid-template-columns:
            275px
            minmax(0, 1fr);
    }


    .rdv-info {
        padding:
            10px
            12px;
    }


    .rdv-info-item {
        grid-template-columns:
            30px
            minmax(0, 1fr);

        gap: 8px;

        margin-bottom: 8px;
    }


    .rdv-info-icon {
        width: 28px;
        height: 28px;
    }


    .rdv-info-icon svg {
        width: 16px;
        height: 16px;
    }


    .rdv-info strong {
        font-size: 0.88rem;
    }


    .rdv-info a,
    .rdv-info p {
        font-size: 0.69rem;

        line-height: 1.3;
    }


    .rdv-hours p {
        grid-template-columns:
            60px
            minmax(0, 1fr);

        font-size: 0.65rem;
    }


    .rdv-hours-note {
        margin-top: 4px !important;

        font-size: 0.61rem !important;
    }


    .rdv-booking {
        padding: 6px;
    }

}


/* ===================================
   TABLET
=================================== */

@media (max-width: 1000px) {

    .rdv-page {
        padding:
            16px
            0
            24px;
    }


    .rdv-card {
        grid-template-columns:
            255px
            minmax(0, 1fr);
    }


    .rdv-info {
        padding:
            18px
            16px;
    }


    .rdv-booking {
        padding: 12px;
    }


    .rdv-booking iframe {
        height: 650px;
    }

}


/* ===================================
   MOBILE
=================================== */

@media (max-width: 760px) {

    .rdv-heading {
        margin-bottom: 12px;
    }


    .rdv-heading h1 {
        font-size: 1.7rem;
    }


    .rdv-intro {
        font-size: 0.86rem;
    }


    .rdv-card {
        display: block;
    }


    .rdv-info {
        border-right: 0;

        border-bottom:
            1px solid
            #dcebf2;
    }


    .rdv-booking {
        padding: 10px;
    }


    .rdv-booking iframe {
        height: 380px;
    }

    .rdv-widget-full-link {
        display: block;
        margin: 9px 2px 2px;
        color: var(--blue);
        font-size: 0.76rem;
        text-align: right;
        text-decoration: underline;
    }

}


/* ===================================
   SMALL MOBILE
=================================== */

@media (max-width: 420px) {

    .rdv-info {
        padding:
            16px
            13px;
    }


    .rdv-info-item {
        grid-template-columns:
            32px
            minmax(0, 1fr);

        gap: 9px;
    }


    .rdv-info-icon {
        width: 30px;
        height: 30px;
    }


    .rdv-info-icon svg {
        width: 17px;
        height: 17px;
    }


    .rdv-info strong {
        font-size: 0.9rem;
    }


    .rdv-info a,
    .rdv-info p {
        font-size: 0.72rem;
    }


    .rdv-hours p {
        grid-template-columns:
            60px
            minmax(0, 1fr);

        font-size: 0.67rem;
    }


    .rdv-booking {
        padding: 8px;
    }


}