/* Shared public navigation.
   Every rule is rooted at #publicSiteHeader so route-level styles cannot
   accidentally change the site chrome. */

body.public-theme > #publicSiteHeader {
    --public-header-navy: #061e2e;
    --public-header-ink: #102a3a;
    --public-header-copy: #536875;
    --public-header-teal: #13b8a6;
    --public-header-mint: #d8f5ef;
    --public-header-gold: #f6b94a;
    z-index: 1040;
    min-height: 78px;
    padding: .65rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background: rgba(6, 30, 46, .96) !important;
    box-shadow: 0 10px 34px rgba(3, 22, 34, .2) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    color-scheme: dark;
}

body.public-theme > #publicSiteHeader > .container {
    gap: .85rem;
}

body.public-theme > #publicSiteHeader .site-brand {
    flex: 0 0 auto;
    margin-right: .5rem;
    padding: 0;
}

body.public-theme > #publicSiteHeader .site-brand img {
    display: block;
    width: auto;
    height: 46px;
    max-width: 180px;
    object-fit: contain;
}

body.public-theme > #publicSiteHeader .navbar-toggler {
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 10px;
    padding: .42rem .58rem;
    box-shadow: none;
}

body.public-theme > #publicSiteHeader .navbar-toggler:focus-visible {
    outline: 3px solid #ffc35c;
    outline-offset: 3px;
    box-shadow: none;
}

body.public-theme > #publicSiteHeader .site-nav {
    gap: .08rem;
}

body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link {
    position: relative;
    padding: .68rem .72rem;
    color: rgba(255, 255, 255, .78);
    font-size: .88rem;
    font-weight: 650;
    white-space: nowrap;
}

body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link:hover,
body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link:focus,
body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link.active,
body.public-theme > #publicSiteHeader .site-nav > .nav-item.show > .nav-link {
    color: #ffffff;
}

body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link.active::after {
    content: "";
    position: absolute;
    right: .72rem;
    bottom: .28rem;
    left: .72rem;
    height: 2px;
    border-radius: 99px;
    background: var(--public-header-teal);
}

body.public-theme > #publicSiteHeader .site-nav-menu {
    width: min(310px, calc(100vw - 2rem));
    margin-top: .75rem;
    padding: .65rem;
    border: 1px solid rgba(9, 61, 81, .12);
    border-radius: 16px;
    background: rgba(255, 255, 255, .99);
    box-shadow: 0 22px 60px rgba(5, 31, 45, .18);
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: .7rem;
    align-items: center;
    padding: .65rem;
    border-radius: 11px;
    color: var(--public-header-ink);
    white-space: normal;
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item:hover,
body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item:focus {
    background: #edf8f6;
    color: var(--public-header-ink);
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item > i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--public-header-mint);
    color: #06776f;
    font-size: 1rem;
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item span {
    min-width: 0;
    display: grid;
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item strong {
    color: var(--public-header-ink);
    font-size: .9rem;
}

body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item small {
    color: #657681;
    font-size: .75rem;
}

body.public-theme > #publicSiteHeader .site-nav-tool {
    margin-left: .35rem;
}

body.public-theme > #publicSiteHeader .theme-toggle-btn {
    min-width: 40px;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
}

body.public-theme > #publicSiteHeader .theme-toggle-btn:hover,
body.public-theme > #publicSiteHeader .theme-toggle-btn:focus-visible {
    border-color: rgba(255, 255, 255, .72);
    background: rgba(255, 255, 255, .16);
    color: #ffffff;
}

body.public-theme > #publicSiteHeader .theme-toggle-btn:focus-visible,
body.public-theme > #publicSiteHeader .site-login-btn:focus-visible,
body.public-theme > #publicSiteHeader .site-register-btn:focus-visible,
body.public-theme > #publicSiteHeader .nav-link:focus-visible,
body.public-theme > #publicSiteHeader .dropdown-item:focus-visible {
    outline: 3px solid #ffc35c;
    outline-offset: 3px;
    box-shadow: none;
}

body.public-theme > #publicSiteHeader .theme-toggle-btn i,
body.public-theme > #publicSiteHeader .theme-toggle-btn span {
    color: inherit;
}

body.public-theme > #publicSiteHeader .site-login-btn,
body.public-theme > #publicSiteHeader .site-register-btn {
    padding: .62rem .95rem;
    border-radius: 10px;
    font-size: .86rem;
    font-weight: 750;
    white-space: nowrap;
}

body.public-theme > #publicSiteHeader .site-login-btn {
    margin-left: .4rem;
    border: 1px solid rgba(255, 255, 255, .34);
    background: transparent;
    color: #ffffff;
}

