/* Keep primary navigation separate from account/app tools. */
.gu-navigation > .container-fluid { max-width: 1440px; gap: .5rem 1.25rem; padding-inline: 1.25rem; }
.gu-navigation .navbar-brand { flex-shrink: 0; margin-right: 0; font-size: 1.2rem; }
.gu-navigation .navbar-collapse { min-width: 0; }
.gu-navigation .nav-link, .gu-navigation .btn { white-space: nowrap; font-size: .95rem; }
.gu-navigation .gu-primary-links { gap: 0 .35rem; }
.gu-navigation .gu-account-links {
    display: flex; flex-wrap: wrap; align-items: center; gap: .65rem 1rem;
}
.gu-navigation .gu-account-links > .dropdown { position: relative; }
.gu-navigation .gu-account-links .dropdown-menu {
    position: absolute; top: calc(100% + .4rem); right: 0; left: auto;
    margin: 0; min-width: 13rem; max-width: calc(100vw - 2.5rem);
    max-height: min(22rem, 55dvh); overflow-y: auto;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.18);
}
.gu-navigation .gu-account-links .nav-link { color: #c7cbce; padding: .5rem 0; }
.gu-navigation .nav-link:hover, .gu-navigation .nav-link:focus { color: #fff; }
.gu-navigation .gu-notification-link { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: .65rem; }
.gu-navigation .gu-notification-link .bi { font-size: 1.2rem; }
.gu-navigation .gu-notification-count { position: absolute; top: -.45rem; right: -.7rem; font-size: .7rem; min-width: 1.25rem; line-height: 1.1; }
.gu-notification-count[hidden] { display: none !important; }
.gu-navigation .dropdown-item { font-size: .95rem; padding-block: .6rem; }
.gu-nav-icon { display: none; }
.gu-mobile-actions, .gu-mobile-tabbar, .gu-mobile-search-scrim, .gu-mobile-search-dock { display: none; }
[data-install-link][hidden], [data-install-app][hidden] { display: none !important; }
@media (display-mode: standalone), (display-mode: minimal-ui), (display-mode: window-controls-overlay) {
    [data-install-link], [data-install-app] { display: none !important; }
}
@media (min-width: 1200px) {
    .gu-navigation .navbar-collapse { flex-direction: row; align-items: center; gap: 1rem; }
    .gu-navigation .gu-primary-links { flex-shrink: 0; }
    .gu-navigation .gu-account-links { margin-left: auto; flex-wrap: nowrap; }
}
@media (max-width: 1199.98px) {
    /* Let the account popup extend beyond the bar rather than clip or resize it. */
    .gu-navigation .navbar-collapse.show { overflow: visible; }
    .gu-navigation .gu-primary-links { padding-top: .5rem; }
    .gu-navigation .gu-account-links { padding: .75rem 0; border-top: 1px solid #ffffff26; }
    .gu-navigation .gu-account-links .dropdown-menu { right: auto; left: 0; min-width: min(13rem, calc(100vw - 7.9rem)); }
    .gu-navigation .gu-account-links .dropdown-item { white-space: normal; overflow-wrap: anywhere; }
}

@media (max-width: 767.98px) {
    body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
    body .gu-install-notice { bottom: calc(74px + env(safe-area-inset-bottom)); }
    .gu-navigation { padding-block: 0; box-shadow: 0 2px 12px rgba(0,0,0,.16); }
    .gu-navigation > .container-fluid {
        max-width: none; padding: .55rem .9rem .65rem; gap: 0;
        display: flex; flex-wrap: wrap; align-items: center;
    }
    .gu-navigation .navbar-brand { font-size: 1.18rem; line-height: 1; }
    .gu-navigation .navbar-toggler { display: none; }
    .gu-navigation .navbar-collapse { flex: 0 0 100%; order: 3; padding-top: .55rem; }
    .gu-navigation .gu-primary-links { gap: 0; padding-top: 0; }
    .gu-navigation .gu-primary-links .nav-link { display: flex; align-items: center; gap: .75rem; min-height: 46px; padding: .65rem .25rem; }
    .gu-navigation .gu-primary-links .dropdown-menu { margin: 0 0 .5rem 1.9rem; border: 0; background: rgba(255,255,255,.08); }
    .gu-navigation .gu-primary-links .dropdown-item { color: #f8f9fa; min-height: 42px; }
    .gu-navigation .gu-primary-links .dropdown-item:hover,
    .gu-navigation .gu-primary-links .dropdown-item:focus { color: #15221b; }
    .gu-navigation .gu-account-links { display: none; }
    .gu-navigation .gu-nav-icon { display: inline-block; width: 1.25rem; font-size: 1.05rem; text-align: center; }

    .gu-mobile-actions { display: flex; align-items: center; gap: .55rem; margin-left: auto; }
    .gu-mobile-search-toggle, .gu-mobile-action {
        position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
        width: 42px; min-width: 42px; height: 42px; padding: 2px; border: 0; border-radius: 12px;
        color: #f8f9fa; background: transparent; text-decoration: none; cursor: pointer;
    }
    .gu-mobile-search-toggle { display: none; font-size: 1.25rem; }
    .gu-navigation.has-scrolled .gu-mobile-search-toggle { display: inline-flex; }
    .gu-mobile-action > .bi, .gu-mobile-account summary > .bi { font-size: 1.2rem; line-height: 1.15; }
    .gu-mobile-account .gu-mobile-avatar { position: relative; display: block; flex: 0 0 26px; width: 26px; min-width: 26px; max-width: 26px; height: 26px; min-height: 26px; max-height: 26px; overflow: hidden; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; }
    .gu-mobile-account .gu-mobile-avatar img[data-mobile-avatar] { position: absolute; inset: 0; display: block; width: 100%; max-width: 100%; height: 100%; max-height: 100%; object-fit: cover; border-radius: inherit; }
    .gu-mobile-account .gu-mobile-avatar > .bi { position: absolute; inset: 0; display: grid; place-items: center; font-size: 1.2rem; line-height: 1; }
    .gu-mobile-action small { margin-top: 1px; font-size: .58rem; line-height: 1; color: #d3d8dc; }
    .gu-mobile-action:hover, .gu-mobile-action:focus-visible, .gu-mobile-search-toggle:hover, .gu-mobile-search-toggle:focus-visible { color: #fff; background: rgba(255,255,255,.1); outline: none; }
    .gu-mobile-account { position: relative; }
    .gu-mobile-account > summary { list-style: none; }
    .gu-mobile-account > summary::-webkit-details-marker { display: none; }
    .gu-mobile-account-menu {
        position: absolute; top: calc(100% + .65rem); right: 0; z-index: 1040; width: max-content; min-width: 190px;
        padding: .45rem; border: 1px solid #e2e8e4; border-radius: 14px; background: #fff; color: #18231d;
        box-shadow: 0 .75rem 2rem rgba(0,0,0,.2);
    }
    .gu-mobile-account-menu a { display: flex; align-items: center; gap: .65rem; min-height: 43px; padding: .55rem .65rem; border-radius: 9px; color: #18231d; text-decoration: none; }
    .gu-mobile-account-menu a:hover, .gu-mobile-account-menu a:focus-visible { background: #edf7f1; }

    .gu-mobile-search-scrim:not([hidden]) {
        position: fixed; inset: var(--gu-mobile-nav-bottom, 60px) 0 0; z-index: 1025;
        display: block; background: rgba(10,20,14,.46); backdrop-filter: blur(2px);
    }
    .gu-mobile-search-dock:not([hidden]) {
        position: fixed; top: var(--gu-mobile-nav-bottom, 60px); right: 0; left: 0; z-index: 1030;
        display: block; max-height: calc(100dvh - var(--gu-mobile-nav-bottom, 60px) - 74px - env(safe-area-inset-bottom));
        overflow-y: auto; padding: .65rem .85rem .9rem; border-bottom: 1px solid #dce5df;
        border-radius: 0 0 20px 20px; background: #f7faf8; box-shadow: 0 14px 32px rgba(9,31,18,.22);
    }
    .gu-mobile-search-dock-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .55rem; color: #183c28; }
    .gu-mobile-search-dock-heading button { display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 50%; background: #e8efeb; color: #344b3c; }
    .gu-mobile-search-dock .service-search { margin: 0 !important; box-shadow: 0 4px 18px rgba(18,35,26,.08); }
    .gu-mobile-search-dock .service-search.is-collapsed { display: block; }
    .gu-mobile-search-dock .service-query-field { position: relative; }
    .gu-mobile-search-dock .service-search-results { position: absolute; top: calc(100% + .4rem); right: 0; left: 0; z-index: 1050; max-height: min(35dvh, 300px); overflow-y: auto; }
    .gu-mobile-search-dock .blog-catalogue-search { display: block; margin: 0; }
    .gu-mobile-search-dock .blog-catalogue-search .blog-search { display: block; }
    .gu-mobile-search-dock .blog-catalogue-search button[data-clear-course-search] { min-height: 38px; margin-top: .45rem; }
    .gu-mobile-search-dock .course-search-results { margin: .55rem 0 0; max-height: 42dvh; overflow-y: auto; }
    body.gu-mobile-search-open { overflow: hidden; }
    .gu-mobile-tabbar {
        position: fixed; right: 0; bottom: 0; left: 0; z-index: 1035;
        display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end;
        min-height: calc(64px + env(safe-area-inset-bottom)); padding: 5px .35rem calc(5px + env(safe-area-inset-bottom));
        border-top: 1px solid #e2e8e4; background: rgba(255,255,255,.97); backdrop-filter: blur(16px);
        box-shadow: 0 -5px 24px rgba(15,35,25,.1);
    }
    .gu-tabbar-link { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; height: 50px; padding: 0; border: 0; background: transparent; color: #66736c; text-decoration: none; font: inherit; }
    .gu-tabbar-link > .bi { font-size: 1.25rem; line-height: 1; }
    .gu-tabbar-link > span { font-size: .64rem; line-height: 1.05; font-weight: 600; }
    .gu-tabbar-link.is-active { color: #157347; }
    .gu-tabbar-link:focus-visible, .gu-tabbar-create:focus-visible { outline: 3px solid #0dcaf0; outline-offset: 2px; border-radius: 12px; }
    .gu-tabbar-create { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; height: 62px; color: #157347; text-decoration: none; }
    .gu-tabbar-create > span { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-top: -23px; border: 4px solid #fff; border-radius: 50%; background: #157347; color: #fff; box-shadow: 0 4px 14px rgba(10,63,38,.27); font-size: 1.25rem; }
    .gu-tabbar-create small { font-size: .6rem; line-height: 1; font-weight: 700; white-space: nowrap; }

    .home-create-menu { display: none !important; }
    .home-desktop-sell { display: none !important; }
    .floating-cta:not(.home-desktop-sell) { bottom: calc(78px + env(safe-area-inset-bottom)); right: 12px; z-index: 1030; }
    #floating-cart { bottom: calc(76px + env(safe-area-inset-bottom)) !important; right: 12px !important; }
}
