/* CourseSuggest Gen-Z Header / Mega Menu v2
   Presentation-only layer. Existing PHP links, URLs and data are untouched. */
:root{--cs-ink:#17182b;--cs-muted:#697087;--cs-purple:#6d4aff;--cs-pink:#ff4fa3;--cs-cyan:#19c7d8;--cs-bg:#f7f7fb;--cs-border:rgba(23,24,43,.09);--cs-shadow:0 24px 70px rgba(23,24,43,.16)}
#header-nav{height:76px!important;padding:0!important;background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--cs-border)!important;box-shadow:0 8px 28px rgba(23,24,43,.06)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
#header-nav>.container-fluid{height:76px!important;display:flex!important;align-items:center!important;gap:18px!important;padding:0 28px!important}
#header-nav .navbar-brand{display:flex!important;align-items:center!important;flex:0 0 auto!important;margin:0!important;padding:0!important}
#header-nav .navbar-brand img{display:block!important;max-height:46px!important;width:auto!important;object-fit:contain!important}
#header-nav .navbar-toggler{border:0!important;background:#f2f1ff!important;border-radius:13px!important;width:44px!important;height:44px!important;display:none!important;align-items:center!important;justify-content:center!important;padding:0!important;cursor:pointer!important}
#header-nav .navbar-toggler i{font-size:23px!important;color:var(--cs-ink)!important}
#header-nav #navbarSupportedContent{display:flex!important;flex:1 1 auto!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;min-width:0!important;margin:0!important;padding:0!important}
#header-nav #navbarSupportedContent>.navbar-nav.nav{display:flex!important;flex:1 1 auto!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-width:0!important;width:auto!important;margin:0!important;padding:0!important;overflow:visible!important;list-style:none!important}
#header-nav .navbar-nav.nav>li{list-style:none!important}
#header-nav .navbar-nav.nav>li.big-nav{position:relative!important;display:flex!important;align-items:center!important;flex:0 0 auto!important;margin:0!important;padding:0!important}
#header-nav .navbar-nav.nav>li.big-nav>a{display:flex!important;align-items:center!important;justify-content:center!important;min-height:42px!important;padding:0 13px!important;margin:0!important;border:1px solid transparent!important;border-radius:13px!important;background:transparent!important;color:var(--cs-ink)!important;font-size:12px!important;font-weight:800!important;letter-spacing:.035em!important;line-height:1!important;text-decoration:none!important;white-space:nowrap!important;transition:.18s ease!important}
#header-nav .navbar-nav.nav>li.big-nav>a:hover,#header-nav .navbar-nav.nav>li.big-nav>a:focus,#header-nav .navbar-nav.nav>li.big-nav.is-open>a{background:linear-gradient(135deg,#6d4aff,#9b5cff)!important;color:#fff!important;box-shadow:0 8px 22px rgba(109,74,255,.22)!important;transform:translateY(-1px)!important}
#header-nav .navbar-nav.nav>li.big-nav>a:after{content:""!important;display:inline-block!important;width:6px!important;height:6px!important;margin-left:8px!important;border:0!important;border-right:1.6px solid currentColor!important;border-bottom:1.6px solid currentColor!important;transform:rotate(45deg) translateY(-2px)!important;opacity:.65!important}
/* Mega panel */
#header-nav .navbar-nav.nav>li.big-nav>ul{box-sizing:border-box!important;position:absolute!important;display:grid!important;grid-template-columns:255px minmax(0,1fr)!important;gap:10px!important;top:calc(100% + 12px)!important;left:50%!important;right:auto!important;width:min(1060px,calc(100vw - 48px))!important;height:auto!important;max-height:min(650px,calc(100vh - 96px))!important;margin:0!important;padding:12px!important;overflow:hidden!important;list-style:none!important;background:#fff!important;border:1px solid var(--cs-border)!important;border-radius:24px!important;box-shadow:var(--cs-shadow)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translate(-50%,8px)!important;transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;z-index:99999!important}
#header-nav .navbar-nav.nav>li.big-nav:hover>ul,#header-nav .navbar-nav.nav>li.big-nav:focus-within>ul,#header-nav .navbar-nav.nav>li.big-nav.is-open>ul{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate(-50%,0)!important}
/* Tab rail */
#header-nav .navbar-nav.nav>li.big-nav>ul>li{display:block!important;position:static!important;width:auto!important;min-width:0!important;height:auto!important;margin:0!important;padding:0!important;list-style:none!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>a{display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:46px!important;width:100%!important;box-sizing:border-box!important;margin:2px 0!important;padding:10px 13px!important;border:0!important;border-radius:13px!important;background:transparent!important;color:#50586d!important;font-size:12px!important;font-weight:750!important;line-height:1.3!important;text-decoration:none!important;transition:.16s ease!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>a:hover,#header-nav .navbar-nav.nav>li.big-nav>ul>li.is-active>a,#header-nav .navbar-nav.nav>li.big-nav>ul>li:first-child>a{background:#f0edff!important;color:#5d3be5!important;box-shadow:none!important;padding-left:16px!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>a span{font-size:15px!important;opacity:.55!important}
/* Option area */
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul{position:absolute!important;display:none!important;box-sizing:border-box!important;top:12px!important;left:277px!important;right:12px!important;width:auto!important;height:calc(100% - 24px)!important;max-height:none!important;margin:0!important;padding:20px!important;overflow:auto!important;border:1px solid rgba(23,24,43,.05)!important;border-radius:18px!important;background:linear-gradient(180deg,#faf9ff,#f6f7fb)!important;list-style:none!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li:hover>ul,#header-nav .navbar-nav.nav>li.big-nav>ul>li.is-active>ul,#header-nav .navbar-nav.nav>li.big-nav>ul>li:first-child>ul{display:block!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul:before{content:"Explore options";display:block!important;margin:0 0 12px!important;color:#20233a!important;font-size:15px!important;font-weight:850!important;letter-spacing:-.02em!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li{display:block!important;float:left!important;width:33.333%!important;min-width:180px!important;box-sizing:border-box!important;margin:0!important;padding:4px 8px!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>a{display:block!important;margin:0!important;padding:9px 10px!important;border-radius:10px!important;background:transparent!important;color:#24283b!important;font-size:12px!important;font-weight:700!important;line-height:1.35!important;text-decoration:none!important;transition:.15s ease!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>a:hover{background:#fff!important;color:#6946ed!important;box-shadow:0 5px 16px rgba(23,24,43,.06)!important;transform:translateX(2px)!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>ul{display:block!important;position:static!important;width:auto!important;margin:2px 0 8px!important;padding:0!important;background:transparent!important;list-style:none!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>ul>li{display:block!important;width:100%!important;margin:0!important;padding:0!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>ul>li>a{display:block!important;padding:5px 10px!important;border-radius:7px!important;color:#737b8f!important;font-size:11.5px!important;font-weight:600!important;line-height:1.35!important;text-decoration:none!important}
#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li>ul>li>a:hover{background:#fff!important;color:#ff4f9a!important}
/* Right-side actions */
#header-nav .navbar-nav.nav>.nav-item{display:flex!important;align-items:center!important;flex:0 0 auto!important;margin:0 0 0 5px!important}
#header-nav .navbar-nav.nav>.nav-item>a{min-height:40px!important;padding:0 13px!important;border-radius:12px!important;font-size:12px!important;font-weight:800!important;white-space:nowrap!important}
#header-nav #navbarBtnCreateListing{background:linear-gradient(135deg,#6d4aff,#ff4fa3)!important;border:0!important;color:#fff!important;box-shadow:0 8px 20px rgba(109,74,255,.18)!important}
#header-nav #navbarBtnSearch{width:40px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#f3f1ff!important;color:#5f42d8!important}
#header-nav .dropdown-menu{border:1px solid var(--cs-border)!important;border-radius:16px!important;box-shadow:var(--cs-shadow)!important;padding:8px!important}
#header-nav .dropdown-menu .dropdown-item{border-radius:10px!important;padding:9px 11px!important;font-size:12px!important;font-weight:700!important}
/* Make the page account for the new header */
#header-nav+.dummy-navbar,#header-nav~.dummy-navbar{height:76px!important}
@media (max-width:1199px) and (min-width:992px){#header-nav>.container-fluid{padding:0 18px!important;gap:10px!important}#header-nav .navbar-nav.nav>li.big-nav>a{padding:0 9px!important;font-size:11px!important}#header-nav .navbar-nav.nav>.nav-item>a{padding:0 9px!important}}
@media (max-width:991px){#header-nav{height:68px!important}#header-nav>.container-fluid{height:68px!important;padding:0 16px!important}#header-nav .navbar-toggler{display:flex!important;margin-left:auto!important}#header-nav #navbarSupportedContent{position:absolute!important;display:none!important;top:68px!important;left:10px!important;right:10px!important;width:auto!important;max-height:calc(100vh - 82px)!important;overflow:auto!important;padding:10px!important;background:#fff!important;border:1px solid var(--cs-border)!important;border-radius:20px!important;box-shadow:var(--cs-shadow)!important}#header-nav #navbarSupportedContent.show,#header-nav #navbarSupportedContent.collapsing{display:block!important}#header-nav #navbarSupportedContent>.navbar-nav.nav{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;width:100%!important}#header-nav .navbar-nav.nav>li.big-nav{display:block!important;width:100%!important}#header-nav .navbar-nav.nav>li.big-nav>a{justify-content:space-between!important;width:100%!important;min-height:48px!important;padding:0 14px!important;background:#f7f7fb!important}#header-nav .navbar-nav.nav>li.big-nav>ul{position:static!important;display:none!important;grid-template-columns:1fr!important;width:100%!important;max-height:none!important;transform:none!important;padding:8px!important;margin:0!important;border-radius:16px!important;box-shadow:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}#header-nav .navbar-nav.nav>li.big-nav.is-open>ul{display:grid!important}#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul{position:static!important;display:none!important;width:100%!important;height:auto!important;max-height:420px!important;margin:4px 0 8px!important;padding:10px!important;overflow:auto!important;border-radius:13px!important}#header-nav .navbar-nav.nav>li.big-nav>ul>li.is-active>ul,#header-nav .navbar-nav.nav>li.big-nav>ul>li:first-child>ul{display:block!important}#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li,#header-nav .navbar-nav.nav>li.big-nav>ul>li>ul>li.col3{width:100%!important;min-width:0!important;float:none!important}#header-nav .navbar-nav.nav>.nav-item{width:100%!important;margin:3px 0!important}#header-nav .navbar-nav.nav>.nav-item>a{width:100%!important;justify-content:center!important} }
@media (prefers-reduced-motion:reduce){#header-nav *{transition:none!important;animation:none!important}}