body.public-theme > #publicSiteHeader .site-register-btn {
    margin-left: .35rem;
    border: 1px solid var(--public-header-gold);
    background: var(--public-header-gold);
    color: var(--public-header-navy);
}

body.public-theme > #publicSiteHeader .site-login-btn:hover,
body.public-theme > #publicSiteHeader .site-login-btn:focus {
    border-color: rgba(255, 255, 255, .56);
    background: rgba(255, 255, 255, .1);
    color: #ffffff;
}

body.public-theme > #publicSiteHeader .site-register-btn:hover,
body.public-theme > #publicSiteHeader .site-register-btn:focus {
    border-color: #ffd47b;
    background: #ffd47b;
    color: var(--public-header-navy);
}

body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu {
    border-color: #365261;
    background: #102b36;
    box-shadow: 0 22px 60px rgba(0, 0, 0, .32);
}

body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item,
body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item strong {
    color: #edf6f8;
}

body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item small {
    color: #b8c9cf;
}

body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item:hover,
body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item:focus {
    background: #173a45;
    color: #ffffff;
}

body.public-theme[data-theme="dark"] > #publicSiteHeader .site-nav-menu .dropdown-item > i {
    background: #173f43;
    color: #8ce8da;
}

@media (max-width: 1199.98px) and (min-width: 992px) {
    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link {
        padding-right: .42rem;
        padding-left: .42rem;
        font-size: .78rem;
    }

    body.public-theme > #publicSiteHeader .site-login-btn,
    body.public-theme > #publicSiteHeader .site-register-btn {
        margin-left: .18rem;
        padding-right: .58rem;
        padding-left: .58rem;
        font-size: .78rem;
    }

    body.public-theme > #publicSiteHeader .site-nav-tool {
        margin-left: .18rem;
    }
}

@media (max-width: 991.98px) {
    body.public-theme > #publicSiteHeader {
        min-height: 70px;
        padding: .55rem 0;
    }

    body.public-theme > #publicSiteHeader .site-brand img {
        height: 42px;
        max-width: 165px;
    }

    body.public-theme > #publicSiteHeader .navbar-collapse {
        max-height: calc(100vh - 86px);
        overflow-y: auto;
        margin-top: .7rem;
        padding: .75rem;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 14px;
        background: #0b2838;
    }

    body.public-theme > #publicSiteHeader .site-nav {
        align-items: stretch !important;
        gap: .2rem;
    }

    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link {
        padding: .7rem .75rem;
        border-radius: 9px;
        font-size: .9rem;
    }

    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link:hover,
    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link:focus,
    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link.active {
        background: rgba(255, 255, 255, .08);
    }

    body.public-theme > #publicSiteHeader .site-nav > .nav-item > .nav-link.active::after {
        display: none;
    }

    body.public-theme > #publicSiteHeader .site-nav-menu {
        width: 100%;
        margin: .2rem 0 .45rem;
        border-color: rgba(255, 255, 255, .14);
        background: #102f3d;
        box-shadow: none;
    }

    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item,
    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item strong {
        color: #edf6f8;
    }

    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item small {
        color: #b8c9cf;
    }

    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item:hover,
    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item:focus {
        background: #173f4c;
        color: #ffffff;
    }

    body.public-theme > #publicSiteHeader .site-nav-menu .dropdown-item > i {
        background: #173f43;
        color: #8ce8da;
    }

    body.public-theme > #publicSiteHeader .site-nav-tool {
        margin: .35rem 0 0;
    }

    body.public-theme > #publicSiteHeader .theme-toggle-btn,
    body.public-theme > #publicSiteHeader .site-login-btn,
    body.public-theme > #publicSiteHeader .site-register-btn {
        width: 100%;
        min-width: 0;
        min-height: 44px;
        margin: .2rem 0 0;
        border-radius: 10px;
    }

    body.public-theme > #publicSiteHeader .theme-toggle-btn {
        display: flex;
        justify-content: center;
        gap: .5rem;
        padding: .5rem .75rem;
    }

    body.public-theme > #publicSiteHeader .theme-toggle-btn .theme-label {
        position: static !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        white-space: normal !important;
    }

    /* The homepage intentionally uses its app-style navigation below this
       breakpoint. The exception lives here so home.css cannot alter header. */
    body.public-theme.home-page > #publicSiteHeader {
        display: none !important;
    }
}

@media print {
    body.public-theme > #publicSiteHeader {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.public-theme > #publicSiteHeader,
    body.public-theme > #publicSiteHeader * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}