/* Tokens de marca de LÍBEROS.

   Fuente: docs/marca/LIBEROS_auditoria_grafica_y_manual_de_marca.md, sección 13.
   Este fichero es la única definición de los colores, radios, sombras y
   duraciones de la marca. Nada de lo que hay aquí se repite en una plantilla:
   si un valor no está, se añade aquí y se usa por su nombre.

   Tres correcciones sobre la sección 13 del manual, explicadas en
   docs/marca/AUDITORIA_MANUAL_DE_MARCA.md (M-01, M-02, M-03):

   1. El bloque oscuro del manual por preferencia del sistema era un comentario
      («mismos valores que abajo»), así que copiado tal cual el modo oscuro no
      se activaba nunca. Aquí los valores están escritos.
   2. Faltaba `--lb-text-on-accent`, que la sección 5.3 sí define.
   3. Las sombras están tintadas de Noche: sobre un fondo Noche no se ven. En
      oscuro se redefinen en negro, que es lo que hace sombra ahí.
*/

:root {
  /* --- Marca ------------------------------------------------------------- */
  --lb-violeta-50: #f7f5ff;
  --lb-violeta-100: #eeeafe;
  --lb-violeta-200: #ded6fe;
  --lb-violeta-300: #c7b6fe;
  --lb-violeta-400: #a784ff;
  --lb-violeta-500: #904fff;
  --lb-violeta-600: #8133f1;
  --lb-violeta-700: #681ec8;
  --lb-violeta-800: #521da5;
  --lb-violeta-900: #370d6e;
  --lb-violeta-950: #210249;

  --lb-turquesa-50: #ebfbf8;
  --lb-turquesa-100: #d8f5f0;
  --lb-turquesa-200: #b1eae0;
  --lb-turquesa-300: #78d6c9;
  --lb-turquesa-400: #00c9b7;
  --lb-turquesa-500: #089487;
  --lb-turquesa-600: #028175;
  --lb-turquesa-700: #06665d;
  --lb-turquesa-800: #014e46;
  --lb-turquesa-900: #003631;
  --lb-turquesa-950: #00201c;

  --lb-cielo-50: #f0f8fe;
  --lb-cielo-100: #dcf1ff;
  --lb-cielo-200: #bae3fe;
  --lb-cielo-300: #82ccfb;
  --lb-cielo-400: #23aaed;
  --lb-cielo-500: #038ac4;
  --lb-cielo-600: #0478ab;
  --lb-cielo-700: #005f89;
  --lb-cielo-800: #024868;
  --lb-cielo-900: #01324a;
  --lb-cielo-950: #001d2e;

  --lb-magenta-50: #fdf3ff;
  --lb-magenta-100: #fbe5ff;
  --lb-magenta-200: #f8caff;
  --lb-magenta-300: #f29eff;
  --lb-magenta-400: #e355fa;
  --lb-magenta-500: #cf15e8;
  --lb-magenta-600: #af00c5;
  --lb-magenta-700: #8b039d;
  --lb-magenta-800: #6b0179;
  --lb-magenta-900: #4c0056;
  --lb-magenta-950: #2f0036;

  --lb-niebla-50: #f9fafd;
  --lb-niebla-100: #f2f3f8;
  --lb-niebla-200: #e4e6ed;
  --lb-niebla-300: #d1d4de;
  --lb-niebla-400: #a0a4b2;
  --lb-niebla-500: #6c7180;
  --lb-niebla-600: #585d6e;
  --lb-niebla-700: #41475b;
  --lb-niebla-800: #282f47;
  --lb-niebla-900: #0f1741;
  --lb-niebla-950: #080c27;

  /* --- Funcionales ------------------------------------------------------- */
  --lb-exito: #0b7643;
  --lb-exito-bg: #eaf8ee;
  --lb-aviso: #995b03;
  --lb-aviso-bg: #fdf1e6;
  --lb-error: #cc272e;
  --lb-error-bg: #fef0ee;
  --lb-info: #016baa;
  --lb-info-bg: #ebf5fe;

  /* --- Semánticos (claro) ------------------------------------------------ */
  --lb-bg-canvas: var(--lb-niebla-50);
  --lb-bg-surface: #ffffff;
  --lb-bg-surface-2: var(--lb-niebla-100);
  --lb-bg-inverse: var(--lb-niebla-900);
  --lb-border-subtle: var(--lb-niebla-200);
  --lb-border-strong: var(--lb-niebla-300);
  --lb-text-primary: var(--lb-niebla-900);
  --lb-text-secondary: var(--lb-niebla-600);
  --lb-text-tertiary: var(--lb-niebla-500);
  --lb-text-on-accent: #ffffff;
  --lb-text-link: var(--lb-violeta-600);
  --lb-accent: var(--lb-violeta-600);
  --lb-accent-hover: var(--lb-violeta-700);
  --lb-accent-subtle: var(--lb-violeta-50);
  --lb-accent-subtle-text: var(--lb-violeta-700);
  --lb-focus: var(--lb-violeta-500);

  /* --- Degradados -------------------------------------------------------- */
  --lb-grad-orbita: linear-gradient(135deg, #cf15e8 0%, #8133f1 40%, #521da5 75%, #0f2182 100%);
  --lb-grad-gota: linear-gradient(135deg, #1ae5d3 0%, #23aaed 100%);

  /* --- Liquid Glass (claro) ---------------------------------------------- */
  --lb-glass-regular-bg: rgba(255, 255, 255, 0.64);
  --lb-glass-clear-bg: rgba(255, 255, 255, 0.16);
  --lb-glass-tint-bg: rgba(129, 51, 241, 0.88);
  --lb-glass-border: rgba(255, 255, 255, 0.6);
  --lb-glass-edge: rgba(15, 23, 65, 0.08);
  --lb-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  --lb-glass-filter: blur(24px) saturate(180%);
  --lb-glass-clear-filter: blur(10px) saturate(150%);
  --lb-glass-dim: rgba(8, 12, 39, 0.35);
  --lb-glass-fallback: rgba(255, 255, 255, 0.94);

  /* --- Tipografía -------------------------------------------------------- */
  --lb-font: "Geist", -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", Roboto, sans-serif;

  /* --- Forma ------------------------------------------------------------- */
  --lb-radius-xs: 6px;
  --lb-radius-sm: 10px;
  --lb-radius-md: 14px;
  --lb-radius-lg: 20px;
  --lb-radius-xl: 28px;
  --lb-radius-2xl: 36px;
  --lb-radius-full: 9999px;

  /* --- Elevación --------------------------------------------------------- */
  --lb-e1: 0 1px 2px rgba(15, 23, 65, 0.06), 0 1px 1px rgba(15, 23, 65, 0.04);
  --lb-e2: 0 4px 12px -2px rgba(15, 23, 65, 0.08), 0 2px 4px rgba(15, 23, 65, 0.04);
  --lb-e3: 0 12px 32px -8px rgba(15, 23, 65, 0.18), 0 2px 6px rgba(15, 23, 65, 0.06);
  --lb-e4: 0 24px 64px -12px rgba(15, 23, 65, 0.28);

  /* --- Movimiento -------------------------------------------------------- */
  --lb-dur-1: 120ms;
  --lb-dur-2: 200ms;
  --lb-dur-3: 320ms;
  --lb-dur-4: 480ms;
  --lb-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --lb-ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
}

/* --- Semánticos (oscuro) --------------------------------------------------

   Dos vías, la del sistema y la del atributo, con los mismos valores. La del
   sistema se anula con `data-theme="light"` para que un conmutador pueda
   forzar el modo claro (decisión D6 del manual).
*/
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --lb-bg-canvas: var(--lb-niebla-950);
    --lb-bg-surface: var(--lb-niebla-900);
    --lb-bg-surface-2: var(--lb-niebla-800);
    --lb-bg-inverse: var(--lb-niebla-50);
    --lb-border-subtle: rgba(255, 255, 255, 0.08);
    --lb-border-strong: var(--lb-niebla-700);
    --lb-text-primary: var(--lb-niebla-100);
    --lb-text-secondary: var(--lb-niebla-400);
    --lb-text-tertiary: #8d92a0;
    --lb-text-link: var(--lb-violeta-300);
    --lb-accent-hover: var(--lb-violeta-500);
    --lb-accent-subtle: var(--lb-violeta-950);
    --lb-accent-subtle-text: var(--lb-violeta-300);
    --lb-focus: var(--lb-violeta-400);
    --lb-exito: #63d18f;
    --lb-aviso: #f5b75b;
    --lb-error: #f97770;
    --lb-info: var(--lb-cielo-300);
    --lb-glass-regular-bg: rgba(15, 23, 65, 0.55);
    --lb-glass-clear-bg: rgba(255, 255, 255, 0.08);
    --lb-glass-tint-bg: rgba(129, 51, 241, 0.8);
    --lb-glass-border: rgba(255, 255, 255, 0.14);
    --lb-glass-edge: rgba(0, 0, 0, 0.24);
    --lb-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.18);
    --lb-glass-fallback: rgba(15, 23, 65, 0.94);
    --lb-e1: 0 1px 2px rgba(0, 0, 0, 0.4);
    --lb-e2: 0 4px 12px -2px rgba(0, 0, 0, 0.45), 0 2px 4px rgba(0, 0, 0, 0.3);
    --lb-e3: 0 12px 32px -8px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.35);
    --lb-e4: 0 24px 64px -12px rgba(0, 0, 0, 0.65);
  }
}

