/* ALPHA TIDES — CART SYSTEM (CLEAN — no duplicates) */

/* Navbar logo lockup */
.nav-left a { display:flex !important; flex-direction:row !important; align-items:center !important; flex-wrap:nowrap !important; gap:10px !important; text-decoration:none !important; }
.nav-left a:hover,.nav-left a:visited { text-decoration:none !important; color:inherit !important; }
.nav-left .logo { height:80px !important; width:auto !important; flex-shrink:0 !important; mix-blend-mode:screen !important; filter:none !important; }
.nav-brand-text { font-family:'Space Grotesk',sans-serif !important; font-size:1rem !important; font-weight:700 !important; letter-spacing:0.08em !important; background:linear-gradient(135deg,#ffffff 0%,#c4b0ff 50%,#7b4dff 100%) !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; background-clip:text !important; white-space:nowrap !important; text-decoration:none !important; }

/* Bottle labels — kill blue */
.hero-bottle-wrap,.hero-bottle-wrap:visited,.hero-bottle-wrap:hover { text-decoration:none !important; -webkit-tap-highlight-color:transparent; }
.hero-bottle-label { background:linear-gradient(135deg,#e0d8ff 0%,#9b7bff 100%) !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; background-clip:text !important; text-decoration:none !important; }
.navbar a { -webkit-tap-highlight-color:transparent; }

/* Neon glow — tight */
@keyframes neonGlowPulse {
  0%   { filter:drop-shadow(0 0 3px rgba(150,100,255,0.8)) drop-shadow(0 0 6px rgba(123,77,255,0.6)); }
  100% { filter:drop-shadow(0 0 6px rgba(180,130,255,1)) drop-shadow(0 0 12px rgba(123,77,255,0.8)); }
}

/* Cart button */
.cart-btn { position:relative; background:none !important; border:none !important; outline:none !important; -webkit-appearance:none; appearance:none; cursor:pointer; padding:6px 8px; display:flex; align-items:center; gap:6px; color:#c4b0ff; font-family:'Inter',sans-serif; font-size:0.92rem; font-weight:500; transition:color 0.2s; border-radius:0; box-shadow:none !important; -webkit-tap-highlight-color:transparent; }
.cart-btn:hover { color:#fff; }
.cart-btn svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* Badge */
.cart-badge { position:absolute; top:-4px; right:-4px; background:linear-gradient(135deg,#7b4dff,#a855f7); color:#fff; font-size:0.65rem; font-weight:700; min-width:18px; height:18px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 4px; box-shadow:0 0 8px rgba(123,77,255,0.7); transition:transform 0.2s cubic-bezier(0.34,1.56,0.64,1),opacity 0.2s; }
.cart-badge.hidden { opacity:0; transform:scale(0); }
.cart-badge.pop { animation:badge-pop 0.3s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes badge-pop { 0%{transform:scale(1)} 50%{transform:scale(1.4)} 100%{transform:scale(1)} }

/* Overlay */
.cart-overlay { position:fixed; inset:0; background:rgba(6,4,20,0.7); backdrop-filter:blur(4px); z-index:900; opacity:0; pointer-events:none !important; transition:opacity 0.3s ease; }
.cart-overlay.open { opacity:1; pointer-events:all !important; }

/* Drawer */
.cart-drawer { position:fixed; top:0; right:0; width:min(420px,100vw); height:100dvh; background:linear-gradient(160deg,#0e0a1f 0%,#130d28 60%,#0a0618 100%); border-left:1px solid rgba(123,77,255,0.25); box-shadow:-20px 0 60px rgba(0,0,0,0.6); z-index:901; display:flex; flex-direction:column; transform:translateX(100%); transition:transform 0.38s cubic-bezier(0.4,0,0.2,1); }
.cart-drawer.open { transform:translateX(0); }
.cart-drawer-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid rgba(123,77,255,0.2); flex-shrink:0; }
.cart-drawer-title { font-family:'Space Grotesk',sans-serif; font-size:1.1rem; font-weight:700; color:#fff; letter-spacing:0.04em; display:flex; align-items:center; gap:10px; }
.cart-drawer-title span { font-size:0.75rem; color:#9d7fff; background:rgba(123,77,255,0.15); padding:2px 8px; border-radius:20px; border:1px solid rgba(123,77,255,0.3); }
.cart-close-btn { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:8px; width:34px; height:34px; cursor:pointer; color:#aaa; display:flex; align-items:center; justify-content:center; transition:all 0.2s; font-size:1.1rem; }
.cart-close-btn:hover { background:rgba(255,255,255,0.12); color:#fff; }
.cart-drawer-body { flex:1; overflow-y:auto; padding:16px 24px; scrollbar-width:thin; scrollbar-color:rgba(123,77,255,0.3) transparent; }
.cart-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; gap:12px; text-align:center; padding:40px; }
.cart-empty svg { width:48px; height:48px; stroke:rgba(123,77,255,0.3); fill:none; stroke-width:1.5; }
.cart-empty p { font-size:0.9rem; color:#6b5a8e; }
.cart-empty a { color:#9d7fff; font-size:0.85rem; font-weight:600; text-decoration:none; }
.cart-item { display:grid; grid-template-columns:64px 1fr auto; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.06); animation:item-slide-in 0.25s ease; }
@keyframes item-slide-in { from{opacity:0;transform:translateX(12px)} to{opacity:1;transform:translateX(0)} }
.cart-item:last-child { border-bottom:none; }
.cart-item-img { width:64px; height:64px; object-fit:contain; border-radius:10px; background:rgba(123,77,255,0.08); border:1px solid rgba(123,77,255,0.15); padding:6px; }
.cart-item-info { display:flex; flex-direction:column; gap:4px; }
.cart-item-name { font-family:'Space Grotesk',sans-serif; font-size:0.88rem; font-weight:700; color:#e0d6ff; }
.cart-item-price { font-size:0.8rem; color:#9d7fff; font-weight:600; }
.qty-stepper { display:flex; align-items:center; background:rgba(255,255,255,0.05); border:1px solid rgba(123,77,255,0.25); border-radius:8px; overflow:hidden; margin-top:6px; width:fit-content; }
.qty-btn { background:none; border:none; cursor:pointer; color:#9d7fff; width:28px; height:28px; font-size:1rem; display:flex; align-items:center; justify-content:center; transition:background 0.15s,color 0.15s; flex-shrink:0; }
.qty-btn:hover { background:rgba(123,77,255,0.2); color:#fff; }
.qty-display { min-width:30px; text-align:center; font-size:0.85rem; font-weight:700; color:#fff; font-family:'Space Grotesk',sans-serif; border-left:1px solid rgba(123,77,255,0.2); border-right:1px solid rgba(123,77,255,0.2); height:28px; display:flex; align-items:center; justify-content:center; }
.cart-item-remove { background:none; border:none; cursor:pointer; color:rgba(255,100,100,0.5); font-size:0.75rem; padding:4px; border-radius:4px; transition:color 0.2s; align-self:flex-start; }
.cart-item-remove:hover { color:#ff6464; background:rgba(255,100,100,0.1); }
.cart-drawer-footer { padding:20px 24px; border-top:1px solid rgba(123,77,255,0.2); background:rgba(0,0,0,0.2); flex-shrink:0; }
.cart-subtotal { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.cart-subtotal-label { font-size:0.8rem; color:#9d7fff; text-transform:uppercase; letter-spacing:0.1em; font-weight:600; }
.cart-subtotal-value { font-family:'Space Grotesk',sans-serif; font-size:1.3rem; font-weight:700; color:#fff; }
.cart-subtotal-note { font-size:0.72rem; color:#6b5a8e; margin-bottom:16px; }
.btn-checkout { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:15px 20px; background:linear-gradient(135deg,#7b4dff,#a855f7); color:#fff; font-family:'Space Grotesk',sans-serif; font-size:0.95rem; font-weight:700; letter-spacing:0.05em; border:none; border-radius:12px; cursor:pointer; box-shadow:0 4px 20px rgba(123,77,255,0.4); transition:box-shadow 0.3s,transform 0.15s; }
.btn-checkout:hover { box-shadow:0 6px 30px rgba(123,77,255,0.65); transform:translateY(-1px); }
.btn-checkout:disabled { opacity:0.4; cursor:not-allowed; pointer-events:none; }
.btn-checkout svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.bankful-secure-note { display:flex; align-items:center; justify-content:center; gap:6px; margin-top:10px; font-size:0.7rem; color:#6b5a8e; }
.bankful-secure-note svg { width:12px; height:12px; stroke:#6b5a8e; fill:none; }
.cart-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(100px); background:rgba(14,10,31,0.95); border:1px solid rgba(123,77,255,0.4); border-radius:12px; padding:12px 20px; color:#e0d6ff; font-size:0.85rem; font-weight:600; display:flex; align-items:center; gap:10px; z-index:1100; backdrop-filter:blur(10px); white-space:nowrap; transition:transform 0.35s cubic-bezier(0.34,1.56,0.64,1),opacity 0.3s; opacity:0; }
.cart-toast.show { transform:translateX(-50%) translateY(0); opacity:1; }
.cart-toast-dot { width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#7b4dff,#a855f7); flex-shrink:0; }

/* Product qty + buttons */
.product-qty-row { display:flex !important; flex-direction:row !important; align-items:center !important; gap:12px; margin:20px 0 16px; flex-wrap:nowrap !important; }
.product-qty-label { font-size:12px; font-weight:700; color:#9d7fff; text-transform:uppercase; letter-spacing:0.1em; white-space:nowrap; flex-shrink:0; }
.product-qty-stepper { display:flex !important; flex-direction:row !important; align-items:center !important; background:rgba(255,255,255,0.04); border:1px solid rgba(123,77,255,0.35); border-radius:10px; overflow:hidden; flex-shrink:0; }
.product-qty-stepper .qty-btn { width:38px !important; height:38px !important; font-size:18px !important; background:none !important; border:none !important; cursor:pointer; color:#9d7fff; display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; transform:none !important; }
.product-qty-stepper .qty-btn:hover { background:rgba(123,77,255,0.2) !important; color:#fff; }
.product-qty-stepper .qty-display { min-width:44px; height:38px; font-size:15px; font-weight:700; color:#fff; font-family:'Space Grotesk',sans-serif; border-left:1px solid rgba(123,77,255,0.2); border-right:1px solid rgba(123,77,255,0.2); display:flex !important; align-items:center !important; justify-content:center !important; }
.product-buttons { display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; align-items:center !important; gap:10px !important; margin-top:4px; }
.product-buttons .btn+.btn { background:linear-gradient(135deg,#7b4dff,#5a2bff) !important; color:#fff !important; border:none !important; }
.product-buttons .btn-buynow { display:inline-flex; align-items:center; justify-content:center; padding:13px 24px; background:linear-gradient(135deg,#7b4dff,#5a2bff); color:#fff; font-family:'Inter',sans-serif; font-size:14px; font-weight:600; border:none; border-radius:10px; cursor:pointer; white-space:nowrap; box-shadow:0 4px 20px rgba(123,77,255,0.35); transition:transform 0.2s,box-shadow 0.2s; }
.product-buttons .btn-buynow:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(123,77,255,0.5); }
.product-buttons .btn-add-to-cart { display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:7px; padding:13px 24px !important; background:transparent !important; border:1px solid rgba(123,77,255,0.5) !important; color:#c4b0ff !important; font-family:'Inter',sans-serif; font-size:14px !important; font-weight:600 !important; border-radius:10px !important; cursor:pointer; white-space:nowrap; transition:all 0.2s !important; }
.product-buttons .btn-add-to-cart:hover { background:rgba(123,77,255,0.15) !important; border-color:rgba(123,77,255,0.8) !important; color:#fff !important; transform:translateY(-2px) !important; }
.product-buttons .btn-add-to-cart.added { background:rgba(80,200,120,0.1) !important; border-color:rgba(80,200,120,0.45) !important; color:#6ee7a0 !important; }
.product-buttons .btn-add-to-cart svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.product-buttons .btn-coa { display:inline-flex; align-items:center; justify-content:center; padding:13px 24px; background:transparent; border:1px solid rgba(123,77,255,0.35); color:#c4b0ff; font-family:'Inter',sans-serif; font-size:14px; font-weight:600; border-radius:10px; cursor:pointer; text-decoration:none; white-space:nowrap; transition:all 0.2s; }
.product-buttons .btn-coa:hover { background:rgba(123,77,255,0.1); color:#fff; transform:translateY(-2px); text-decoration:none; }
.product-buttons .btn-ghost { display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:6px; padding:13px 20px !important; background:transparent !important; border:1px solid rgba(255,255,255,0.1) !important; color:#6b5a8e !important; font-family:'Inter',sans-serif; font-size:14px !important; font-weight:600 !important; border-radius:10px !important; cursor:pointer; text-decoration:none; white-space:nowrap; transition:all 0.2s !important; }
.product-buttons .btn-ghost:hover { border-color:rgba(123,77,255,0.35) !important; color:#c4b0ff !important; background:rgba(123,77,255,0.07) !important; transform:translateY(-2px) !important; text-decoration:none; }

/* Tracer */
.product-detail::before { transition:opacity 0.4s ease; clip-path:none !important; }
.product-detail:target::before { border-color:rgba(155,123,255,0.9); box-shadow:0 0 8px 2px rgba(155,123,255,0.7),0 0 24px 6px rgba(123,77,255,0.45); animation:tracerFade 2.8s ease forwards; }
@keyframes tracerFade { 0%{opacity:0} 15%{opacity:1} 70%{opacity:1} 100%{opacity:0} }

/* z-index */
.navbar { z-index:1001 !important; }
.nav-hamburger { z-index:1002 !important; pointer-events:all !important; }

/* Mobile cart bar hidden on desktop */
.mobile-cart-bar { display:none; }

/* ── MOBILE ── */
@media (max-width:768px) {
  /* Grid nav */
  .nav-inner { display:grid !important; grid-template-columns:44px 1fr 44px !important; align-items:center !important; padding:8px 16px !important; min-height:64px !important; gap:0 !important; }
  .nav-hamburger { display:flex !important; order:1 !important; grid-column:1 !important; justify-self:start !important; position:relative !important; z-index:1002 !important; }
  .nav-left { order:2 !important; grid-column:2 !important; justify-self:center !important; min-width:unset !important; }
  .nav-left a { justify-content:center !important; gap:6px !important; }
  .nav-left .logo { height:52px !important; }
  .nav-brand-text { font-size:0.78rem !important; }
  .nav-right { order:3 !important; grid-column:3 !important; justify-self:end !important; display:flex !important; align-items:center !important; gap:0 !important; }
  .nav-right a { display:none !important; }
  .nav-right .cart-btn { display:flex !important; padding:4px !important; color:#e0d6ff !important; }
  .cart-btn svg { width:24px !important; height:24px !important; }
  .cart-badge { top:-6px !important; right:-6px !important; min-width:20px !important; height:20px !important; border-radius:50% !important; font-size:11px !important; font-weight:800 !important; background:#fff !important; color:#000 !important; box-shadow:none !important; padding:0 !important; }
  .nav-mobile-menu a { color:#c4b0ff !important; text-decoration:none !important; }

  /* Product buttons 2x2 */
  .product-buttons { display:grid !important; grid-template-columns:1fr 1fr !important; gap:10px !important; width:100%; }
  .product-buttons .btn-buynow,.product-buttons .btn-add-to-cart,.product-buttons .btn-coa,.product-buttons .btn-ghost { width:100% !important; justify-content:center !important; padding:13px 12px !important; font-size:13px !important; }

  /* Mobile cart bar */
  .mobile-cart-bar { display:flex; position:fixed; bottom:0; left:0; right:0; z-index:800; padding:12px 16px; padding-bottom:max(12px,env(safe-area-inset-bottom)); background:rgba(6,4,20,0.97); border-top:1px solid rgba(123,77,255,0.3); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); gap:10px; align-items:center; }
  .mobile-cart-bar-info { flex:1; display:flex; flex-direction:column; gap:1px; }
  .mobile-cart-bar-count { font-size:11px; font-weight:600; color:#9d7fff; }
  .mobile-cart-bar-total { font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:700; color:#fff; }
  .mobile-cart-bar-btn { display:flex; align-items:center; justify-content:center; gap:8px; padding:13px 24px; background:linear-gradient(135deg,#7b4dff,#a855f7); color:#fff; font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; border:none; border-radius:12px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  .mobile-cart-bar-btn svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2.5; }
  body { padding-bottom:80px; }
}