/** Shopify CDN: Minification failed

Line 420:30 Expected identifier but found whitespace
Line 420:32 Unexpected "{"
Line 420:41 Expected ":"
Line 420:72 Expected ":"
Line 421:29 Expected identifier but found whitespace
Line 421:31 Unexpected "{"
Line 421:40 Expected ":"
Line 421:78 Expected ":"
Line 438:8 Expected identifier but found whitespace
Line 438:10 Unexpected "{"
... and 6 more hidden warnings

**/
/* ===========================================
   TBW Custom Header — Dawn compatible CSS
   File: assets/tbw-header.css
   -------------------------------------------
   TABLE OF CONTENTS
   0) Tokens & Base
   1) Topbar
   2) Mobile Menu Guards (z-index/position)
      2a) First guard block
      2b) Second guard block (duplicate, keep)
   3) Main Bar (layout & borders)
   4) Visibility Toggles (mobile/desktop logo & strip)
   5) Mobile Strip (row 1) & Icon Buttons
   6) Logo Badge (base)
   7) Search (Dawn predictive compatible)
      7a) Remove search button / adjust padding
   8) Quick Links (desktop) & Cart Count Badges
   9) Mega Nav (categories row)
      9a) Mobile slide styles
      9b) Centered/even desktop distribution
   10) Benefits Strip
      10a) Base
      10b) Desktop 4-column
      10c) Mobile slider (version A)
      10d) Mobile mega menu (alt slide block)
      10e) Utilities + Mobile slider (version B / overrides)
      10f) Desktop benefits centering (override)
      10g) Mobile slider no-bleed (final)
   11) Burger Button States
   12) Utilities
   13) Logo Sizing & Fallback (section settings)
      13a) Initial simple widths
      13b) Optional pure-image logo
      13c) Responsive visibility of logos
      13d) Final explicit widths (desktop/mobile)
   =========================================== */


/* ========== 0) TOKENS & BASE ========== */

:root{
  --tbw-bg:#000000;          /* dark charcoal (header background) */
  --tbw-bg-2:#2d2d2d;        /* lighter charcoal (mainbar/megamenu) */
  --tbw-text:#e8eeee;        /* near-white text */
  --tbw-muted:#a9b4b7;       /* muted text */
  --tbw-accent:#ff6a13;      /* TBW orange */
  --tbw-max:1200px;          /* layout max width if you need it */
}

