/* GAS Site Header presets
   Shared by WordPress and Astro. This file styles only the standard
   gas-site-header HTML contract; PHP template overrides stay in
   common/views/frontend/header-templates/. Template CSS files live in
   common/assets/css/header/templates/. */

/* -------------------------------------------------------------------------
   Visual tone presets
   ------------------------------------------------------------------------- */

.gas-site-header--style-soft {
    --_header-bg: var(--gas-neutral-50);
    --_header-border: var(--gas-neutral-200);
    --_header-hover-bg: var(--gas-white);
    --_header-shadow: var(--gas-shadow-xs);
}

.gas-site-header--style-bordered {
    --_header-bg: var(--gas-white);
    --_header-border: var(--gas-neutral-300);
    --_header-shadow: none;
}

.gas-site-header--style-floating {
    --_header-bg: rgba(255, 255, 255, 0.94);
    --_header-border: rgba(15, 23, 42, 0.08);
    --_header-shadow: var(--gas-shadow-l);
}

.gas-site-header--style-floating .gas-site-header__row--main {
    max-width: min(calc(100% - 2rem), var(--gas-header-max-width, var(--gas-wide-max-width, 92rem)));
    margin: var(--gas-space-s) auto;
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-l);
    box-shadow: var(--gas-shadow-s);
}

.gas-site-header--style-transparent {
    --_header-bg: transparent;
    --_header-border: transparent;
    --_header-shadow: none;
}

.gas-site-header--style-dark {
    --_header-bg: var(--gas-neutral-900);
    --_header-border: rgba(255, 255, 255, 0.14);
    --_header-text: var(--gas-white);
    --_header-muted: var(--gas-neutral-200);
    --_header-hover-bg: rgba(255, 255, 255, 0.1);
    --_nav-hover-color: var(--gas-white);
    --_nav-active-color: var(--gas-white);
    --_nav-active-bg: rgba(255, 255, 255, 0.14);
    --_member-hover-color: var(--gas-white);
    --_member-active-color: var(--gas-white);
    --_member-active-bg: rgba(255, 255, 255, 0.14);
}

.gas-site-header--style-contrast {
    --_header-bg: var(--gas-primary);
    --_header-border: rgba(255, 255, 255, 0.2);
    --_header-text: var(--gas-white);
    --_header-muted: var(--gas-primary-ultra-light);
    --_header-hover-bg: rgba(255, 255, 255, 0.12);
    --_nav-hover-color: var(--gas-white);
    --_nav-active-color: var(--gas-white);
    --_nav-active-bg: rgba(255, 255, 255, 0.16);
}

.gas-site-header--style-compact .gas-site-header__row--main,
.gas-site-header--style-compact .gas-site-header__row--nav-strip,
.gas-site-header--style-compact .gas-site-header__row--utility {
    padding-top: 3px;
    padding-bottom: 3px;
}

.gas-site-header--style-compact .gas-site-menu__link,
.gas-site-header--style-compact .gas-site-menu__trigger,
.gas-site-header--style-compact .gas-site-action-list__item a,
.gas-site-header--style-compact .gas-site-header__member-trigger {
    min-height: 30px;
}

/* -------------------------------------------------------------------------
   The 10 layout presets exposed in Header settings
   ------------------------------------------------------------------------- */

/* 1. standard: restrained default, no structural override. */
.gas-site-header--layout-standard .gas-site-header__row--main {
    min-height: 72px;
}

/* 2. classic-split: brand left, navigation/actions right. */
.gas-site-header--layout-classic-split .gas-site-header__row--main {
    gap: var(--gas-space-xl);
}

.gas-site-header--layout-classic-split .gas-site-header__row--main .gas-site-header__col--brand {
    justify-content: flex-start;
}

.gas-site-header--layout-classic-split .gas-site-header__row--main .gas-site-header__col--actions,
.gas-site-header--layout-classic-split .gas-site-header__row--main .gas-site-header__col--nav {
    justify-content: flex-end;
}

/* 3. centered-brand: brand centered, menu below or centered in its row. */
.gas-site-header--layout-centered-brand .gas-site-header__row--main {
    grid-template-columns: 1fr;
    justify-items: center;
}

.gas-site-header--layout-centered-brand .gas-site-header__row--main .gas-site-header__col,
.gas-site-header--layout-centered-brand .gas-site-header__row--nav-strip .gas-site-header__col {
    justify-content: center;
    width: 100%;
}

.gas-site-header--layout-centered-brand .gas-site-header__element--branding {
    justify-content: center;
    text-align: center;
}

.gas-site-header--layout-centered-brand .gas-site-menu--primary,
.gas-site-header--layout-centered-brand .gas-site-menu--gas {
    justify-content: center;
}

