/* ============================================================
   RS Bio Labs — cart styling
   Matches site tokens: --black, --off-white, --acid, --muted, --border
   ============================================================ */

/* ============================================================
   Auth buttons in main nav (Sign In + Sign Up — prominent, on the right)
   plus subtle Cart button after them.
   ============================================================ */
[data-auth-block]{display:inline-flex;gap:10px;align-items:center;}
.nav-signin{
  color:var(--off-white,#f0ede6);background:transparent;border:1px solid var(--border,rgba(240,237,230,0.12));
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;font-family:'DM Mono',monospace;padding:9px 18px;font-weight:500;
  transition:border-color .15s,color .15s;line-height:1.2;cursor:pointer;
}
.nav-signin:hover{border-color:var(--acid,#c8f542);color:var(--acid,#c8f542);}
.nav-signup,.nav-account{
  display:inline-block;background:var(--acid,#c8f542);border:1px solid var(--acid,#c8f542);
  color:var(--black,#0a0a0a)!important;padding:9px 20px;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;font-family:'DM Mono',monospace;font-weight:600;
  transition:opacity .15s;line-height:1.2;
}
.nav-signup:hover,.nav-account:hover{opacity:.85;}
.nav-account::before{content:'\2605';margin-right:6px;font-size:10px;}

/* Subtle cart button — outline only, less attention-grabbing than the auth CTAs */
.nav-cart-btn{
  background:transparent;color:var(--muted,#a0a090);
  border:1px solid var(--border,rgba(240,237,230,0.12));
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  padding:9px 14px;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;transition:border-color .15s,color .15s;
  line-height:1.2;
}
.nav-cart-btn:hover{border-color:var(--off-white,#f0ede6);color:var(--off-white,#f0ede6);}
.nav-cart-btn[data-cart-has-items="true"]{border-color:var(--acid,#c8f542);color:var(--acid,#c8f542);}

/* Hide auth elements based on signed-in state. Default state in HTML markup
   is "logged out" (signin + signup visible, account hidden); nav-auth.js flips this. */
[data-auth-signin][hidden],[data-auth-signup][hidden],[data-auth-account][hidden]{display:none !important;}

/* Mobile: stack auth buttons inside the hamburger panel */
.mobile-menu [data-auth-block]{display:flex;flex-direction:column;gap:10px;padding:14px 0;border-top:1px solid var(--border,rgba(240,237,230,0.12));margin-top:8px;}
.mobile-menu .nav-signin,.mobile-menu .nav-signup,.mobile-menu .nav-account{
  width:100%;text-align:center;padding:14px;font-size:12px;
}

@media(max-width:768px){
  /* On mobile, the hamburger panel handles auth — hide the inline desktop block */
  nav .nav-right [data-auth-block]{display:none;}
  nav .nav-right .nav-cart-btn{padding:7px 12px;font-size:10px;}
}

/* ============================================================
   Shop dropdown in main nav (shared across all customer pages)
   ============================================================ */
.nav-dropdown{position:relative;display:inline-block;}
.nav-dropdown-trigger{
  cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  background:none;border:none;padding:0;
  color:var(--muted,#a0a090);text-decoration:none;
  font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  font-family:'DM Mono',monospace;transition:color .2s;
}
.nav-dropdown-trigger:hover,
.nav-dropdown.open .nav-dropdown-trigger{color:var(--acid,#c8f542);}
.nav-dropdown-trigger::after{
  content:'';display:inline-block;width:6px;height:6px;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg);margin-top:-3px;margin-left:2px;
  transition:transform .2s;
}
.nav-dropdown.open .nav-dropdown-trigger::after{transform:rotate(225deg);margin-top:3px;}
.nav-dropdown-menu{
  position:absolute;top:calc(100% + 14px);left:0;min-width:240px;
  background:rgba(10,10,10,.97);backdrop-filter:blur(20px);
  border:1px solid var(--border,rgba(240,237,230,0.12));
  padding:8px 0;z-index:200;
  opacity:0;pointer-events:none;transform:translateY(-4px);
  transition:opacity .15s,transform .15s;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.nav-dropdown.open .nav-dropdown-menu{opacity:1;pointer-events:auto;transform:translateY(0);}
.nav-dropdown-menu a{
  display:block;padding:10px 20px;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted,#a0a090);text-decoration:none;
  white-space:nowrap;transition:color .15s,background .15s;
  font-family:'DM Mono',monospace;
}
.nav-dropdown-menu a:hover{background:rgba(200,245,66,.08);color:var(--acid,#c8f542);}
.nav-dropdown-menu .divider{border:none;border-top:1px solid var(--border,rgba(240,237,230,0.12));margin:8px 0;}
.nav-dropdown-menu .view-all{color:var(--acid,#c8f542);font-weight:500;}

/* Mobile menu category list */
.mobile-menu .mobile-cats{display:flex;flex-direction:column;gap:0;padding:6px 0 12px;border-bottom:1px solid var(--border,rgba(240,237,230,0.12));margin-bottom:6px;}
.mobile-menu .mobile-cats-label{font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--acid,#c8f542);padding:8px 0;border-bottom:1px solid var(--border,rgba(240,237,230,0.12));margin-bottom:6px;}
.mobile-menu .mobile-cats a{padding:10px 0;font-size:12px;border-bottom:none;color:var(--muted,#a0a090);}
.mobile-menu .mobile-cats a:hover{color:var(--acid,#c8f542);}

/* ============================================================
   Featured category sections on the homepage
   ============================================================ */
.featured-cats-wrap{padding:80px 80px 40px;}
.featured-cat{margin-bottom:64px;}
.featured-cat:last-child{margin-bottom:0;}
.featured-cat-header{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:24px;padding-bottom:16px;
  border-bottom:1px solid var(--border,rgba(240,237,230,0.12));
}
.featured-cat-eyebrow{
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--acid,#c8f542);margin-bottom:8px;display:flex;align-items:center;gap:12px;
}
.featured-cat-eyebrow::before{content:'';display:block;width:32px;height:1px;background:var(--acid,#c8f542);}
.featured-cat-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(36px,5vw,56px);letter-spacing:.04em;line-height:1;
  color:var(--off-white,#f0ede6);
}
.featured-cat-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
}
.featured-cat-empty{
  padding:48px 24px;text-align:center;
  border:1px dashed var(--border,rgba(240,237,230,0.12));
  color:var(--muted,#a0a090);font-size:12px;letter-spacing:.06em;
}
@media(max-width:768px){
  .featured-cats-wrap{padding:48px 20px 24px;}
  .featured-cat-grid{grid-template-columns:1fr;}
}

/* Sash badges on customer-side product cards.
   .tag-new is already styled per-page; these are overrides for newer sash types. */
.product-tag.tag-best-seller   { background: rgba(255,180,50,.12); color:#ffb432; }
.product-tag.tag-on-sale       { background: rgba(232,64,37,.12);  color:#e84025; }
.product-tag.tag-back-in-stock { background: rgba(100,180,255,.12); color:#64b4ff; }
.product-tag.tag-limited       { background: rgba(180,100,255,.12); color:#b464ff; }
.product-tag.tag-sold-out      { background: rgba(160,160,144,.18); color:#a0a090; }

/* Reset for nav-shop when used as <button> */
button.nav-shop{
  border:none;
  cursor:pointer;
  font-family:'DM Mono',monospace;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.nav-cart-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  background:rgba(10,10,10,.18);
  color:var(--black);
  font-size:10px;
  font-weight:700;
  border-radius:9px;
  letter-spacing:0;
}
.nav-cart-count[data-empty="true"]{display:none;}

/* Mobile menu cart button (replaces inline-styled mobile shop link) */
.mobile-cart-btn{
  flex:1;
  background:var(--acid);
  color:var(--black);
  padding:12px 16px;
  border:none;
  cursor:pointer;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-family:'DM Mono',monospace;
  font-weight:500;
  text-align:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

/* ============================================================
   Drawer
   ============================================================ */
.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(4px);
  z-index:9990;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.cart-overlay.open{opacity:1;pointer-events:auto;}

.cart-drawer{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:min(440px,100%);
  background:#0a0a0a;
  border-left:1px solid var(--border,rgba(240,237,230,0.12));
  z-index:9991;
  transform:translateX(100%);
  transition:transform .3s ease;
  display:flex;
  flex-direction:column;
  font-family:'DM Mono',monospace;
  color:var(--off-white,#f0ede6);
  box-shadow:-20px 0 60px rgba(0,0,0,.5);
}
.cart-drawer.open{transform:translateX(0);}

.cart-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 28px;
  border-bottom:1px solid var(--border,rgba(240,237,230,0.12));
  flex-shrink:0;
}
.cart-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:24px;
  letter-spacing:.08em;
  color:var(--off-white,#f0ede6);
  margin:0;
}
.cart-eyebrow{
  font-size:9px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--acid,#c8f542);
  margin-bottom:6px;
}
.cart-close{
  background:none;
  border:1px solid var(--border,rgba(240,237,230,0.12));
  color:var(--off-white,#f0ede6);
  width:36px;
  height:36px;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .2s;
  font-family:inherit;
}
.cart-close:hover{
  border-color:var(--acid,#c8f542);
  color:var(--acid,#c8f542);
}

/* ============================================================
   Items list
   ============================================================ */
.cart-items{
  flex:1;
  overflow-y:auto;
  padding:0;
  list-style:none;
  margin:0;
}
.cart-empty{
  padding:60px 28px;
  text-align:center;
  color:var(--muted,#a0a090);
  font-size:12px;
  line-height:1.8;
}
.cart-empty-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:22px;
  letter-spacing:.08em;
  color:var(--off-white,#f0ede6);
  margin-bottom:12px;
}
.cart-empty-link{
  display:inline-block;
  margin-top:24px;
  background:var(--acid,#c8f542);
  color:var(--black,#0a0a0a);
  padding:12px 24px;
  text-decoration:none;
  font-size:11px;
  letter-spacing:.15em;
  text-transform:uppercase;
  font-weight:500;
  transition:opacity .2s;
}
.cart-empty-link:hover{opacity:.85;}

.cart-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:6px 16px;
  padding:20px 28px;
  border-bottom:1px solid rgba(240,237,230,0.06);
}
.cart-item:last-child{border-bottom:none;}
.cart-item-info{min-width:0;}
.cart-item-name{
  font-size:13px;
  color:var(--off-white,#f0ede6);
  margin-bottom:4px;
  font-weight:500;
  letter-spacing:.02em;
}
.cart-item-meta{
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted,#a0a090);
}
.cart-item-meta .gift-badge{
  display:inline-block;
  background:var(--acid,#c8f542);
  color:var(--black,#0a0a0a);
  padding:2px 8px;
  margin-left:8px;
  font-size:9px;
  font-weight:700;
  letter-spacing:.15em;
}
.cart-item-price{
  font-size:13px;
  color:var(--acid,#c8f542);
  font-family:'Bebas Neue',sans-serif;
  letter-spacing:.04em;
  text-align:right;
  font-size:18px;
}
.cart-item-price.free{color:var(--acid,#c8f542);}
.cart-item-controls{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:8px;
}
.cart-qty{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--border,rgba(240,237,230,0.12));
}
.cart-qty button{
  width:30px;
  height:30px;
  background:transparent;
  border:none;
  color:var(--off-white,#f0ede6);
  cursor:pointer;
  font-size:14px;
  line-height:1;
  font-family:inherit;
  transition:background .15s;
}
.cart-qty button:hover{background:rgba(200,245,66,.1);color:var(--acid,#c8f542);}
.cart-qty button:disabled{opacity:.3;cursor:not-allowed;}
.cart-qty .qty-val{
  min-width:32px;
  text-align:center;
  font-size:12px;
  color:var(--off-white,#f0ede6);
  border-left:1px solid var(--border,rgba(240,237,230,0.12));
  border-right:1px solid var(--border,rgba(240,237,230,0.12));
  padding:0 8px;
  line-height:30px;
}
.cart-remove{
  background:none;
  border:none;
  color:var(--muted,#a0a090);
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  padding:4px 0;
  font-family:inherit;
  transition:color .2s;
}
.cart-remove:hover{color:var(--red,#e84025);}

/* ============================================================
   Footer (promo, totals, checkout)
   ============================================================ */
.cart-footer{
  flex-shrink:0;
  border-top:1px solid var(--border,rgba(240,237,230,0.12));
  padding:24px 28px;
  background:#0a0a0a;
}

.cart-promo{
  display:flex;
  gap:8px;
  margin-bottom:20px;
}
.cart-promo input{
  flex:1;
  background:transparent;
  border:1px solid var(--border,rgba(240,237,230,0.12));
  color:var(--off-white,#f0ede6);
  padding:10px 12px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-family:inherit;
  outline:none;
  transition:border-color .2s;
}
.cart-promo input:focus{border-color:var(--acid,#c8f542);}
.cart-promo input::placeholder{color:var(--muted,#a0a090);text-transform:uppercase;}
.cart-promo button{
  background:transparent;
  border:1px solid var(--acid,#c8f542);
  color:var(--acid,#c8f542);
  padding:0 16px;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  font-family:inherit;
  transition:all .2s;
}
.cart-promo button:hover{background:rgba(200,245,66,.08);}
.cart-promo-applied{
  margin:-12px 0 16px;
  font-size:10px;
  color:var(--acid,#c8f542);
  letter-spacing:.12em;
  text-transform:uppercase;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.cart-promo-applied button{
  background:none;
  border:none;
  color:var(--muted,#a0a090);
  cursor:pointer;
  font-size:9px;
  letter-spacing:.15em;
  text-transform:uppercase;
  font-family:inherit;
  padding:0;
}
.cart-promo-applied button:hover{color:var(--red,#e84025);}

.cart-totals{
  margin-bottom:20px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cart-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.cart-row .key{color:var(--muted,#a0a090);}
.cart-row .val{color:var(--off-white,#f0ede6);}
.cart-row.discount .val{color:var(--acid,#c8f542);}
.cart-row.shipping-free .val{color:var(--acid,#c8f542);font-weight:500;}
.cart-row-total{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--border,rgba(240,237,230,0.12));
}
.cart-row-total .key{
  font-family:'Bebas Neue',sans-serif;
  font-size:18px;
  letter-spacing:.08em;
  color:var(--off-white,#f0ede6);
}
.cart-row-total .val{
  font-family:'Bebas Neue',sans-serif;
  font-size:32px;
  letter-spacing:.04em;
  color:var(--acid,#c8f542);
  line-height:1;
}

.cart-shipping-note{
  font-size:9px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted,#a0a090);
  margin-top:4px;
  line-height:1.6;
}
.cart-shipping-note .almost{color:var(--acid,#c8f542);}

.cart-checkout{
  width:100%;
  background:var(--acid,#c8f542);
  color:var(--black,#0a0a0a);
  border:none;
  padding:18px;
  font-family:'DM Mono',monospace;
  font-size:12px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .2s;
}
.cart-checkout:hover:not(:disabled){opacity:.88;}
.cart-checkout:disabled{
  background:rgba(200,245,66,.18);
  color:rgba(10,10,10,.5);
  cursor:not-allowed;
}
.cart-checkout-note{
  text-align:center;
  font-size:9px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted,#a0a090);
  margin-top:10px;
}

/* ============================================================
   Buy widget (per-product detail page)
   ============================================================ */
.buy-widget{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.buy-widget-price{
  font-family:'Bebas Neue',sans-serif;
  font-size:48px;
  line-height:1;
  letter-spacing:.02em;
  color:var(--acid,#c8f542);
}
.buy-widget-price-sub{
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted,#a0a090);
  margin-top:-4px;
  margin-bottom:8px;
}
.buy-widget-controls{
  display:flex;
  gap:10px;
  align-items:stretch;
}
.buy-widget-qty{
  display:inline-flex;
  align-items:stretch;
  border:1px solid var(--border,rgba(240,237,230,0.12));
  flex-shrink:0;
}
.buy-widget-qty button{
  width:42px;
  background:transparent;
  border:none;
  color:var(--off-white,#f0ede6);
  cursor:pointer;
  font-size:16px;
  font-family:inherit;
  transition:background .15s;
}
.buy-widget-qty button:hover{background:rgba(200,245,66,.1);color:var(--acid,#c8f542);}
.buy-widget-qty .qty-val{
  min-width:42px;
  text-align:center;
  font-size:13px;
  color:var(--off-white,#f0ede6);
  border-left:1px solid var(--border,rgba(240,237,230,0.12));
  border-right:1px solid var(--border,rgba(240,237,230,0.12));
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.buy-widget-add{
  flex:1;
  background:var(--acid,#c8f542);
  color:var(--black,#0a0a0a);
  border:none;
  padding:14px 20px;
  font-family:'DM Mono',monospace;
  font-size:11px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .2s;
}
.buy-widget-add:hover{opacity:.88;}
.buy-widget-added{
  background:transparent;
  border:1px solid var(--acid,#c8f542);
  color:var(--acid,#c8f542);
}
.buy-widget-stock{
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--acid,#c8f542);
  display:flex;
  align-items:center;
  gap:8px;
}
.buy-widget-stock::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--acid,#c8f542);
  box-shadow:0 0 8px rgba(200,245,66,.6);
}
.buy-widget-out{
  color:var(--muted,#a0a090);
}
.buy-widget-out::before{
  background:var(--muted,#a0a090);
  box-shadow:none;
}

/* Compact buy widget for product cards on grid */
.product-card .buy-widget-add-compact{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--acid,#c8f542);
  color:var(--black,#0a0a0a);
  border:none;
  padding:10px 18px;
  font-family:'DM Mono',monospace;
  font-size:11px;
  font-weight:500;
  letter-spacing:.15em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .2s;
  text-decoration:none;
}
.product-card .buy-widget-add-compact:hover{opacity:.85;}

/* ============================================================
   Toast (add-to-cart confirmation)
   ============================================================ */
.cart-toast{
  position:fixed;
  bottom:24px;
  right:24px;
  background:#0a0a0a;
  border:1px solid var(--acid,#c8f542);
  color:var(--off-white,#f0ede6);
  padding:14px 20px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-family:'DM Mono',monospace;
  z-index:9995;
  transform:translateY(20px);
  opacity:0;
  pointer-events:none;
  transition:all .25s;
  max-width:320px;
  box-shadow:0 10px 40px rgba(0,0,0,.5);
}
.cart-toast.show{transform:translateY(0);opacity:1;pointer-events:auto;}
.cart-toast strong{color:var(--acid,#c8f542);}

/* ============================================================
   Cart page (cart.html)
   ============================================================ */
.cart-page{
  min-height:100vh;
  padding:120px 40px 80px;
  max-width:960px;
  margin:0 auto;
}
.cart-page-header{
  margin-bottom:48px;
}
.cart-page-eyebrow{
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--acid,#c8f542);
  margin-bottom:16px;
}
.cart-page-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(48px,6vw,80px);
  letter-spacing:.04em;
  line-height:.95;
  color:var(--off-white,#f0ede6);
  margin-bottom:8px;
}
.cart-page-grid{
  display:grid;
  grid-template-columns:1fr 360px;
  gap:48px;
  align-items:start;
}
.cart-page-items{
  border-top:1px solid var(--border,rgba(240,237,230,0.12));
}
.cart-page-summary{
  background:rgba(240,237,230,.03);
  border:1px solid var(--border,rgba(240,237,230,0.12));
  padding:28px;
  position:sticky;
  top:88px;
}
.cart-page-summary .cart-promo{margin-bottom:24px;}
.cart-page-summary .cart-totals{margin-bottom:24px;}

@media(max-width:768px){
  .cart-page{padding:100px 20px 60px;}
  .cart-page-grid{grid-template-columns:1fr;gap:24px;}
  .cart-page-summary{position:static;}
  .cart-drawer{width:100%;}
}