/* Sabbia · LA PALETA. Colores, pesos y formas de toda la aplicación.
   ═══════════════════════════════════════════════════════════════════
   Está en su propio fichero desde el 21-09-2026 para que pueda usarlo
   quien NO quiere el armazón entero: las puertas (login, bienvenida,
   plataforma) son páginas de marca sin la app detrás, pero sus colores
   tienen que ser LOS MISMOS. Antes se los copiaban a mano y se quedaban
   atrás en cuanto la base cambiaba.

   · Pantalla de la app  → enlaza `sabbia.css` (que importa esto).
   · Página suelta       → enlaza `tokens.css` y maqueta lo suyo.

   Aquí se AÑADE un color cuando hace falta uno nuevo. Escribirlo a mano
   en una pantalla es como se llegó a tener seis ámbares distintos para
   decir la misma cosa. */

:root{
  /* — Colores (suaves, contraste bajo) — */
  --blanco:#ffffff;
  --papel:#fdfcfa;          /* blanco cálido de tarjetas/paneles */
  --fondo:#f5f3ee;          /* fondo de la app (body) */
  --arena:#e8dfd0;
  --arena-clara:#f4f1ea;
  --tierra:#b89b82;         /* acento Verifactu / avisos cálidos */
  --agua:#7fb8af;           /* acento primario claro (marco base) */
  --agua-hondo:#4a8f86;     /* acento primario hondo (texto/hover/ok) */
  --grafito:#4a4842;        /* texto principal: gris cálido, no casi-negro */
  --gris:#9c968b;           /* texto secundario */
  --gris-claro:#c4bfb5;
  --linea:#ece7dd;          /* bordes y separadores */
  --err:#bb6a48;            /* errores / avisos / vencido (teja suave) */

  /* — La paleta que faltaba (21-09-2026) —
     Cada uno de estos nace de un literal repetido por la app. Si mañana
     hace falta un color que no está aquí, se añade AQUÍ y se usa el token:
     escribirlo a mano en una pantalla es como se llegó a tener seis
     ámbares para decir la misma cosa. */
  --ambar:#c8922e;          /* atención: vence pronto, revísalo, sugerencia */
  --ambar-hondo:#a3701f;    /* el mismo, para texto sobre claro */
  --ok:#4a7c59;             /* está bien: cobrado, al día, validado */
  --ok-hondo:#3f6e4d;
  --err-hondo:#b3261e;      /* lo destructivo: borrar, bloqueado, caído.
                               OJO: --err (teja) es para avisos cálidos —
                               «vencido» y «borrar para siempre» no son lo
                               mismo y no deben pintarse igual. */
  --gris-frio:#8a8f98;      /* neutro frío: estados apagados, el visor */

  /* — Sibylla — Estaban solo en nav.js, así que una página sin nav.js se
     quedaba sin el malva. La base los da por defecto; nav.js los puede
     seguir redefiniendo, igual que hace con los del despacho. */
  --sibia:#a47ba0;
  --sibia-hondo:#8e6389;
  --sibia-suave:rgba(164,123,160,.13);

  /* — Los colores del DESPACHO (horizontales a toda la app) —
     Por defecto, la paleta de la casa. nav.js los RE-DEFINE al arrancar con
     lo elegido en Mi empresa ▸ Marca, y toda página que consuma estos
     tokens se tiñe sola. Consumidores hoy: el botón primario (aquí) y la
     píldora activa del menú (nav.js). Sumar consumidores = usar el token. */
  --despacho-enfasis:var(--agua-hondo); /* acentos de interfaz */
  --boton-borde:var(--agua);            /* botón primario: marco */
  --boton-texto:var(--agua-hondo);      /* botón primario: texto y hover */

  /* — Forma y movimiento — */
  --pill:999px;             /* botones y píldoras */
  --radio:10px;             /* tarjetas y contenedores */
  --trans:.22s;             /* transición suave estándar */
  --sombra:0 1px 3px rgba(74,72,66,.05);   /* casi imperceptible */

  /* — Shell de aplicación (anchos de columna; ajustables aquí) — */
  --col-izq:240px;          /* columna izquierda: menú */
  --col-der:320px;          /* columna derecha: widgets */
  --top-h:64px;             /* alto de la barra superior */

  /* — Las familias (22-09-2026) —
     Tres, y ni una más. Se escribían de once maneras distintas, con
     cadenas de reserva que no coincidían: el día que una fuente no carga,
     cada pantalla cae en una letra distinta.
     Los DOS serifs son a propósito y no se mezclan: la Infant está
     dibujada para lo pequeño (el wordmark, la firma de Sibylla) y la
     Cormorant normal para los titulares grandes de las puertas. */
  --fuente:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --fuente-marca:'Cormorant Infant',Cormorant,Garamond,serif;
  --fuente-titular:'Cormorant',Garamond,serif;
  --fuente-cifra:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* — Pesos tipográficos (negritas con menos peso) — */
  --peso-fuerte:600;        /* antes 700 */
  --peso-medio:500;         /* antes 600 */
  --peso-etq:500;           /* etiquetas */
}