/* ==========================================================================
   TEMA OSCURO — explícito (coincide con los valores por defecto en
   base/variables.css). Se activa con <html data-theme="dark">.
   ========================================================================== */

:root[data-theme='dark'] {
  --color-bg: #0f1117;
  --color-bg-elevated: #171a23;
  --color-bg-elevated-2: #1e222d;
  --color-border: #2a2f3d;
  --color-text: #e8eaf0;
  --color-text-muted: #9aa1b4;

  --color-primary: #6c5ce7;
  --color-primary-hover: #5b4bd6;

  --color-accent: #00d4a0;
  --color-danger: #ff5c7a;
  --color-warning: #ffb020;
  --color-online: #2ecc71;

  --color-overlay: rgba(10, 11, 16, 0.72);
}