/* ============================================
   6 Theme Variants for the Independent Station
   ============================================ */

/* ── Theme 1: Forest Green (default) ── */
[data-theme="green"] {
  --color-primary: #2bb673;
  --color-primary-dark: #1f8e57;
  --color-secondary: #ff6b35;
  --color-text: #1a1a2e;
  --color-text-muted: #6b7280;
  --color-link: #2bb673;
  --color-link-hover: #1f8e57;
  --color-bg: #f8f9fa;
  --color-bg-soft: #f0f3f0;
  --color-border: #e2e5ea;
  --color-header-bg: #fff;
  --color-footer-bg: #fff;
  --color-topbar-bg: #fff;
  --color-price: #e63946;
  --color-old-price: #adb5bd;
  --color-rating: #f4a100;
  --color-discount-bg: #e63946;
  --hero-bg: linear-gradient(135deg, #e8f7ee, #f0fdf4, #fff);
  --btn-shadow: 0 4px 12px rgba(43,182,115,.3);
  --card-hover-border: var(--color-primary);
}

/* ── Theme 2: Ocean Blue ── */
[data-theme="blue"] {
  --color-primary: #2563eb;
  --color-primary-dark: #1d4ed8;
  --color-secondary: #f59e0b;
  --color-text: #111827;
  --color-text-muted: #6b7280;
  --color-link: #2563eb;
  --color-link-hover: #1d4ed8;
  --color-bg: #f1f5f9;
  --color-bg-soft: #e2e8f0;
  --color-border: #cbd5e1;
  --color-header-bg: #fff;
  --color-footer-bg: #fff;
  --color-topbar-bg: #fff;
  --color-price: #dc2626;
  --color-old-price: #94a3b8;
  --color-rating: #f59e0b;
  --color-discount-bg: #dc2626;
  --hero-bg: linear-gradient(135deg, #dbeafe, #eff6ff, #fff);
  --btn-shadow: 0 4px 12px rgba(37,99,235,.3);
  --card-hover-border: var(--color-primary);
}

/* ── Theme 3: Sunset Orange ── */
[data-theme="orange"] {
  --color-primary: #ea580c;
  --color-primary-dark: #c2410c;
  --color-secondary: #2563eb;
  --color-text: #1c1917;
  --color-text-muted: #78716c;
  --color-link: #ea580c;
  --color-link-hover: #c2410c;
  --color-bg: #fef7ee;
  --color-bg-soft: #fff7ed;
  --color-border: #fed7aa;
  --color-header-bg: #fff;
  --color-footer-bg: #fff;
  --color-topbar-bg: #fff;
  --color-price: #b91c1c;
  --color-old-price: #a8a29e;
  --color-rating: #f59e0b;
  --color-discount-bg: #b91c1c;
  --hero-bg: linear-gradient(135deg, #ffedd5, #fff7ed, #fff);
  --btn-shadow: 0 4px 12px rgba(234,88,12,.3);
  --card-hover-border: var(--color-primary);
}

/* ── Theme 4: Royal Purple ── */
[data-theme="purple"] {
  --color-primary: #7c3aed;
  --color-primary-dark: #6d28d9;
  --color-secondary: #f43f5e;
  --color-text: #18181b;
  --color-text-muted: #71717a;
  --color-link: #7c3aed;
  --color-link-hover: #6d28d9;
  --color-bg: #faf5ff;
  --color-bg-soft: #f3e8ff;
  --color-border: #d8b4fe;
  --color-header-bg: #fff;
  --color-footer-bg: #fff;
  --color-topbar-bg: #fff;
  --color-price: #e11d48;
  --color-old-price: #a1a1aa;
  --color-rating: #f59e0b;
  --color-discount-bg: #e11d48;
  --hero-bg: linear-gradient(135deg, #ede9fe, #f5f3ff, #fff);
  --btn-shadow: 0 4px 12px rgba(124,58,237,.3);
  --card-hover-border: var(--color-primary);
}

/* ── Theme 5: Dark Noir ── */
[data-theme="dark"] {
  --color-primary: #10b981;
  --color-primary-dark: #059669;
  --color-secondary: #f59e0b;
  --color-text: #e5e7eb;
  --color-text-muted: #9ca3af;
  --color-link: #34d399;
  --color-link-hover: #6ee7b7;
  --color-bg: #111827;
  --color-bg-soft: #1f2937;
  --color-border: #374151;
  --color-header-bg: #1f2937;
  --color-footer-bg: #1f2937;
  --color-topbar-bg: #1f2937;
  --color-price: #f87171;
  --color-old-price: #6b7280;
  --color-rating: #fbbf24;
  --color-discount-bg: #ef4444;
  --hero-bg: linear-gradient(135deg, #064e3b, #1f2937, #111827);
  --btn-shadow: 0 4px 12px rgba(16,185,129,.3);
  --card-hover-border: #10b981;
}

/* ── Theme 6: Minimal Mono ── */
[data-theme="mono"] {
  --color-primary: #374151;
  --color-primary-dark: #1f2937;
  --color-secondary: #6b7280;
  --color-text: #111827;
  --color-text-muted: #6b7280;
  --color-link: #111827;
  --color-link-hover: #4b5563;
  --color-bg: #fff;
  --color-bg-soft: #f9fafb;
  --color-border: #e5e7eb;
  --color-header-bg: #fff;
  --color-footer-bg: #fff;
  --color-topbar-bg: #fff;
  --color-price: #111827;
  --color-old-price: #9ca3af;
  --color-rating: #374151;
  --color-discount-bg: #111827;
  --hero-bg: linear-gradient(135deg, #f9fafb, #f3f4f6, #fff);
  --btn-shadow: 0 4px 12px rgba(55,65,81,.2);
  --card-hover-border: #374151;
}

/* ── Theme Switcher Widget ── */
.theme-switcher {
  position: fixed; left: 20px; bottom: 28px; display: flex; flex-direction: column; gap: 8px; z-index: 61;
}
.theme-switcher button {
  width: 36px; height: 36px; border-radius: 999px; border: 2px solid transparent;
  cursor: pointer; font-size: 0; transition: all .2s; box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.theme-switcher button:hover { transform: scale(1.15); }
.theme-switcher button.active { border-color: #fff; box-shadow: 0 0 0 2px var(--color-primary, #2bb673); }
.theme-switcher button[data-theme="green"]  { background: linear-gradient(135deg, #2bb673, #1f8e57); }
.theme-switcher button[data-theme="blue"]   { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.theme-switcher button[data-theme="orange"] { background: linear-gradient(135deg, #ea580c, #f97316); }
.theme-switcher button[data-theme="purple"] { background: linear-gradient(135deg, #7c3aed, #6d28d9); }
.theme-switcher button[data-theme="dark"]   { background: linear-gradient(135deg, #1f2937, #111827); }
.theme-switcher button[data-theme="mono"]   { background: linear-gradient(135deg, #6b7280, #374151); }