/* 4. utility-topbar: compact dark utility row above a quiet main row. */
.gas-site-header--layout-utility-topbar .gas-site-header__row--utility,
.gas-site-header--layout-utility-topbar .gas-site-header__row--promo {
    background: var(--gas-neutral-900);
    color: var(--gas-white);
    border-bottom-color: rgba(255, 255, 255, 0.12);
    padding-top: 4px;
    padding-bottom: 4px;
}

.gas-site-header--layout-utility-topbar .gas-site-header__row--utility a,
.gas-site-header--layout-utility-topbar .gas-site-header__row--utility button,
.gas-site-header--layout-utility-topbar .gas-site-header__row--promo a,
.gas-site-header--layout-utility-topbar .gas-site-header__row--promo button {
    color: inherit;
}

/* 5. nav-strip: main brand row, full-width navigation band. */
.gas-site-header--layout-nav-strip .gas-site-header__row--nav-strip {
    background: var(--gas-primary-ultra-light);
    border-top: 1px solid var(--gas-primary-light);
    border-bottom: 1px solid var(--gas-primary-light);
}

.gas-site-header--layout-nav-strip .gas-site-header__row--nav-strip .gas-site-header__col,
.gas-site-header--layout-nav-strip .gas-site-header__row--nav-strip .gas-site-menu--primary,
.gas-site-header--layout-nav-strip .gas-site-header__row--nav-strip .gas-site-menu--gas {
    justify-content: center;
    width: 100%;
}

/* 6. mega-editorial: roomier main row and stronger dropdown framing. */
.gas-site-header--layout-mega-editorial .gas-site-header__row--main {
    padding-top: var(--gas-space-m);
    padding-bottom: var(--gas-space-m);
}

.gas-site-header--layout-mega-editorial .gas-site-header__site-name {
    font-size: var(--gas-text-xl);
}

.gas-site-header--layout-mega-editorial .gas-site-header__mega-panel,
.gas-site-header--layout-mega-editorial .gas-site-menu__dropdown--fullwidth {
    border-top: 2px solid var(--gas-primary);
}

/* 7. minimal-app: app-like header, no promo/announcements, tight rows. */
.gas-site-header--layout-minimal-app {
    --_header-shadow: none;
}

.gas-site-header--layout-minimal-app .gas-site-header__site-description,
.gas-site-header--layout-minimal-app .gas-site-header__site-description--secondary,
.gas-site-header--layout-minimal-app .gas-site-header__row--announcements,
.gas-site-header--layout-minimal-app .gas-site-header__row--promo {
    display: none;
}

.gas-site-header--layout-minimal-app .gas-site-header__row--main {
    min-height: 56px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.gas-site-header--layout-minimal-app .gas-site-header__branding-logo {
    max-height: 40px;
}

/* 8. promo-led: announcement/promo surfaces visually lead the header. */
.gas-site-header--layout-promo-led .gas-site-header__row--announcements,
.gas-site-header--layout-promo-led .gas-site-header__row--promo {
    background: var(--gas-accent-ultra-light);
    border-bottom-color: var(--gas-accent-light);
}

.gas-site-header--layout-promo-led .gas-site-header__school-promo-inner,
.gas-site-header--layout-promo-led .gas-site-header__announcement-inner {
    justify-content: center;
}

/* 9. split-actions: nav centered, account/CTA separated on the edge. */
.gas-site-header--layout-split-actions .gas-site-header__row--main .gas-site-header__col--nav {
    justify-content: center;
}

.gas-site-header--layout-split-actions .gas-site-header__row--main .gas-site-header__col--actions {
    gap: var(--gas-space-m);
    justify-content: flex-end;
}

.gas-site-header--layout-split-actions .gas-site-header__element--account,
.gas-site-header--layout-split-actions .gas-site-header__element--cta,
.gas-site-header--layout-split-actions .gas-site-header__element--custom-link {
    margin-left: var(--gas-space-xs);
}

/* 10. brand-stack: vertical identity block with centered secondary rows. */
.gas-site-header--layout-brand-stack .gas-site-header__element--branding {
    justify-content: center;
    text-align: center;
}

.gas-site-header--layout-brand-stack .gas-site-header__branding .gas-site-header__brand-link {
    flex-direction: column;
    gap: var(--gas-space-xs);
}

.gas-site-header--layout-brand-stack .gas-site-header__site-description {
    white-space: normal;
}

.gas-site-header--layout-brand-stack .gas-site-header__row--nav-strip .gas-site-header__col,
.gas-site-header--layout-brand-stack .gas-site-header__row--utility .gas-site-header__col {
    justify-content: center;
}

@media (max-width: 1100px) {
    .gas-site-header--layout-centered-brand .gas-site-header__row--main,
    .gas-site-header--layout-brand-stack .gas-site-header__row--main {
        justify-items: stretch;
    }

    .gas-site-header--layout-centered-brand .gas-site-header__row--main .gas-site-header__col,
    .gas-site-header--layout-brand-stack .gas-site-header__row--main .gas-site-header__col {
        justify-content: space-between;
    }
}
