/* ============================================================================
   gbi-nav.css — GBI Redesign global chrome (header + footer)
   Loaded site-wide. EVERY selector is namespaced under .gbi-nav / .gbi-footer
   (and buttons use .gbi-btn*) so it can never match Bootstrap's .nav/.btn/.menu
   on existing pages. Ported from the prototype nav (source/nav.py) with all
   classes renamed to a gbi- prefix.
   ============================================================================ */

/* ---------- container ---------- */
.gbi-nav .gbi-wrap,
.gbi-footer .gbi-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- header: navy strip, white type, crimson CTA ---------- */
.gbi-nav{position:sticky;top:0;z-index:90;background:var(--brand);border-bottom:1px solid rgba(255,255,255,.12);font-family:var(--font-text)}
.gbi-nav-inner{display:flex;align-items:center;justify-content:space-between;height:76px;gap:18px}
.gbi-nav-inner .gbi-logo img{height:46px;display:block}
.gbi-nav *{box-sizing:border-box}

.gbi-menu{display:flex;list-style:none;gap:6px;align-items:center;margin:0;padding:0}
.gbi-menu>li{position:relative}
.gbi-menu>li>a{display:block;padding:10px 14px;color:#fff;text-decoration:none;font-size:15px;font-weight:600;border-radius:8px}
.gbi-menu>li>a:hover{color:var(--gold);background:rgba(255,255,255,.08)}

.gbi-menu .gbi-sub,.gbi-account .gbi-sub{visibility:hidden;opacity:0;transition:opacity .15s ease;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 44px rgba(5,27,67,.14);padding:20px 22px;min-width:250px;z-index:99}
.gbi-menu li:hover>.gbi-sub,.gbi-menu li:focus-within>.gbi-sub{visibility:visible;opacity:1}
.gbi-menu .gbi-sub a,.gbi-account .gbi-sub a{display:block;padding:7px 4px;color:var(--ink);text-decoration:none;font-size:14.5px;border-radius:6px}
.gbi-menu .gbi-sub a:hover,.gbi-account .gbi-sub a:hover{color:var(--crimson)}
.gbi-menu .gbi-sub .gbi-subhead{display:block;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--crimson);font-weight:700;margin:10px 0 6px}
.gbi-menu .gbi-sub .gbi-subhead:first-child{margin-top:0}
.gbi-menu .gbi-mega{display:flex;gap:34px;min-width:560px}
.gbi-menu .gbi-mega .gbi-col{min-width:240px}
.gbi-menu .gbi-sub .gbi-viewall{font-weight:700;color:var(--blue);margin-top:8px}

.gbi-nav-cta{display:flex;align-items:center;gap:14px;flex-shrink:0}
.gbi-nav-cta .gbi-login{color:rgba(255,255,255,.85);text-decoration:none;font-size:14.5px;font-weight:600}
.gbi-nav-cta .gbi-login:hover{color:var(--gold)}

