/* =====================================================================
   WERP · Tokens de diseño WADAX (tema claro corporativo, v0.2)
   ---------------------------------------------------------------------
   Identidad: fondo blanco, tinta casi negra y el DORADO REAL del
   logotipo (#C7B16F, medido sobre el archivo oficial) administrado
   con avaricia. Todo módulo hereda de aquí: cambiar la identidad =
   cambiar este archivo. Detalle completo en /docs/DISEÑO.md
   ===================================================================== */

:root {
  /* --- Superficies (blanco y papel cálido) --- */
  --fondo:          #FFFFFF;  /* fondo general de la aplicación */
  --superficie:     #FFFFFF;  /* tarjetas (con borde y sombra suave) */
  --superficie-2:   #F7F5F0;  /* papel cálido: cabeceras de tabla, campos */
  --superficie-3:   #FFFFFF;  /* elevado: modales, campo enfocado */
  --lateral-fondo:  #FAF8F3;  /* panel lateral, un punto más cálido */
  --linea:          #E5E1D6;  /* bordes y separadores */
  --linea-suave:    #EFECE4;  /* separadores discretos */
  --linea-fuerte:   #CFC9BA;  /* borde de elementos al pasar el ratón */

  /* --- Dorado WADAX (del logotipo oficial) --- */
  --laton:        #C7B16F;  /* relleno de acento: botón principal, hilo */
  --laton-claro:  #D6C489;  /* hover del acento */
  --laton-oscuro: #A08A4B;  /* borde mecanizado del acento */
  --laton-texto:  #77652F;  /* dorado para TEXTO e iconos sobre blanco */
  --laton-tinta:  #221B0C;  /* tinta sobre dorado (botón principal) */
  --laton-velo:   rgba(199, 177, 111, 0.16);  /* velo crema de acento */

  /* --- Texto --- */
  --texto:        #1B1D22;  /* principal, casi negro */
  --texto-suave:  #4C5058;  /* secundario */
  --texto-mudo:   #6D7178;  /* terciario, etiquetas */

  /* --- Estados (oscurecidos para leerse sobre blanco) --- */
  --ok:           #2E7D52;
  --ok-velo:      rgba(46, 125, 82, 0.12);
  --aviso:        #8A6A1B;
  --aviso-velo:   rgba(176, 138, 44, 0.14);
  --peligro:      #C24551;
  --peligro-velo: rgba(194, 69, 81, 0.10);
  --info-velo:    rgba(88, 94, 104, 0.10);

  /* --- Las burbujas de Mensajes (v0.64.0) ---------------------------
     La conversación se lee sobre papel cálido y las burbujas encima, como
     en WhatsApp: la de los demás en blanco, la propia en el velo crema de
     la casa. El dorado de WADAX es el acento y no el fondo de media
     pantalla, así que la burbuja propia lleva el velo, no el latón. */
  --burbuja:      #FFFFFF;                  /* lo que escriben los demás */
  --burbuja-mia:  #F3EDDA;                  /* lo que escribes tú */
  --burbuja-sombra: 0 1px 1px rgba(40, 34, 18, .12);

  /* Y EL COLOR DEL NOMBRE DE CADA PERSONA EN UN GRUPO. Ocho tonos
     apagados que se distinguen entre sí sobre blanco y que no pelean con
     el dorado. Se eligen por el identificador de la persona, así que son
     los mismos en cualquier conversación y después de recargar. */
  --quien-1: #77652F;   /* dorado de la casa */
  --quien-2: #2E6B57;   /* verde bosque */
  --quien-3: #33567F;   /* azul pizarra */
  --quien-4: #8A4552;   /* burdeos */
  --quien-5: #57457E;   /* violeta apagado */
  --quien-6: #1F6C74;   /* verde azulado */
  --quien-7: #8A5A22;   /* ámbar oscuro */
  --quien-8: #5C6B2E;   /* oliva */

  /* --- Tipografía corporativa ---
     Canaro es la identidad de WADAX. Hasta incorporar sus webfonts
     licenciadas, Jost (en /vendor/fonts) hace de sustituta: cuando
     Canaro exista en fonts.css, se activará sola en todo el ERP. */
  --f-titulos: "Canaro", "Jost", system-ui, -apple-system, sans-serif;
  --f-ui:      "Canaro", "Jost", system-ui, -apple-system, sans-serif;
  --f-datos:   "Canaro", "Jost", system-ui, -apple-system, sans-serif;

  /* --- Escala tipográfica --- */
  --t-12: 0.75rem;
  --t-13: 0.8125rem;
  --t-14: 0.875rem;
  --t-15: 0.9375rem;
  --t-18: 1.125rem;
  --t-22: 1.375rem;
  --t-28: 1.75rem;

  /* --- Espaciado (rejilla de 4px) --- */
  --e-1: 4px;
  --e-2: 8px;
  --e-3: 12px;
  --e-4: 16px;
  --e-5: 20px;
  --e-6: 24px;
  --e-8: 32px;
  --e-10: 40px;

  /* --- Formas y sombras (luz cálida, discreta) --- */
  --radio:    10px;
  --radio-sm: 7px;
  --sombra-1: 0 1px 2px rgba(40, 34, 18, .05), 0 8px 22px rgba(40, 34, 18, .06);
  --sombra-2: 0 4px 14px rgba(40, 34, 18, .10), 0 22px 55px rgba(40, 34, 18, .14);

  /* --- Firma de marca: hilo de latón mecanizado --- */
  --hilo-laton: linear-gradient(90deg,
      var(--laton-oscuro) 0%,
      var(--laton) 18%,
      var(--laton-claro) 50%,
      var(--laton) 82%,
      var(--laton-oscuro) 100%);

  /* --- Medidas de estructura --- */
  --ancho-lateral: 248px;
  --alto-superior: 60px;
}