/* Marca Luce Design — primitivas del Brand Manual v1.3 (capa 1 de 3).

   CANON: este archivo del portal (public/apps/shared/marca.css). El sitio
   lucedesign.lighting tiene una copia idéntica, byte a byte, en css/marca.css:
   se copia con `node tools/marca/copiar-al-sitio.mjs` y se comprueba con
   `--check`. Nunca se edita la copia del sitio.

   Solo un bloque :root con propiedades --ld-*: sin selectores, sin @font-face
   y sin semántica del portal. Los colores no se usan directo en las apps ni en
   el shell; pasan por los semánticos de temas.css (--txt, --gold, --btn-bg…).
   Las escalas (texto, espaciado, radios, duraciones, curva) sí se usan directo.
   Contrastes calculados con la fórmula WCAG 2.x; los re-verifica
   src/lib/__tests__/contraste.test.ts. */

:root {
  /* Paleta del manual */
  --ld-marfil: #F7F5F0;
  --ld-hueso: #EFECE4;
  --ld-blanco: #FFFFFF;
  --ld-gris-claro: #E2E2E2;          /* solo bordes y divisores sobre claro */
  --ld-dorado: #D4AF37;              /* gráfico sobre claro; texto solo sobre oscuro (8.35:1) */
  --ld-dorado-oscuro: #C9A41E;
  --ld-dorado-profundo: #7A6015;     /* dorado como texto sobre claro (5.07:1 sobre Hueso) */
  --ld-gris-calido: #5C594F;
  --ld-cafe-oscuro: #39352A;
  --ld-negro-calido: #1B1914;

  /* Derivados con nombre (superficies y texto secundario del oscuro) */
  --ld-negro-calido-2: #232019;
  --ld-negro-calido-3: #2E2A21;
  --ld-gris-calido-sobre-oscuro: #A8A296;   /* 4.82:1 incluso sobre Café Oscuro */

  /* Controles: borde ≥3:1 (WCAG 1.4.11) y placeholder ≥4.5:1 */
  --ld-borde-control: #857F72;
  --ld-placeholder: #736D61;
  --ld-placeholder-sobre-oscuro: #9B958A;

  /* Estados sobre claro (≥5.1:1 sobre Hueso) */
  --ld-exito: #276B3C;
  --ld-aviso: #94520A;               /* naranja quemado: no se confunde con el dorado */
  --ld-error: #B3362C;
  --ld-info: #2A64A8;

  /* Estados sobre oscuro (≥4.6:1 sobre Café Oscuro) */
  --ld-exito-sobre-oscuro: #6CC08B;
  --ld-aviso-sobre-oscuro: #E0A060;
  --ld-error-sobre-oscuro: #EE7F76;
  --ld-info-sobre-oscuro: #7FA9DD;

  /* Tipografía: Jost para display, Roboto para cuerpo (autoalojadas) */
  --ld-fuente-display: 'Jost', 'Futura', 'Century Gothic', 'Segoe UI', system-ui, sans-serif;
  --ld-fuente-cuerpo: 'Roboto', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  --ld-fuente-mono: ui-monospace, 'Cascadia Code', Consolas, monospace;

  /* Escala de texto; el mínimo es 2xs (12 px) */
  --ld-texto-2xs: .75rem;
  --ld-texto-xs: .8125rem;
  --ld-texto-sm: .875rem;
  --ld-texto-base: .9375rem;
  --ld-texto-md: 1rem;
  --ld-texto-lg: 1.125rem;
  --ld-texto-xl: 1.375rem;
  --ld-texto-2xl: 1.75rem;
  --ld-texto-3xl: 2.25rem;
  --ld-texto-4xl: 3rem;
  --ld-texto-display: clamp(2.25rem, 1.5rem + 3vw, 4rem);

  --ld-peso-normal: 400;
  --ld-peso-medio: 500;
  --ld-peso-semi: 600;
  --ld-peso-bold: 700;

  --ld-interlinea-titulo: 1.15;
  --ld-interlinea-ui: 1.4;
  --ld-interlinea-texto: 1.6;

  --ld-tracking-titulo: .02em;
  --ld-tracking-boton: .04em;
  --ld-tracking-eyebrow: .12em;

  /* Espaciado sobre base de 4 px */
  --ld-esp-1: .25rem;
  --ld-esp-2: .5rem;
  --ld-esp-3: .75rem;
  --ld-esp-4: 1rem;
  --ld-esp-5: 1.25rem;
  --ld-esp-6: 1.5rem;
  --ld-esp-8: 2rem;
  --ld-esp-10: 2.5rem;
  --ld-esp-12: 3rem;
  --ld-esp-16: 4rem;
  --ld-esp-24: 6rem;

  /* Radios */
  --ld-radio-xs: 4px;
  --ld-radio-sm: 6px;
  --ld-radio-md: 8px;
  --ld-radio-lg: 12px;
  --ld-radio-xl: 16px;
  --ld-radio-pill: 999px;

  /* Sombras cálidas (claro) y sus variantes para fondo oscuro */
  --ld-sombra-1: 0 1px 2px rgb(27 25 20 / .06), 0 1px 3px rgb(27 25 20 / .10);
  --ld-sombra-2: 0 8px 24px rgb(27 25 20 / .14);
  --ld-sombra-3: 0 18px 50px rgb(27 25 20 / .22);
  --ld-sombra-arriba: 0 -8px 28px rgb(27 25 20 / .14);
  --ld-sombra-1-oscuro: 0 1px 3px rgb(0 0 0 / .35);
  --ld-sombra-2-oscuro: 0 8px 24px rgb(0 0 0 / .45);
  --ld-sombra-3-oscuro: 0 18px 50px rgb(0 0 0 / .55);
  --ld-sombra-arriba-oscuro: 0 -8px 28px rgb(0 0 0 / .45);

  /* Movimiento */
  --ld-dur-rapida: 150ms;
  --ld-dur-media: 220ms;
  --ld-dur-lenta: 400ms;
  --ld-curva: cubic-bezier(.2, .7, .2, 1);

  /* Foco y velo de diálogos */
  --ld-foco-ancho: 2px;
  --ld-foco-separacion: 2px;
  --ld-velo: rgb(27 25 20 / .5);
  --ld-velo-oscuro: rgb(0 0 0 / .6);
}