/* ============================================================
   LIGHT MODE — overrides pour valeurs codées en dur (non-variables)
   Toutes les règles ici sont scopées sous html[data-theme="light"]
   ============================================================ */

/* ── Header ── */
html[data-theme="light"] #header {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.97), rgba(252, 249, 244, 0.98));
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06);
}

/* ── Navigation desktop ── */
html[data-theme="light"] .main-menu a,
html[data-theme="light"] .dropdown-trigger {
  color: rgba(26, 26, 26, 0.75);
}

html[data-theme="light"] .main-menu a:hover,
html[data-theme="light"] .main-menu a:focus-visible,
html[data-theme="light"] .dropdown-trigger:hover,
html[data-theme="light"] .dropdown-trigger:focus-visible,
html[data-theme="light"] .dropdown-trigger[aria-expanded="true"] {
  color: #1a1a1a;
  background: rgba(0, 0, 0, 0.05);
}

/* ── Icon buttons (cart, profil, connexion) ── */
html[data-theme="light"] .icon-button {
  border-color: rgba(0, 0, 0, 0.10);
  background: rgba(0, 0, 0, 0.03);
  color: #1a1a1a;
}

html[data-theme="light"] .icon-button i {
  color: #1a1a1a;
}

html[data-theme="light"] .icon-button:hover,
html[data-theme="light"] .icon-button:focus-visible {
  background: rgba(0, 0, 0, 0.07);
  color: #111111;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* ── Toggle thème ── */
html[data-theme="light"] #theme-toggle {
  color: #1a1a1a;
}

/* ── Menu mobile — bouton hamburger ── */
html[data-theme="light"] .mobile-menu-toggle {
  border: 1px solid rgba(0, 0, 0, 0.10);
  background: rgba(0, 0, 0, 0.04);
  color: rgba(26, 26, 26, 0.8);
}

html[data-theme="light"] .mobile-menu-toggle:hover,
html[data-theme="light"] .mobile-menu-toggle:focus-visible {
  background: rgba(0, 0, 0, 0.07);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* ── Menu mobile — panneau ── */
html[data-theme="light"] .mobile-menu {
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 253, 250, 0.99);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .mobile-menu-close {
  color: rgba(26, 26, 26, 0.75);
}

html[data-theme="light"] .mobile-menu-close:hover,
html[data-theme="light"] .mobile-menu-close:focus-visible {
  color: #1a1a1a;
}

/* ── Menu mobile — liens ── */
html[data-theme="light"] .mobile-menu-link,
html[data-theme="light"] .mobile-menu-expand-trigger {
  color: rgba(26, 26, 26, 0.8);
}

html[data-theme="light"] .mobile-menu-link:hover,
html[data-theme="light"] .mobile-menu-link:focus-visible,
html[data-theme="light"] .mobile-menu-expand-trigger:hover,
html[data-theme="light"] .mobile-menu-expand-trigger:focus-visible {
  color: #1a1a1a;
}

/* ── Menu mobile — blocs workspace ── */
html[data-theme="light"] .mobile-workspace-block {
  background: rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .mobile-workspace-block:active {
  background: rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] .mobile-workspace-block .block-icon {
  background: rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.07);
  color: #1a1a1a;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

html[data-theme="light"] .mobile-workspace-block .block-title {
  color: #1a1a1a;
}

/* ── Dropdown desktop ── */
html[data-theme="light"] .dropdown-menu {
  background: rgba(255, 253, 250, 0.99);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.10);
}

html[data-theme="light"] .dropdown-item {
  color: rgba(26, 26, 26, 0.8);
}

html[data-theme="light"] .dropdown-item:hover,
html[data-theme="light"] .dropdown-item:focus-visible {
  background: rgba(0, 0, 0, 0.04);
  color: #1a1a1a;
}

html[data-theme="light"] .dropdown-item-title {
  color: #1a1a1a;
}

html[data-theme="light"] .dropdown-item-description {
  color: #6b7280;
}

/* ════════════════════════════════════════════════════════════
   BOUTIQUE — cartes produits
   ════════════════════════════════════════════════════════════ */

html[data-theme="light"] .product-card {
  background:
    linear-gradient(180deg, #ffffff, #faf6f0) padding-box,
    linear-gradient(140deg, rgba(0, 0, 0, 0.07), rgba(0, 0, 0, 0.02)) border-box;
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.05),
    0 8px 28px rgba(0, 0, 0, 0.08);
  color: #1a1a1a;
}

html[data-theme="light"] .product-card::before {
  background:
    radial-gradient(125% 90% at 50% 0%, rgba(109, 242, 210, 0.06), transparent 65%),
    radial-gradient(120% 100% at 50% 100%, rgba(26, 188, 156, 0.04), transparent 70%);
  opacity: 1;
}

html[data-theme="light"] .product-card::after {
  background: radial-gradient(circle at center, rgba(109, 242, 210, 0.10), transparent 65%);
}

html[data-theme="light"] .product-card:hover,
html[data-theme="light"] .product-card:focus-visible {
  background:
    linear-gradient(180deg, #ffffff, #f2faf7) padding-box,
    linear-gradient(135deg, rgba(109, 242, 210, 0.6), rgba(26, 188, 156, 0.2)) border-box;
  box-shadow:
    0 8px 28px rgba(0, 0, 0, 0.10),
    0 0 20px rgba(109, 242, 210, 0.18);
  color: #1a1a1a;
}

html[data-theme="light"] .product-card__visual {
  background: #f0ece5;
}

html[data-theme="light"] .product-title {
  color: #1a1a1a;
  text-shadow: none;
}