/* ─────────────────────────────────────────────
   Puente: los tokens semánticos de Luca, definidos con los de VOOST DS
   (Documentacion/Plan-Interfaz-VOOST-2026-10-26.md, §5.1)

   Hasta la V9 Luca cargaba su sistema de diseño anterior (design-system/colors_and_type.css), y este fichero
   redefinía sus tokens con los de VOOST para que la aplicación saliera ya con su paleta. Desde la V9 ese sistema no
   se carga y la interfaz pinta con tokens de VOOST; aquí quedan solo los nombres SEMÁNTICOS de Luca que algunas hojas
   siguen usando (--content-*, --bg-*, --border-*, --surface-l*, --shadow-1…4), apuntando a semánticos de VOOST:
   siguen el tema solos. Los primitivos de Luca (--neutral-*, --luca-*…) se retiraron con él; VoostCssRulesTests
   impide que vuelvan.

   Va DESPUÉS de voost-tokens.css. Todo en :root, el elemento que lleva data-theme y data-product: una variable que
   apunta a otra se resuelve en el elemento donde se declara.
   ───────────────────────────────────────────── */

:root {
  /* ── Contenido (texto e iconos) ── */
  --content-primary:           var(--text);
  --content-secondary:         var(--text-muted);
  --content-tertiary:          var(--text-subtle);
  --content-disabled:          color-mix(in srgb, var(--text) 32%, transparent);
  --content-primary-inverse:   var(--surface);
  --content-secondary-inverse: color-mix(in srgb, var(--surface) 82%, transparent);
  --content-tertiary-inverse:  color-mix(in srgb, var(--surface) 64%, transparent);
  --content-brand:             var(--accent-text);
  --content-link:              var(--accent-text);
  --content-link-hover:        var(--text);
  --content-link-pressed:      var(--text);
  --content-info:              var(--info-text);
  --content-info-bold:         var(--info-on-soft);
  --content-notice:            var(--warning-text);
  --content-notice-bold:       var(--warning-on-soft);
  --content-negative:          var(--negative-text);
  --content-negative-bold:     var(--negative-on-soft);
  --content-positive:          var(--positive-text);
  --content-positive-bold:     var(--positive-on-soft);

  /* ── Fondos ── Los de estado, mezclando el texto con la superficie: así funcionan en los dos temas sin un token
     de VOOST para cada uno. */
  --bg-default:         var(--surface);
  --bg-subtle:          var(--surface-sunken);
  --bg-hover:           color-mix(in srgb, var(--text) 4%, var(--surface));
  --bg-pressed:         color-mix(in srgb, var(--text) 8%, var(--surface));
  --bg-disabled:        color-mix(in srgb, var(--text) 5%, var(--surface));
  --bg-selected:        var(--accent-selected);
  --bg-inverse:         var(--text);
  --bg-brand:           var(--accent);
  --bg-brand-hover:     var(--accent-hover);
  --bg-brand-pressed:   var(--accent-pressed);
  --bg-info:            var(--info-icon);
  --bg-info-subtle:     var(--info-soft);
  --bg-notice:          var(--warning-icon);
  --bg-notice-subtle:   var(--warning-soft);
  --bg-negative:        var(--negative-icon);
  --bg-negative-subtle: var(--negative-soft);
  --bg-positive:        var(--positive-icon);
  --bg-positive-subtle: var(--positive-soft);

  /* ── Bordes ── */
  --border-primary:   var(--text);
  --border-secondary: var(--line-strong);
  --border-tertiary:  var(--line);
  --border-disabled:  var(--line);
  --border-brand:     var(--accent);
  --border-inverse:   var(--surface);
  --border-focus:     var(--accent);
  --border-info:      var(--info-icon);
  --border-notice:    var(--warning-icon);
  --border-negative:  var(--negative-icon);
  --border-positive:  var(--positive-icon);
  --border-mono:      var(--text);

  /* ── Superficies por elevación ── */
  --surface-l1: var(--surface);
  --surface-l2: var(--surface-sunken);
  --surface-l3: color-mix(in srgb, var(--text) 3%, var(--surface));
  --surface-l4: color-mix(in srgb, var(--text) 5%, var(--surface));
  --surface-l5: color-mix(in srgb, var(--text) 7%, var(--surface));
  --surface-l6: var(--line);

  --overlay-50: var(--surface-scrim);
  --overlay-75: color-mix(in srgb, var(--ink) 75%, transparent);

  /* ── Sombras ── VOOST no tiene sombra en oscuro (sus tokens valen none): el borde la sustituye. */
  --shadow-1: var(--shadow-sm);
  --shadow-2: var(--shadow-md);
  --shadow-3: var(--shadow-lg);
  --shadow-4: var(--shadow-lg);
}

/* El texto por defecto de la página, en la fuente y el color de VOOST, y el fondo: se ve en las páginas sin marco
   (entrar, recuperar la contraseña). */
html,
body {
  background: var(--surface);
}

body {
  font-family: var(--font-body);
  color: var(--text);
}
