/*
 * Project overrides on top of the Delogis theme.
 * Loaded last, so plain (non-!important) rules here win over delogis.css.
 */

/* ---------------------------------------------------------------------------
 * Header: keep the Appointment button off the last menu items.
 *
 * Cause: .main-menu__list is a flex row whose items were SPREAD (space-between)
 * across a box wider than the window — its right edge measured 1320px on a
 * 1265px viewport. The last items ("Sponser A Child", "Contact US") were pushed
 * out to that phantom edge, under the Appointment button. The green bar is
 * absolutely positioned, so the menu never reserved space for it either.
 *
 * Fix, in two parts:
 *   1. Pack the items from the left instead of spreading them, so they sit in
 *      the space that actually exists.
 *   2. The items measure 835px wide at their natural spacing, and between the
 *      logo and the button there is only ~800-830px on a laptop — so tighten
 *      the per-item margin in that range. Above 1700px there is room to spare,
 *      so the spacing is left exactly as the theme designed it.
 *
 * The bar keeps its design: absolute, bleeding to the right edge, button
 * overlapping its corner, social icons on it at every width.
 *
 * Do not remove the button's margin-left: -85px — that is what keeps the bar
 * narrow; without it the bar itself expands over the menu.
 * ------------------------------------------------------------------------ */

/* Pack the menu leftwards rather than spreading it under the button. */
@media (min-width: 1200px) {
    .main-menu .main-menu__list,
    .stricky-header .main-menu__list {
        justify-content: flex-start;
    }
}

/* Laptop range: 835px of menu does not fit beside the button at its natural
   24px item spacing, so close the items up a little. */
@media (min-width: 1200px) and (max-width: 1699px) {
    /* Must match the specificity of the theme's own gap rule
       (.main-header-four .main-menu .main-menu__list > li + li), or it loses. */
    .main-header-four .main-menu .main-menu__list > li + li,
    .main-header-four.stricky-header .main-menu__list > li + li {
        margin-left: 12px;
    }
}

/* Never let an item wrap onto a second line. */
.main-menu__list > li > a {
    white-space: nowrap;
}

/* ---------------------------------------------------------------------------
 * Booking form: the time an overseas patient is actually booking.
 * Slots are Pakistan clinic hours, so we spell out their local equivalent.
 * ------------------------------------------------------------------------ */
.appt-tz-note {
    margin: 8px 0 0;
    font-size: 14px;
    color: var(--delogis-gray);
}

.appt-summary {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 8px;
    padding: 16px 18px;
    border-radius: 8px;
    border-left: 4px solid var(--delogis-base);
    background-color: rgba(20, 206, 122, 0.08);
}

.appt-summary__ico {
    margin-top: 3px;
    color: var(--delogis-base);
}

.appt-summary__local {
    display: block;
    color: var(--delogis-black);
    font-size: 17px;
    line-height: 1.4;
}

.appt-summary__pkt {
    display: block;
    margin-top: 2px;
    font-size: 14px;
    color: var(--delogis-gray);
}
