/* ============================================================================
   Valdra · Sistema de diseño — variantes de tema para los tokens NUEVOS

   Todo lo que en tokens.css es un ALIAS de una variable de app.css (--surface,
   --text, --border, --accent…) ya cambia solo con el tema, porque app.css
   declara esas variables para los tres casos y este archivo no las toca. Lo
   que hace falta redeclarar aquí es únicamente lo que tokens.css define con un
   valor PROPIO y no un alias: --surface-command(-2), --text-on-command(-muted),
   --accent-ai(-soft) y las tres sombras.

   Igual que app.css, cada bloque va escrito DOS VECES — bajo
   `@media (prefers-color-scheme: dark)` para quien no ha elegido tema, y bajo
   `[data-theme="dark"]` para quien pulsó el interruptor con el sistema en
   claro. Es la misma razón documentada en app.css:130-140 y no una nueva.
   ============================================================================ */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    /* surface-command YA es oscura en claro (es la superficie "siempre
       noche" del hero y el compositor); en oscuro se profundiza un punto más
       para seguir leyéndose distinta de --surface-elevated, que en este tema
       también es oscura. */
    --surface-command:   #070C16;
    --surface-command-2: #0C1424;

    --accent-ai:      #818CF8;
    --accent-ai-soft: rgba(129,140,248,.16);

    --shadow-card:     0 1px 2px rgba(0,0,0,.40);
    --shadow-floating: 0 18px 44px -18px rgba(0,0,0,.65), 0 6px 16px -6px rgba(0,0,0,.45);
    --shadow-command:  0 32px 80px -30px rgba(0,0,0,.80), 0 12px 32px -12px rgba(0,0,0,.60);
  }
}

:root[data-theme="dark"] {
  --surface-command:   #070C16;
  --surface-command-2: #0C1424;

  --accent-ai:      #818CF8;
  --accent-ai-soft: rgba(129,140,248,.16);

  --shadow-card:     0 1px 2px rgba(0,0,0,.40);
  --shadow-floating: 0 18px 44px -18px rgba(0,0,0,.65), 0 6px 16px -6px rgba(0,0,0,.45);
  --shadow-command:  0 32px 80px -30px rgba(0,0,0,.80), 0 12px 32px -12px rgba(0,0,0,.60);
}