/* header buttons (prefixed so they never touch Bootstrap .btn) */
.gbi-btn{display:inline-block;padding:11px 22px;border-radius:8px;font-weight:600;font-size:14.5px;text-decoration:none;transition:all .18s ease;border:2px solid transparent;cursor:pointer;line-height:1.2;white-space:nowrap}
.gbi-btn-crimson{background:var(--crimson);color:#fff}
.gbi-btn-crimson:hover{background:#9c2645;transform:translateY(-1px);color:#fff}

/* cart badge inside the new header */
.gbi-nav .gbi-cart{position:relative;color:#fff;text-decoration:none;display:inline-flex;align-items:center;font-size:20px}
.gbi-nav .gbi-cart:hover{color:var(--gold)}
.gbi-nav .gbi-cart .gbi-cart-badge{position:absolute;top:-8px;right:-10px;background:var(--crimson);color:#fff;font-size:11px;font-weight:700;line-height:1;padding:3px 6px;border-radius:20px;min-width:18px;text-align:center}
/* legacy style.css forces #cart-item-badge{left:25px!important} under 991px, which
   stretches our right-anchored badge into a floating pill — reset it. */
.gbi-nav .gbi-cart #cart-item-badge{left:auto !important}

/* right-side account dropdown (logged-in) */
.gbi-account{position:relative}
/* NB: the toggle is an <a> with no href; it carries .gbi-acct-toggle so Bootstrap's
   `a:not([href]):not([class])` reboot rule can't force it to inherit body colour.
   Selector is .gbi-nav-scoped to win specificity over that reboot rule too. */
.gbi-nav .gbi-account>a{display:inline-flex;align-items:center;gap:6px;color:#fff;text-decoration:none;font-size:14.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.gbi-nav .gbi-account>a:hover{color:var(--gold)}
.gbi-account .gbi-sub{right:0;left:auto;min-width:200px}
.gbi-account:hover>.gbi-sub,.gbi-account:focus-within>.gbi-sub{visibility:visible;opacity:1}

/* in-menu CTA items are mobile-only; the logo must never collapse */
.gbi-menu-cta{display:none}
.gbi-nav-inner .gbi-logo{flex-shrink:0}

.gbi-navtoggle,.gbi-hamburger{display:none}

@media(max-width:1080px){
  .gbi-hamburger{display:block;font-size:26px;cursor:pointer;color:#fff;padding:6px 10px;order:3}
  /* push the logo left so the cart packs next to the hamburger (not mid-bar) */
  .gbi-nav-inner .gbi-logo{margin-right:auto}
  .gbi-menu{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 24px;border-bottom:1px solid var(--line);max-height:calc(100vh - 76px);overflow-y:auto;box-shadow:0 24px 40px rgba(5,27,67,.15);z-index:95}
  .gbi-menu>li>a{color:var(--ink)}
  .gbi-menu>li>a:hover{color:var(--crimson);background:var(--grey)}
  .gbi-navtoggle:checked~.gbi-menu{display:flex}
  .gbi-menu .gbi-sub,.gbi-menu .gbi-mega{visibility:visible;opacity:1;position:static;box-shadow:none;border:none;padding:0 0 8px 16px;min-width:0;display:block}
  .gbi-menu .gbi-mega .gbi-col{min-width:0}
  .gbi-nav-cta .gbi-login{display:none}
  /* move Account + Book a Call out of the top bar and into the hamburger menu */
  .gbi-nav-cta .gbi-account,
  .gbi-nav-cta .gbi-btn-crimson{display:none}
  .gbi-menu-cta{display:block}
  .gbi-menu .gbi-menu-cta-top{margin-top:8px;border-top:1px solid var(--line);padding-top:8px}
  .gbi-menu .gbi-menu-cta-book{margin-top:12px}
  .gbi-menu .gbi-menu-cta-book>a{display:block;text-align:center;background:var(--crimson);color:#fff;border-radius:8px;padding:13px 16px;font-weight:700}
  .gbi-menu .gbi-menu-cta-book>a:hover{background:#9c2645;color:#fff}
}

/* ---------- footer: navy, multi-column ---------- */
.gbi-footer{background:var(--brand);color:rgba(255,255,255,.82);font-family:var(--font-text);padding:64px 0 0}
.gbi-footer a{color:rgba(255,255,255,.82);text-decoration:none}
.gbi-footer a:hover{color:var(--gold)}
.gbi-footer .gbi-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:40px}
.gbi-footer h4{color:#fff;font-family:var(--font-title);font-size:15px;letter-spacing:.04em;margin:0 0 16px;text-transform:uppercase}
.gbi-footer ul{list-style:none;margin:0;padding:0}
.gbi-footer li{margin-bottom:10px;font-size:14.5px}
.gbi-footer .gbi-foot-logo img{height:46px;margin-bottom:14px}
.gbi-footer .gbi-foot-tag{font-size:14.5px;max-width:280px;margin-bottom:18px}
.gbi-footer .gbi-social{display:flex;gap:12px}
.gbi-footer .gbi-social a{width:38px;height:38px;border:2px solid rgba(255,255,255,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px}
.gbi-footer .gbi-social a:hover{border-color:var(--gold);color:var(--gold)}
.gbi-footer .gbi-foot-contact li{display:flex;flex-direction:column;margin-bottom:14px}
.gbi-footer .gbi-foot-contact span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.55)}
.gbi-footer .gbi-copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:52px;padding:22px 0;font-size:13.5px;color:rgba(255,255,255,.6)}

@media(max-width:900px){
  .gbi-footer .gbi-foot-grid{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:560px){
  .gbi-footer .gbi-foot-grid{grid-template-columns:1fr}
}