*{box-sizing:border-box}
:root{--bg:#0d1117;--panel:#0f1724;--card:#121a28;--ink:#e6edf3;--muted:#9aa7b3;--border:#203045;--accent:#22c55e;--max:1180px}
html{color-scheme:dark}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 Inter,system-ui,Segoe UI,Roboto,Arial}
a{color:var(--accent)}img{max-width:100%;height:auto;display:block}
.container{max-width:var(--max);padding:14px 16px;margin:0 auto}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:0 12px 32px rgba(0,0,0,.35)}
.small{font-size:14px}.muted{color:var(--muted)}
.btn{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center;background:var(--accent);color:#05160b;border:1px solid rgba(255,255,255,.08);padding:10px 14px;border-radius:12px;font-weight:800;cursor:pointer}
.btn.alt{background:transparent;color:var(--ink)}.ctrl{border:1px solid var(--border);background:transparent;color:var(--ink);padding:8px 10px;border-radius:10px;cursor:pointer}
input,textarea,select,button{font:inherit}input,textarea,select{width:100%;background:transparent;color:var(--ink);border:1px solid var(--border);border-radius:10px;padding:10px}
label{display:block;margin-top:10px;font-weight:600}
.qty{display:inline-grid;grid-auto-flow:column;align-items:center;border:1px solid var(--border);border-radius:10px}
.qty input{width:56px;padding:8px 6px;background:transparent;border:0;color:var(--ink);text-align:center}

.pill{display:inline-block;background:#0a2c16;border:1px solid #194427;color:#9ee5b3;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:700}

/* announcement */
.announce{position:sticky;top:0;z-index:950;background:#0a1320;border-bottom:1px solid var(--border);padding:8px 0}
.announce .row{display:flex;gap:10px;align-items:center;justify-content:center}
.announce button{font-size:12px}

/* header/nav */
.header{position:sticky;top:36px;z-index:900;background:rgba(15,23,36,.95);border-bottom:1px solid var(--border);backdrop-filter:saturate(150%) blur(6px)}
.nav{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;min-height:64px}
.brand{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center}.brand img{width:22px;height:22px}
.nav-links{display:none}@media(min-width:1100px){.nav-links{display:flex;gap:14px;justify-self:center}}
.controls{display:inline-grid;grid-auto-flow:column;gap:8px;justify-self:end;align-items:center}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;opacity:0;pointer-events:none;transition:opacity .18s ease}
.overlay.open{opacity:1;pointer-events:auto}.panel{position:absolute;right:0;top:0;height:100%;width:min(88vw,420px);background:var(--panel);border-left:1px solid var(--border);padding:18px;overflow:auto}
.menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.menu-list{display:grid;gap:8px;margin-top:8px}.menu-list a{display:block;padding:12px 10px;border:1px solid var(--border);border-radius:12px;line-height:1.25;font-weight:600}

.hero{display:grid;gap:16px;align-items:center}@media(min-width:1024px){.hero{grid-template-columns:1fr 1fr}}
.media{aspect-ratio:16/10;background:#0b1422;border:1px solid var(--border);border-radius:16px;overflow:hidden}.media>img{width:100%;height:100%;object-fit:cover}

/* PRODUCTS GRID */
.page-products{padding-bottom:20px}
.catalog{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));padding-bottom:72px}
.product{display:flex;flex-direction:column;gap:10px;position:relative}
.product .media{aspect-ratio:4/5;border-radius:12px;overflow:hidden}
.product .meta{display:flex;justify-content:space-between;align-items:center;gap:10px}
.product .price del{color:#7c8895;margin-left:6px}
.badge{position:absolute;left:10px;top:10px;background:#0a2c16;border:1px solid #194427;color:#9ee5b3;padding:4px 8px;border-radius:10px;font-size:12px;font-weight:700}
.low{background:#2c0a0a;border-color:#442019;color:#f2a7a7}
.product .desc{min-height:48px}
.product .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
.rating{display:inline-grid;grid-auto-flow:column;gap:6px;align-items:center}
.rating .stars{letter-spacing:.5px}

/* Lightbox */
.lb{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;z-index:1200}
.lb.open{display:block}
.lb img{max-width:min(96vw,1400px);max-height:90vh;margin:5vh auto;display:block;border-radius:10px;border:1px solid var(--border)}

.footer{border-top:1px solid var(--border);padding:14px 0;margin-top:72px}
.footer .row{display:grid;gap:12px;align-items:center}.footer .row{grid-template-columns:1fr}@media(min-width:980px){.footer .row{grid-template-columns:1fr auto}}

/* v6.8.5 tweaks */
html,body{height:100%}
body{min-height:100vh;display:flex;flex-direction:column}
main.container{flex:1 0 auto}
/* Bigger tap targets and spacing in menu */
.menu-list a{padding:14px 12px}
/* Ensure product titles never get struck out by browser extensions */
.product .meta strong{text-decoration:none}
/* Safer image fit on ultra-wide cards */
.media>img{object-fit:cover}
/* Slightly tighter grid on huge screens, roomier on mobile */
@media(max-width:660px){.catalog{grid-template-columns:1fr}}
@media(min-width:1500px){:root{--max:1400px}}
/* Back-to-top button */
/* v6.8.7 stars + print */
.rating{display:flex;align-items:center;gap:8px;margin:.25rem 0 .75rem 0}
.rating .stars{display:inline-flex;align-items:center}
@media print{
  header, nav, .menu-toggle, .cart-toggle, footer, #promoBar, /* v6.9.1 badges */
.badges{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0}
.badge{background:#0a2c16;border:1px solid #194427;color:#9ee5b3;padding:4px 8px;border-radius:10px;font-size:12px;font-weight:700}
.badge.low{background:#2c0a0a;border-color:#442019;color:#f2a7a7}

/* v6.9.3 nav */
.site-header{position:relative;z-index:10;background:#0f1724;border-bottom:1px solid var(--border);min-height:48px}
.site-header .container{padding:10px 12px}
.brand{display:flex;align-items:center;gap:8px;font-weight:800}
.brand .logo{height:28px;width:auto;border-radius:4px}
.nav-inline{display:flex;gap:14px;align-items:center}
.header-ctas{display:flex;gap:8px;align-items:center}
.only-mobile{display:none}
.nav-drawer{display:none; display:none; position:fixed;left:0;top:0;bottom:0;width:78%;max-width:360px;background:#0b1320;border-right:1px solid var(--border);padding:14px;flex-direction:column;gap:10px;z-index:1001}
.nav-overlay{position:fixed;inset:0;background:rgba(15,23,36,.55);z-index:1000}
/* Desktop */
@media(min-width:900px){
  .only-mobile{display:none}
  .nav-inline{display:flex}
  .nav-drawer, .nav-overlay{display:none!important}
  #navOverlay[hidden]{display:none!important}
}
/* Mobile */
@media(max-width:899px){
  .only-mobile{display:inline-flex}
  .nav-inline{display:none}
}
/* Body class toggle */



/* v6.9.4 compact header */
:root{--header-h:56px}
[hidden]{display:none!important}
.site-header{position:relative;z-index:10;background:#0f1724;border-bottom:1px solid var(--border);min-height:48px}
.site-header .container{padding:8px 10px}
.brand .logo{height:22px;width:auto}
.brand-name{font-size:16px;white-space:nowrap}
.nav-inline{display:flex;gap:12px;align-items:center;flex-wrap:nowrap}
.nav-inline a{white-space:nowrap}
.header-ctas{display:flex;gap:8px;align-items:center}
.only-mobile{display:none}
main.container{padding-top:12px}
/* Drawer */
.nav-drawer{position:fixed;left:0;top:0;height:100vh;width:82%;max-width:340px;background:#0b1320;border-right:1px solid var(--border);padding:14px;flex-direction:column;gap:10px;z-index:1001}
.nav-overlay{position:fixed;inset:0;background:rgba(15,23,36,.55);z-index:1000}
/* Desktop rules */
@media(min-width:980px){
  .only-mobile{display:none}
  .nav-inline{display:flex}
  #drawer,.nav-drawer,#navOverlay{display:none!important}
}
/* Mobile rules */
@media(max-width:979px){
  .only-mobile{display:inline-flex}
  .nav-inline{display:none}
}
/* Toggle visibility via class */



/* v6.9.5 menu reset */
[hidden]{display:none!important}
.site-header .container{padding:6px 10px}
.brand .logo{height:20px}
.brand-name{font-size:15px}
.nav-inline{display:flex;gap:10px;align-items:center;flex-wrap:nowrap}
.nav-inline a{white-space:nowrap}
.only-mobile{display:none}
main.container{padding-top:10px}
.nav-drawer{position:fixed;left:0;top:0;height:100vh;width:80%;max-width:320px;background:#0b1320;border-right:1px solid var(--border);padding:14px;flex-direction:column;gap:10px;z-index:1001}
.nav-overlay{position:fixed;inset:0;background:rgba(15,23,36,.55);z-index:1000}
@media(min-width:980px){
  .only-mobile{display:none}
  .nav-inline{display:flex}
  #drawer,.nav-drawer,#navOverlay{display:none!important}
}
@media(max-width:979px){
  .only-mobile{display:inline-flex}
  .nav-inline{display:none}
}



/* v6.9.6 — CSS-only menu */
.nav-check{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
/* default hidden mobile drawer + overlay */
#drawer{display:none}
#navOverlay[hidden]{display:none!important}
/* open states when checkbox is checked */
#navCheck:checked ~ #drawer{display:flex}
#navCheck:checked ~ #navOverlay{display:block}
/* layout */
.site-header{position:relative;z-index:10;background:#0f1724;border-bottom:1px solid var(--border);min-height:48px}
.site-header .container{padding:6px 10px}
.brand .logo{height:20px;width:auto}
.brand-name{font-size:15px;white-space:nowrap}
.nav-inline{display:flex;gap:10px;align-items:center;flex-wrap:nowrap}
.nav-inline a{white-space:nowrap}
.only-mobile{display:none}
.nav-drawer{position:fixed;left:0;top:0;height:100vh;width:80%;max-width:320px;background:#0b1320;border-right:1px solid var(--border);padding:14px;flex-direction:column;gap:10px;z-index:1001}
.nav-overlay{position:fixed;inset:0;background:rgba(15,23,36,.55);z-index:1000}
/* Responsive switches */
@media(min-width:980px){
  .only-mobile{display:none}
  .nav-inline{display:flex}
  #drawer,.nav-drawer,#navOverlay{display:none!important}
}
@media(max-width:979px){
  .only-mobile{display:inline-flex}
  .nav-inline{display:none}
}

/* Drawer visibility */
.nav-drawer.open{display:flex!important}


/* Header link aesthetics */
.nav-inline a{padding:6px 8px;border-radius:8px;text-decoration:none;font-weight:700}
.nav-inline a:hover{background:rgba(34,197,94,.12);text-decoration:none}
.nav-drawer a{padding:10px 8px;border-radius:10px;text-decoration:none;font-weight:700}
.nav-drawer a:hover{background:rgba(34,197,94,.12);text-decoration:none}
#menu-open{display:inline-grid;gap:6px;align-items:center;border-radius:10px;padding:8px 12px}
#menu-close{align-self:flex-end}

/* Hide legacy subscribe form if still present */
#subscribe{display:none!important}

.announce{display:none!important}

/* enforced drawer visibility */
.nav-drawer{display:none!important}
.nav-drawer.open{display:flex!important}

/* Enforce drawer visibility and desktop behavior */
.nav-drawer{display:none!important}
.nav-drawer.open{display:flex!important}
@media(min-width:900px){ #menu-open{display:none!important} .nav-inline{display:flex!important} .nav-drawer{display:none!important} }
@media(max-width:899px){ .nav-inline{display:none!important} }
.announce{display:none!important}


/* --- v6.9.6 No-Hamburger Header --- */
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px}
.nav-inline{display:flex!important;gap:14px;flex-wrap:wrap;align-items:center}
.header-ctas{display:flex;gap:10px;align-items:center;margin-left:auto}
#cartToggle{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center;border:1px solid var(--border);background:transparent;padding:8px 12px;border-radius:10px;font-weight:800;text-decoration:none}
#cartToggle:hover{background:rgba(34,197,94,.12)}
/* remove any leftover mobile-only controls */
#menu-open,#menu-close,#navOverlay{display:none!important}
/* hide drawer completely if any leftover exists */
#drawer,.nav-drawer{display:none!important}


/* v6.9.6 header grid + cart alignment */
.site-header .container{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px}
@media(max-width:899px){
  .site-header .container{grid-template-columns:1fr auto}
}
.nav-inline{display:flex!important;gap:14px;align-items:center;flex-wrap:wrap}
.header-ctas{display:flex;gap:10px;align-items:center;justify-self:end}
#cartToggle{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center;border:1px solid var(--border);background:transparent;padding:8px 12px;border-radius:10px;font-weight:800;text-decoration:none}
#cartToggle:hover{background:rgba(34,197,94,.12)}
#menu-open,#menu-close,#navOverlay,#drawer{display:none!important}



#cartToggle{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center;border:1px solid var(--border);background:transparent;padding:8px 12px;border-radius:10px;font-weight:800;text-decoration:none}
#cartToggle:hover{background:rgba(34,197,94,.12)}
/* Header grid: brand | nav | cart (desktop); brand+cart then nav (mobile) */
.site-header .container{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px}
@media(max-width:899px){
  .site-header .container{grid-template-columns:1fr auto}
  .nav-inline{grid-column:1 / -1}
}
.header-ctas{justify-self:end}


/* --- Cart pill (clean) --- */
#cartToggle{display:inline-grid;grid-auto-flow:column;gap:8px;align-items:center;
  border:1px solid var(--border);background:transparent;padding:8px 12px;border-radius:12px;
  font-weight:800;text-decoration:none}
#cartToggle:hover{background:rgba(34,197,94,.12)}
#cartToggle .icon{font-size:1.05em;line-height:1}
#cartToggle .text{line-height:1}
.count-pill{display:none;min-width:1.25em;height:1.25em;align-items:center;justify-content:center;
  border-radius:999px;padding:0 .35em;margin-left:8px;font-size:.8em;font-weight:900;
  background:#16a34a;color:#0b1b12;box-shadow:0 0 0 2px rgba(22,163,74,.25)}
.count-pill.show{display:inline-flex}
/* Header grid: brand | links | cart (desktop); brand+cart then links (mobile) */
.site-header .container{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px}
@media(max-width:899px){
  .site-header .container{grid-template-columns:1fr auto}
  .nav-inline{grid-column:1 / -1;display:flex!important;gap:12px;flex-wrap:wrap}
}
.header-ctas{justify-self:end;display:flex;align-items:center}

/* Cart drawer */
#cart-drawer{position:fixed;top:0;right:0;bottom:0;width:340px;max-width:90vw;background:var(--panel,#08180f);border-left:1px solid var(--border,#113824);box-shadow:0 8px 30px rgba(0,0,0,.45);transform:translateX(100%);transition:transform .25s ease;z-index:9999;display:flex;flex-direction:column}
.cart-open #cart-drawer{transform:translateX(0)}
.cart-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:9998}
.cart-open .cart-backdrop{opacity:1;pointer-events:auto}
#cart-drawer .cart-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border,#113824)}
#cart-drawer .cart-header .close{font-size:22px;background:transparent;border:0;color:var(--muted,#9db3a6);cursor:pointer}
#cart-drawer .cart-body{padding:10px 12px;overflow:auto;flex:1;display:grid;gap:12px}
#cart-drawer .line{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;border:1px solid var(--border,#113824);border-radius:10px;padding:10px}
#cart-drawer .line .meta .muted{display:block;font-size:12px;color:var(--muted,#9db3a6)}
#cart-drawer .line .qty{display:inline-grid;grid-auto-flow:column;gap:6px;align-items:center}
#cart-drawer .line .qty .ctrl{width:28px;height:28px;border-radius:8px;border:1px solid var(--border,#113824);background:#0d2a1b;cursor:pointer}
#cart-drawer .line .qty input{width:56px;padding:6px 8px;border:1px solid var(--border,#113824);border-radius:8px;background:#04140d;color:#fff;text-align:center}
#cart-drawer .line .qty .remove{margin-left:8px;width:28px;height:28px;border-radius:8px;border:1px solid var(--border,#113824);background:#2a0d0d;color:#fff;cursor:pointer}
#cart-drawer .cart-footer{border-top:1px solid var(--border,#113824);padding:12px;display:grid;gap:8px}
#cart-drawer .cart-footer .row{display:flex;justify-content:space-between;align-items:center}
#cart-drawer .cart-footer .actions{display:flex;gap:10px}
#cart-drawer .cart-footer .hint{font-size:12px;color:var(--muted,#9db3a6)}
#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#0f3;color:#04140d;padding:8px 12px;border-radius:10px;opacity:0;transition:opacity .2s ease;z-index:10000}
#toast.show{opacity:1}

/* Desktop: keep cart visible by default */
@media(min-width: 1024px){
  body:not(.cart-open) #cart-drawer{transform:translateX(0)}
  .cart-backdrop{display:none!important}
}


/* === ChatGPT patch v2025-09-13 ===
   Hide any floating cart pill/button and prevent lower-left cart UI. Keep header + right drawer only.
*/
#cart-pill, .cart-pill, .cart-fab { display: none !important; }
/* Ensure products grid uses a responsive grid layout */
#products-grid.catalog, .catalog#products-grid, .catalog { 
  display: grid; 
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); 
  gap: 18px;
}
/* Prevent unexpected duplication stacking due to accidental flow */
#products-grid > article.product.card { contain: layout paint; }

/* v6.9.72 products grid hard rule */
#products-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr))!important;
  gap:18px!important;
}

/* ChatGPT v2025-09-13d legacy cart cleanup */
#drawer, .nav-drawer, .cart-fab, #cart-fab, .cart-float, .cart-floating{display:none !important}

/* v7.0.0 cart: right-side drawer only */
#drawer, .nav-drawer, .cart-fab, #cart-fab, .cart-float, .cart-floating{display:none !important}
#cart-drawer{position:fixed;top:0;right:0;bottom:0;width:340px;transform:translateX(100%);z-index:9999;display:flex;flex-direction:column;background:#0b1422;border-left:1px solid var(--border,#113824)}
.cart-open #cart-drawer{transform:translateX(0)}
.cart-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:9998}
.cart-open .cart-backdrop{opacity:1;pointer-events:auto}
@media(min-width:1024px){
  /* never show drawer by default on desktop */
  body:not(.cart-open) #cart-drawer{transform:translateX(100%) !important}
  .cart-backdrop{display:none!important}
}


/* v7.0.0 mobile touch comfort */
*{-webkit-tap-highlight-color:transparent}
button, .btn{min-height:40px}
.qty .ctrl{width:32px;height:32px}


/* v7.0.0 header grid tidy */
.site-header .container{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px}
.header-ctas{justify-self:end}
@media(min-width:900px){
  .site-header .container{grid-template-columns:1fr auto auto}
}


/* v7.0.0 media sizing */
img{max-width:100%;height:auto}
