/* Light / dark themes — Template 1 */

html {
  color-scheme: dark;
}

html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="light"] {
  --bg-0: #f6f2fa;
  --bg-1: #ebe4f2;
  --bg-2: #ddd3e8;
  --text: #1a1024;
  --muted: #5c4d6e;
  --line: rgba(26, 16, 36, 0.12);
  --glass: rgba(255, 255, 255, 0.72);
  --shadow: 0 20px 50px rgba(26, 16, 36, 0.12);
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at 12% 8%, rgba(251, 113, 133, 0.12), transparent 42%),
    radial-gradient(circle at 88% 12%, rgba(167, 139, 250, 0.1), transparent 45%),
    radial-gradient(circle at 70% 88%, rgba(52, 211, 153, 0.08), transparent 48%),
    linear-gradient(165deg, var(--bg-0), var(--bg-1) 52%, var(--bg-2));
}

html[data-theme="light"] .noise-layer {
  opacity: 0.15;
}

html[data-theme="light"] .topbar,
html[data-theme="light"] body.luxe .topbar {
  background: rgba(255, 255, 255, 0.82);
  border-bottom-color: rgba(26, 16, 36, 0.1);
}

html[data-theme="light"] body.luxe .topbar::before {
  opacity: 0.45;
}

html[data-theme="light"] .glass-card,
html[data-theme="light"] .luxe-hero,
html[data-theme="light"] .luxe-side,
html[data-theme="light"] .product-detail-panel,
html[data-theme="light"] .custom-panel,
html[data-theme="light"] .checkout-panel {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.75));
  border-color: rgba(26, 16, 36, 0.1);
  box-shadow: var(--shadow);
}

html[data-theme="light"] .media-slot {
  border-color: rgba(26, 16, 36, 0.15);
  background: rgba(255, 255, 255, 0.5);
}

html[data-theme="light"] .media-slot__label {
  color: rgba(92, 77, 110, 0.65);
}

html[data-theme="light"] .btn-ghost {
  border-color: rgba(26, 16, 36, 0.2);
  color: var(--text);
}

html[data-theme="light"] .luxe-badge {
  color: #92400e;
  background: rgba(251, 191, 36, 0.2);
}

html[data-theme="light"] #cursor-glow {
  opacity: 0.35;
}

html[data-theme="light"] .orb {
  opacity: 0.35;
}

html[data-theme="light"] .cart-drawer__panel {
  background: #fff;
  color: var(--text);
}

html[data-theme="light"] .glass-card h3,
html[data-theme="light"] .step h3 {
  color: var(--text);
}

html[data-theme="light"] .subtext,
html[data-theme="light"] .glass-card p,
html[data-theme="light"] .trust-strip span {
  color: var(--muted);
}

html[data-theme="light"] .menu a {
  color: var(--muted);
}

html[data-theme="light"] .menu a:hover {
  color: var(--text);
}

.theme-toggle {
  min-width: 2.75rem;
  padding-inline: 0.65rem;
}
