/**
 * themes/gold-luxury.css — Gold Luxury Theme
 * Dark & elegant with gold accents. The signature HABiiX look.
 * Based on gold-luxury.html reference template (HABiiX v0.9.9).
 */

/* ── CSS Variable Overrides ──────────────────────────────────────────────── */
:root {
  --primary:       #D4AF37;
  --primary-light: #F4E4B8;
  --primary-dark:  #B8941F;
  --bg:            #0A0A0A;
  --bg-card:       #1A1A1A;
  --text:          #FFFFFF;
  --text-muted:    #CCCCCC;
  --accent:        #D4AF37;
  --gray-light:    #CCCCCC;
  --gray-dark:     #666666;
  /* rgb triplets for rgba() use in store-base.css (was falling back to gold) */
  --primary-rgb:   212,175,55;
  --bg-rgb:        10,10,10;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .header {
  background: rgba(10,10,10,.95);
  border-bottom: 1px solid rgba(212,175,55,.2);
}

/* ── Logo gold ring & glow ───────────────────────────────────────────────── */
[data-theme="gold-luxury"] .logo {
  border: 2px solid var(--primary);
  box-shadow: 0 0 20px rgba(212,175,55,.3);
}

/* ── Store name gold gradient + glow ────────────────────────────────────── */
[data-theme="gold-luxury"] .store-name {
  background: linear-gradient(135deg, #D4AF37, #F4E4B8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 8px rgba(212,175,55,.4));
}

/* ── Promo banner gold shine ─────────────────────────────────────────────── */
[data-theme="gold-luxury"] .promo-banner {
  background: linear-gradient(90deg, #B8941F, #D4AF37, #B8941F);
  color: #0A0A0A;
  overflow: hidden;
  position: relative;
}
[data-theme="gold-luxury"] .promo-banner::before {
  content: '';
  position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  animation: goldShine 3s infinite;
}
@keyframes goldShine { 0% { left: -100%; } 100% { left: 200%; } }

/* ── Hero shimmer ────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .hero-bg {
  background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 50%, #0A0A0A 100%);
}
[data-theme="gold-luxury"] .hero-bg::before {
  background: radial-gradient(circle, rgba(212,175,55,.1) 0%, transparent 70%);
}

/* ── Section title gold-to-white gradient ───────────────────────────────── */
[data-theme="gold-luxury"] .section-title {
  background: linear-gradient(135deg, #D4AF37, #FFFFFF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── Product cards ───────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .product-card {
  background: #1A1A1A;
  border: 1px solid rgba(212,175,55,.2);
  border-radius: 15px;
}
[data-theme="gold-luxury"] .product-card:hover {
  transform: translateY(-10px);
  border-color: #D4AF37;
  box-shadow: 0 20px 40px rgba(212,175,55,.3);
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .add-to-cart-btn {
  background: linear-gradient(135deg, #B8941F, #D4AF37);
  color: #0A0A0A;
}
[data-theme="gold-luxury"] .add-to-cart-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #D4AF37, #F4E4B8);
  color: #0A0A0A;
}
[data-theme="gold-luxury"] .co-btn-order {
  background: linear-gradient(135deg, #B8941F, #D4AF37);
  color: #0A0A0A;
}
[data-theme="gold-luxury"] .co-btn-order:hover {
  background: linear-gradient(135deg, #D4AF37, #F4E4B8);
}

/* ── Cart FAB ────────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .cart-icon {
  background: linear-gradient(135deg, #B8941F, #D4AF37);
  color: #0A0A0A;
  box-shadow: 0 10px 30px rgba(212,175,55,.5);
}
[data-theme="gold-luxury"] .cart-icon:hover {
  box-shadow: 0 12px 40px rgba(212,175,55,.6);
}

/* ── Countdown gold box ──────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .countdown {
  background: rgba(212,175,55,.1);
  border: 1px solid #D4AF37;
  border-radius: 15px;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}
[data-theme="gold-luxury"] .countdown-block {
  background: #1A1A1A;
  border: 2px solid #D4AF37;
  border-radius: 10px;
  padding: 15px 20px;
  min-width: 70px;
}

/* ── Checkout form ───────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .checkout-sheet {
  background: #1A1A1A;
  box-shadow: 0 -20px 60px rgba(212,175,55,.15);
}
[data-theme="gold-luxury"] .co-field input,
[data-theme="gold-luxury"] .co-field select,
[data-theme="gold-luxury"] .co-field textarea {
  background: rgba(255,255,255,.06);
  border-color: rgba(212,175,55,.2);
  color: #FFFFFF;
}
[data-theme="gold-luxury"] .co-field input:focus,
[data-theme="gold-luxury"] .co-field select:focus,
[data-theme="gold-luxury"] .co-field textarea:focus {
  border-color: #D4AF37;
  box-shadow: 0 0 0 3px rgba(212,175,55,.15);
}
[data-theme="gold-luxury"] .co-dropdown-toggle {
  background: rgba(255,255,255,.06);
  border-color: rgba(212,175,55,.2);
  color: #FFFFFF;
}
[data-theme="gold-luxury"] .co-dropdown-panel {
  background: #1e1e1e;
  border-color: rgba(212,175,55,.3);
}
[data-theme="gold-luxury"] .co-dropdown-item:hover,
[data-theme="gold-luxury"] .co-dropdown-item.highlighted { background: rgba(212,175,55,.12); color: #D4AF37; }
[data-theme="gold-luxury"] .co-dropdown-item.selected    { background: rgba(212,175,55,.2);  color: #D4AF37; font-weight: 700; }

/* ── Popups ──────────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .policy-popup,
[data-theme="gold-luxury"] .product-detail-popup {
  background: #1A1A1A;
  border-color: rgba(212,175,55,.3);
  box-shadow: 0 20px 60px rgba(212,175,55,.15);
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] .footer {
  background: #1A1A1A;
  border-top: 2px solid rgba(212,175,55,.3);
}
/* Social icons — no overrides needed (frameless) */

/* ── Scrollbar gold ──────────────────────────────────────────────────────── */
[data-theme="gold-luxury"] ::-webkit-scrollbar-thumb { background: rgba(212,175,55,.35); }

/* ── WhatsApp widget panel ───────────────────────────────────────────────── */
[data-theme="gold-luxury"] .habii-wa-panel {
  background: #1a1a1a;
  border-color: rgba(37,211,102,.2);
}