/* ==========================================================================
   PROTOCOLE ZÉRO SALLE — Interface sombre
   Mêmes écrans que l'interface claire : seules les couleurs changent.
   Accents éclaircis pour rester lisibles sur fond sombre (contraste AA).
   ========================================================================== */

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

  --color-bg: #0b0b10;
  --color-bg-elevated: #14141b;
  --color-card: #17171f;
  --color-card-alt: #20202a;

  --color-ink: #1b1b25;
  --color-ink-soft: #262632;

  --color-text: #f2f2f6;
  --color-text-secondary: #a9a9b5;
  --color-text-tertiary: #8d8d99;

  --color-accent: #ff7a45;
  --color-accent-tint: #2c1911;
  --color-coach: #9a8fff;
  --color-coach-tint: #211d40;
  --color-steps: #45c6f2;
  --color-steps-tint: #0f2733;
  --color-reward: #f5c542;
  --color-reward-tint: #2b2311;
  --color-red-dark: #ff6b6b;
  --color-red-tint: #3a1618;
  --color-green-dark: #40d98a;
  --color-green-tint: #11281b;
  --color-blue: #5aa9ff;

  --color-matte-dark: #38383c;
  --color-matte-white: #ededee;
  --color-matte-light: #c9c9cd;
  --color-matte-black: #1d1d1f;

  --color-hairline: rgba(255, 255, 255, 0.08);
  --color-hairline-strong: rgba(255, 255, 255, 0.16);

  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-card-hover: 0 2px 4px rgba(0, 0, 0, 0.45), 0 14px 32px rgba(0, 0, 0, 0.45);
  --shadow-float: 0 12px 40px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] body { background: var(--color-bg); color: var(--color-text); }

/* Boutons principaux : noirs en clair → blancs en sombre (sinon invisibles) */
html[data-theme="dark"] .btn-primary { background: #f2f2f6; color: #0c0c12; box-shadow: none; }
html[data-theme="dark"] .lang-gate .btn-primary { background: #fff; color: #0c0c12; }
html[data-theme="dark"] .input:focus { border-color: var(--color-text); box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08); }
/* .spinner-dark suit --color-text : clair en interface sombre, rien à redéfinir */
html[data-theme="dark"] .toast { background: #25252f; box-shadow: 0 0 0 1px var(--color-hairline-strong), var(--shadow-float); }
html[data-theme="dark"] ::selection { background: #f2f2f6; color: #0c0c12; }

/* Cartes « encre » : un liseré pour les détacher du fond sombre */
html[data-theme="dark"] .hero-card,
html[data-theme="dark"] .recap-hero,
html[data-theme="dark"] .flame-hero { box-shadow: 0 0 0 1px var(--color-hairline-strong), var(--shadow-card); }

/* Icônes et petits éléments qui étaient noirs sur fond clair */
html[data-theme="dark"] .coach-close svg,
html[data-theme="dark"] .gallery-close svg { stroke: var(--color-text) !important; }
html[data-theme="dark"] .bmi-gauge-marker { border-color: var(--color-bg); }
html[data-theme="dark"] .rhythm-card.is-selected { background: #f2f2f6; border-color: #f2f2f6; color: #0c0c12; }
html[data-theme="dark"] .coach-attachment button { background: rgba(255, 255, 255, 0.12); color: var(--color-text); }
html[data-theme="dark"] .trophy-detail-rank.is-reached { background: color-mix(in srgb, var(--rank-2) 18%, var(--color-card)); }
html[data-theme="dark"] .dev-status { background: #2b2311; border-color: #8a6d00; }
html[data-theme="dark"] .dev-status p { color: #f5d88a; }
html[data-theme="dark"] .badge-gold { background: #2b2311; color: #f5c542; }

/* Courbe de poids : bulle claire sur fond sombre */
html[data-theme="dark"] .wc-bubble text { fill: #0c0c12; }
html[data-theme="dark"] .wc-dot { fill: var(--color-bg); }

/* Barre de saisie du coach et suggestions */
html[data-theme="dark"] .coach-chip { background: var(--color-coach-tint); }
html[data-theme="dark"] .msg-row.from-coach .msg-bubble { background: var(--color-card-alt); }

/* Choix de l'interface (paramètres et inscription) */
.theme-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.theme-option { padding: 10px; border-radius: var(--radius-md); background: var(--color-card-alt); border: 2px solid transparent; text-align: center; font-weight: 700; font-size: 14px; color: var(--color-text); transition: border-color 0.2s, transform 0.15s var(--ease-spring); }
.theme-option:active { transform: scale(0.97); }
.theme-option.is-selected { border-color: var(--color-accent); }
.theme-preview { height: 86px; border-radius: 12px; margin-bottom: 8px; padding: 10px; display: flex; flex-direction: column; gap: 6px; }
.theme-preview i { display: block; height: 12px; border-radius: 6px; }
.theme-preview.is-light { background: #f4f4f8; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); }
.theme-preview.is-light i { background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.theme-preview.is-light i:first-child { background: #0c0c12; height: 26px; }
.theme-preview.is-dark { background: #0b0b10; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
.theme-preview.is-dark i { background: #20202a; }
.theme-preview.is-dark i:first-child { background: #262632; height: 26px; }