:root[data-theme="dark"] {
  --lb-bg-canvas: var(--lb-niebla-950);
  --lb-bg-surface: var(--lb-niebla-900);
  --lb-bg-surface-2: var(--lb-niebla-800);
  --lb-bg-inverse: var(--lb-niebla-50);
  --lb-border-subtle: rgba(255, 255, 255, 0.08);
  --lb-border-strong: var(--lb-niebla-700);
  --lb-text-primary: var(--lb-niebla-100);
  --lb-text-secondary: var(--lb-niebla-400);
  --lb-text-tertiary: #8d92a0;
  --lb-text-link: var(--lb-violeta-300);
  --lb-accent-hover: var(--lb-violeta-500);
  --lb-accent-subtle: var(--lb-violeta-950);
  --lb-accent-subtle-text: var(--lb-violeta-300);
  --lb-focus: var(--lb-violeta-400);
  --lb-exito: #63d18f;
  --lb-aviso: #f5b75b;
  --lb-error: #f97770;
  --lb-info: var(--lb-cielo-300);
  --lb-glass-regular-bg: rgba(15, 23, 65, 0.55);
  --lb-glass-clear-bg: rgba(255, 255, 255, 0.08);
  --lb-glass-tint-bg: rgba(129, 51, 241, 0.8);
  --lb-glass-border: rgba(255, 255, 255, 0.14);
  --lb-glass-edge: rgba(0, 0, 0, 0.24);
  --lb-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.18);
  --lb-glass-fallback: rgba(15, 23, 65, 0.94);
  --lb-e1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --lb-e2: 0 4px 12px -2px rgba(0, 0, 0, 0.45), 0 2px 4px rgba(0, 0, 0, 0.3);
  --lb-e3: 0 12px 32px -8px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.35);
  --lb-e4: 0 24px 64px -12px rgba(0, 0, 0, 0.65);
}