/* Let Dawn’s .page-width control width/padding; we just inherit */
.tbw-header{
  color:var(--tbw-text);
  font-family: var(--font-body, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji");
  background:var(--tbw-bg);
}


/* ========== 1) TOPBAR ========== */

.tbw-topbar{
  background:var(--tbw-bg);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.tbw-topbar__inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  min-height:32px;
  font-size:12px;
}
.tbw-topbar__links a,
.tbw-topbar__auth a{
  color:var(--tbw-muted);
  text-decoration:none;
}
.tbw-topbar__links a:hover,
.tbw-topbar__auth a:hover{ color:var(--tbw-text); }
.tbw-topbar__links span,
.tbw-topbar__auth span{ opacity:.5; margin:0 8px; }


/* ========== 2) MOBILE MENU GUARDS (Z-INDEX/POSITION) ========== */
/* 2a) First guard block: ensure menu never peeks and sits above header */
@media (max-width:1024px){
  .tbw-topbar{ z-index:300; position:relative; }
  .tbw-mainbar{ z-index:300; position:relative; }

  .tbw-mega{
    position:fixed;
    left:0; right:0;
    top:var(--tbw-menu-top, 56px);   /* JS sets this accurately */
    transform:translateY(-100%);
    transition:transform .25s ease;
    z-index:400;               /* above topbar/mainbar */
    visibility:hidden;
    pointer-events:none;
  }
  .tbw-mega.is-open{
    transform:translateY(0);
    visibility:visible;
    pointer-events:auto;
  }
}

/* 2b) Second guard block (duplicate, keep for safety in cascade) */
@media (max-width:1024px){
  .tbw-topbar, .tbw-mainbar{ position:relative; z-index:300; }
  .tbw-mobile-strip{ position:relative; z-index:310; } /* keep burger clickable */

  .tbw-mega{
    position:fixed; left:0; right:0;
    top:var(--tbw-menu-top, 56px);
    transform:translateY(-100%);
    transition:transform .25s ease;
    z-index:400;
    visibility:hidden; pointer-events:none;
  }
  .tbw-mega.is-open{
    transform:translateY(0);
    visibility:visible; pointer-events:auto;
  }
}


/* ========== 3) MAIN BAR (LAYOUT & BORDERS) ========== */

.tbw-mainbar{
  background:var(--tbw-bg-2);
}
.tbw-mainbar__inner{
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
  padding-block:12px;
}

/* Desktop grid */
@media (min-width: 1025px){
  .tbw-mainbar__inner{
    grid-template-columns: 180px 1fr max-content; /* logo | search | quick links */
    align-items:center;
  }
  .tbw-mobile-strip{ display:none; }
  .tbw-quick{ display:flex; }
  .tbw-logo{ width:42px; height:42px; }
  .tbw-benefits .page-width{
    grid-template-columns: repeat(4, 1fr);
    gap:12px;
  }
}

/* Divider under main bar */
.tbw-mainbar{ border-bottom:1px solid rgba(255,255,255,.08); }


/* ========== 4) VISIBILITY TOGGLES (MOBILE/DESKTOP) ========== */

@media (max-width:1024px){
  .tbw-logo--desktop{ display:none !important; }
}
@media (min-width:1025px){
  .tbw-mobile-strip{ display:none !important; }
}


/* ========== 5) MOBILE STRIP (ROW 1) & ICON BUTTONS ========== */

.tbw-mobile-strip{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  align-items:center;
  gap:12px;
}
.tbw-iconbtn{
  display:grid;
  justify-items:center;
  align-items:center;
  gap:4px;
  color:var(--tbw-text);
  text-decoration:none;
  font-size:12px;
}
.tbw-iconbtn span{ font-size:11px; opacity:.9; }


/* ========== 6) LOGO BADGE (BASE) ========== */

.tbw-logo{
  display:inline-grid;
  place-items:center;
  text-decoration:none;
  color:#fff;
  background:var(--tbw-accent);
  width:42px; height:42px;
  border-radius:4px;
  font-weight:800;
  letter-spacing:.4px;
}


/* ========== 7) SEARCH (DAWN PREDICTIVE COMPATIBLE) ========== */

.tbw-search{
  position:relative;
}
.tbw-search input[type="search"]{
  width:100%;
  min-height:42px;
  border-radius:6px;
  border:0;
  padding:0 44px 0 16px;
  background:#fff;
  color:#111;
}
.tbw-search button[type="submit"],
.tbw-search .search__button{               /* Dawn predictive search button */
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  width:34px; height:34px;
  border:0; background:transparent;
  cursor:pointer;
}

/* 7a) Hide search button & tighten input padding */
.tbw-search__submit,
.tbw-search .search__button{ display:none !important; }
.tbw-search input[type="search"]{ padding-right:16px; }


/* ========== 8) QUICK LINKS (DESKTOP) & CART COUNT BADGES ========== */

.tbw-quick{
  display:none; /* hidden on mobile */
  gap:20px;
  align-items:center;
}
.tbw-quick a{
  display:grid;
  grid-auto-flow:column;
  align-items:center;
  gap:8px;
  color:#dce4e6;
  text-decoration:none;
  font-size:14px;
}
.tbw-quick a:hover{ color:#f68920; }

/* optional: cart count bubbles if you add them to markup */
.tbw-quick a[aria-label="Open cart"],
#cart-icon-bubble,
#cart-icon-bubble-desktop{
  position:relative;
}
.tbw-cart-count--desk{
  position:absolute; top:-6px; right:-10px;
  background:var(--tbw-accent); color:#fff;
  border-radius:999px;
  min-width:18px; height:18px;
  display:grid; place-items:center;
  font-size:11px; padding:0 5px;
}
.tbw-cart-count{
  position:absolute; top:-4px; right:-6px;
  background:var(--tbw-accent); color:#fff;
  border-radius:999px;
  min-width:16px; height:16px;
  display:grid; place-items:center;
  font-size:10px; line-height:1; padding:0 5px;
}


/* ========== 9) MEGA NAV (CATEGORIES ROW) ========== */

/* Base */
.tbw-mega{
  background:var(--tbw-bg-2);
  border-top:1px solid rgba(255,255,255,.06);
}
.tbw-mega > .page-width,
.tbw-mega > ul.page-width{ padding-block:8px; }
.tbw-mega ul{
  list-style:none;
  margin:0; padding:0;
  display:flex; flex-wrap:wrap; gap:28px;
}
.tbw-mega li a{
  color:#eaf0f2; text-decoration:none;
  font-weight:600; font-size:13px;
  text-transform: uppercase;
}
.tbw-mega li a:hover{ color:#f68920; }

/* 9a) Mobile slide styles */
@media (max-width:1024px){
  .tbw-mega{
    position:fixed; left:0; right:0; top:56px;
    transform:translateY(-100%); transition:transform .25s ease; z-index:50;
  }
  .tbw-mega.is-open{ transform:translateY(0); }
  .tbw-mega__list{ flex-direction:column; gap:0; }
  .tbw-mega__list > li > a{ display:block; padding:14px 20px; border-bottom:1px solid rgba(255,255,255,.06); }
}

/* 9b) Centered/even desktop distribution */
.tbw-mega{ background:var(--tbw-bg-2); border-top:1px solid rgba(255,255,255,.06); }
.tbw-mega > .page-width{ display:flex; justify-content:center; }
.tbw-mega__list{
  list-style:none; margin:0; padding:8px 0;
  display:flex; justify-content:space-between; align-items:center;
  gap:0; width:100%;
}
.tbw-mega__list > li > a{
  color:#eaf0f2; text-decoration:none; font-weight:600; font-size:13px;
}
.tbw-mega__list > li > a:hover{ color:#f68920; }
@media (max-width: 1200px){
  /* stop nasty squish when fewer pixels: use gap instead of space-between */
  .tbw-mega__list{ justify-content:center; gap:28px; flex-wrap:wrap; }
}


/* ========== 10) BENEFITS STRIP ========== */

/* 10a) Base */
.tbw-benefits{ background:#eef1f2; color:#273033; border-top:1px solid #dae1e3; }
.tbw-benefits .page-width{ padding-block:8px; }

/* 10b) Desktop: four columns */
@media (min-width:1025px){
  .tbw-benefits .page-width{
    display:grid; grid-template-columns:repeat(4,1fr); gap:12px; font-size:12px;
  }
}

/* 10c) Mobile slider (version A) */
@media (max-width:1024px){
  .tbw-benefits .page-width{ overflow:hidden; }
  .tbw-benefits__track{ display:flex; width:100%; transform:translateX(0); transition:transform .35s ease; }
  .tbw-benefit{ flex:0 0 100%; padding:8px 0; text-align:left; white-space:normal; }
}

/* 10d) Mobile mega menu (alt slide block for #tbw-mega) */
@media (max-width: 1024px){
  .tbw-mega{
    position:fixed;
    left:0; right:0;
    top:56px; /* roughly the mobile header height */
    transform:translateY(-100%);
    transition:transform .25s ease;
    z-index:50;
  }
  .tbw-mega.is-open{ transform:translateY(0); }
  .tbw-mega ul{ flex-direction:column; gap:0; }
  .tbw-mega li a{
    display:block;
    padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
}

/* 10e) Utilities + Mobile slider helpers */
html.tbw-no-scroll{ overflow:hidden; }
.tbw-benefits__track{ display:grid; grid-auto-flow:column; gap:24px; }
.tbw-benefit{ white-space:nowrap; }

/* 10f) Desktop benefits: centered columns (override) */
@media (min-width:1025px){
  .tbw-benefits .page-width{
    display:grid; grid-template-columns:repeat(4,1fr);
    gap:12px; justify-items:center; text-align:center; padding-block:8px;
  }
  .tbw-benefit{ text-align:center; }
}

/* 10g) Mobile slider: no-bleed + centered text (final) */
@media (max-width:1024px){
  .tbw-benefits .page-width{ overflow:hidden; padding-inline:0; } /* prevent right-side peek */
  .tbw-benefits__track{ display:flex; gap:0; width:100%; transform:translateX(0); transition:transform .35s ease; }
  .tbw-benefit{
    flex:0 0 100%; max-width:100%;
    padding:10px 16px; text-align:center; margin:0;
  }
}


/* ========== 11) BURGER BUTTON STATES ========== */

.tbw-burger{ color:var(--tbw-text); background:transparent; border:0; }
.tbw-burger__close{ display:none; }
.tbw-burger.is-open .tbw-burger__bars{ display:none; }
.tbw-burger.is-open .tbw-burger__close{ display:inline; }


/* ========== 12) UTILITIES (GLOBAL) ========== */

html.tbw-no-scroll{ overflow:hidden; } /* duplicate guard kept intentionally */


/* ========== 13) LOGO SIZING & FALLBACK (SECTION SETTINGS) ========== */

/* 13a) Initial simple widths (from earlier implementation) */
.tbw-logo-img--desktop{ width: {{ section.settings.brand_logo_width }}px; height:auto; }
.tbw-logo-img--mobile{ width: {{ section.settings.brand_logo_width_mobile }}px; height:auto; }

/* 13b) Fallback badge (shows if no image set) */
.tbw-logo-fallback{
  display:inline-grid; place-items:center; font-weight:800; color:#fff;
  background: var(--tbw-accent, #ff6a13); width:42px; height:42px; border-radius:4px;
}

/* 13c) Optional: pure-image logo (remove orange badge) */
.tbw-logo{ background:none; width:auto; height:auto; border-radius:0; }

/* 13d) Responsive visibility of logos */
@media (max-width:1024px){ .tbw-logo--desktop{ display:none !important; } }
@media (min-width:1025px){ .tbw-logo--mobile{ display:none !important; } }

/* 13e) Final explicit widths (desktop/mobile – latest settings) */
.tbw-logo-img--desktop{
  width: {{ section.settings.brand_logo_width_desktop }}px;
  height:auto;
  display:block;
}
.tbw-logo-img--mobile{
  width: {{ section.settings.brand_logo_width_mobile }}px;
  height:auto;
  display:block;
}

/* ===== TBW Header – Desktop Stability Patch (append at end) ===== */
@media (min-width:1025px){
  /* Restore 3‑column grid: [logo] [search] [quick links] */
  .tbw-mainbar__inner{
    display:grid;
    grid-template-columns: 180px 1fr max-content !important;
    align-items:center !important;
    gap:12px !important;
  }

  /* Ensure mobile strip is hidden and quick links are visible */
  .tbw-mobile-strip{ display:none !important; }
  .tbw-quick{ display:flex !important; gap:20px; align-items:center; }

  /* Benefits: evenly spaced 4 columns */
  .tbw-benefits .page-width{
    display:grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap:12px !important;
    justify-items:center !important;
    text-align:center !important;
    padding-block:8px;
  }
  .tbw-benefit{ text-align:center; }
}

/* Base icon */
.tbw-icon { width: 24px; height: 24px; display: block; }

/* Quick links layout (icon + label in a row) */
.tbw-quick a { display: grid; grid-auto-flow: column; align-items: center; gap: 8px; }

/* Colours (currentColor drives SVG fills) */
.tbw-iconbtn { color: #dce4e6; text-decoration: none; }
.tbw-iconbtn:hover { color: #ffffff; }

/* icon wrapper anchors the badge */
.tbw-iconwrap{ position:relative; display:inline-block; line-height:0; }
.tbw-iconwrap svg{ width:24px; height:24px; display:block; }

/* subtle, compact badge */
.cart-count-bubble{
  position:absolute;
  top:0; right:0;
  transform:translate(45%,-45%);
  min-width:14px; height:14px;
  padding:0 4px;
  border-radius:999px;
  background:rgba(0,0,0,.85);
  color:#fff;
  font-size:10px; font-weight:700; line-height:14px;
  text-align:center;
  box-shadow:0 0 0 1px rgba(255,255,255,.15);
}

/* a touch larger on desktop */
@media (min-width:1025px){
  .tbw-iconwrap svg{ width:26px; height:26px; }
  .cart-count-bubble{
    min-width:16px; height:16px; line-height:16px; font-size:11px;
    transform:translate(40%,-40%);
  }
}

/* optional: make badge orange when count > 0 */
.cart-count-bubble:not([hidden]){ background:var(--tbw-accent,#ff6a13); }

/* === TBW Benefits – Desktop fix (even 4-up grid, centred) === */
@media (min-width:1025px){
  .tbw-benefits { background:#eef1f2; color:#273033; border-top:1px solid #dae1e3; }
  .tbw-benefits .page-width{
    padding-block:8px;
  }
  /* On desktop the track becomes a 4-column grid (not the mobile flex track) */
  .tbw-benefits__track{
    display:grid !important;
    grid-template-columns:repeat(4,1fr);
    align-items:center;
    justify-items:center;
    gap:24px;
    width:100%;
    transform:none !important; /* neutralise mobile slider transform */
  }
  .tbw-benefit{
    white-space:normal;      /* undo mobile nowrap */
    text-align:center;
    margin:0;
  }
}

/* === TBW Benefits – Mobile slider kept === */
@media (max-width:1024px){
  .tbw-benefits .page-width{ overflow:hidden; padding-inline:0; }
  .tbw-benefits__track{
    display:flex; gap:0;
    width:100%;
    transform:translateX(0);
    transition:transform .35s ease;
  }
  .tbw-benefit{
    flex:0 0 100%;
    max-width:100%;
    padding:10px 16px;
    text-align:center;
    white-space:normal;
  }
}

/* === TBW Benefits — Desktop: one row, evenly spaced, no wrapping === */
@media (min-width:1025px){
  /* Make sure the container isn't using a grid from earlier */
  .tbw-benefits .page-width{
    display:block !important;
    padding-block:10px;
    background:#eef1f2; /* if you use this */
  }

  /* Desktop track becomes a single row flex bar */
  .tbw-benefits__track{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:space-between !important; /* even spacing */
    align-items:center;
    gap:32px;                 /* visual breathing room */
    width:100%;
    transform:none !important; /* kill mobile slider translate */
  }

  /* Each item stays on one line and auto-sizes to its text */
  .tbw-benefit{
    flex:0 1 auto;            /* shrink to content width */
    white-space:nowrap !important;  /* prevent stacked words */
    text-align:center;
    margin:0;
  }
}

/* === TBW Benefits — Icon styling & hover animation === */

.tbw-benefit__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  line-height: 1;
  color: #f68920;
  transition: transform 0.25s ease, color 0.25s ease;
}

/* === TBW Benefits — Lucide icon styling & hover animation === */
.tbw-benefit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  font-weight: 600;
  color: #273033;
}

.tbw-benefit__icon svg {
  width: 18px;
  height: 18px;
  stroke: #f68920;
  stroke-width: 2;
  transition: transform 0.25s ease, stroke 0.25s ease;
}

.tbw-benefit:hover .tbw-benefit__icon svg {
  transform: translateY(-2px);
  stroke: #c45b00; /* darker hover tone */
}

/* ==== TBW Mobile Mega Menu: full-height, scrollable, above all ==== */
@media (max-width:1024px){
  .tbw-mega{
    position: fixed !important;
    left: 0; right: 0;
    top: var(--tbw-menu-top, 56px);       /* set by JS below */
    height: calc(100vh - var(--tbw-menu-top, 56px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateY(-100%);
    transition: transform .25s ease;
    z-index: 999;                          /* above header */
    visibility: hidden; pointer-events: none;
  }
  .tbw-mega.is-open{
    transform: translateY(0);
    visibility: visible; pointer-events: auto;
  }

  /* vertical list; remove wrapping quirks */
  .tbw-mega__list{ display: flex; flex-direction: column; gap: 0; }
  .tbw-mega__list > li > a{
    display:block; padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,.06);
  }

  /* lock the page behind when menu is open */
  html.tbw-no-scroll{ overflow: hidden; }
}

@media (max-width:1024px){
  .tbw-mega{ border-top:1px solid rgba(255,255,255,.06); }
}