/* ═══════════════════════════════════════════════════════════════
   maX Valuations · capa de tokens
   ───────────────────────────────────────────────────────────────
   Fase 1. Los nombres son los mismos que en Fase 0; lo que cambian
   son los valores. Por eso toda la hoja base.css se mueve a la vez
   sin tocar ni una regla.

   Los tokens que en Fase 0 quedaron marcados FUSIONAR ahora apuntan
   a su hermano en vez de tener valor propio. Siguen existiendo para
   que base.css no se rompa, pero ya no son colores independientes.
   ═══════════════════════════════════════════════════════════════ */


/* ── Tipografía autoalojada ─────────────────────────────────────
   IBM Plex se dibujó para contextos técnicos e institucionales, que
   es exactamente lo que es una herramienta de valoración. La mono no
   es decoración: alinea columnas de €/m² y hace legible de un
   vistazo una referencia catastral de 20 caracteres.

   El sans es una fuente variable (400–600) en un solo fichero.
   Servidas desde el propio dominio: sin CDN de terceros, sin
   petición a Google y sin bloqueo de render por un host ajeno. */

@font-face {
  font-family: 'Plex Sans';
  src: url('../fonts/ibm-plex-sans-var-latin.woff2') format('woff2');
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Plex Mono';
  src: url('../fonts/ibm-plex-mono-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Plex Mono';
  src: url('../fonts/ibm-plex-mono-500-latin.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}


:root {

  /* ── Marca · navy ────────────────────────────────────────────
     --navy-700 no se ha tocado: es el color corporativo y el ancla
     de la rampa. Lo demás son escalones derivados de él. */
  --navy-950: #0b1b2e;
  --navy-900: #102540;
  --navy-800: #14304c;
  --navy-700: #1a3a5c;   /* cabecera, botón primario, acento */
  --navy-600: #2f6394;   /* separador dentro de la cabecera */
  --navy-400: #5b8ab8;
  --navy-300: #8fb2d4;   /* texto secundario sobre la cabecera */
  --navy-250: #a8c4dd;
  --navy-200: #dde8f3;
  --navy-100: #eef4fa;

  /* ── Papel y superficies · neutros cálidos ───────────────────
     El tono cálido es deliberado: distingue la app del gris azulado
     por defecto de casi todo el SaaS del sector. */
  --paper:     #f3f2ec;  /* fondo de la aplicación */
  --surface:   #fff;     /* tarjetas, paneles, barras laterales */
  --surface-2: #faf9f4;  /* campos de formulario, filas de filtro */
  --surface-3: #f7f6f0;  /* hover de fila */
  --surface-5: #efeee6;  /* cabecera de tabla, bloques embebidos */

  --paper-2:   var(--paper);       /* era #f0f0ec: un desliz de tecleo */
  --surface-4: var(--surface-3);

  /* ── Líneas ──────────────────────────────────────────────────
     De cinco grises de borde a tres con función distinta. */
  --line:   #e4e3d9;     /* borde de tarjeta y panel */
  --line-2: #dcdbd0;     /* borde de campo de formulario */
  --line-5: #c9c8ba;     /* rótulo de la banda de carteras plegada */

  --line-3: var(--line-2);
  --line-4: var(--line);

  /* ── Tinta ───────────────────────────────────────────────────
     De nueve escalones a cinco. Y más oscuros: el #888 de antes se
     quedaba en 3,5:1 sobre blanco, por debajo del mínimo AA para
     texto normal. Los cuatro primeros escalones ahora lo cumplen. */
  --ink-900: #1b1b16;    /* texto principal */
  --ink-800: #3d3d35;    /* títulos secundarios */
  --ink-600: #55544a;    /* texto de apoyo */
  --ink-400: #6b6a5e;    /* texto secundario */
  --ink-300: #8a8980;    /* texto terciario */
  --ink-200: #a8a79a;    /* deshabilitado y marcadores de posición */

  --ink-700: var(--ink-800);
  --ink-500: var(--ink-600);
  --ink-450: var(--ink-400);
  --ink-350: var(--ink-400);
  --ink-250: var(--ink-300);

  /* ── Origen del dato ─────────────────────────────────────────
     Distinguen en la tabla de superficies qué viene de Catastro y qué
     es de maX. No son decorativos: tienen gemelo sin almohadilla en
     SUP_FILL_* (app.js) para que la exportación a Excel coincida. Si
     se cambian aquí, hay que cambiarlos allí. */
  --origen-cat: #e8eef4;
  --origen-max: #e1f2dc;

  /* ── Acento · latón ──────────────────────────────────────────
     Un solo sitio se lleva el color cálido: el resultado de una
     valoración. Si empieza a aparecer en otras partes, deja de
     significar nada. */
  --brass:      #9a6b1f;
  --brass-ink:  #7d5615;
  --brass-bg:   #f6edda;
  --brass-line: #e6d4ac;

  /* ── Semánticos ──────────────────────────────────────────────
     Familia aparte del acento: nunca hacen de color de marca y el
     de marca nunca comunica estado. --info se alinea ahora con la
     rampa navy en vez de ser un azul suelto. */
  --pos:        #2e7150;
  --pos-bg:     #e4f0e9;
  --warn:       #a8761c;
  --warn-bg:    #f8eeda;
  --neg:        #a33e2c;
  --info:       #2f6394;
  --info-strong:#14304c;
  --info-bg:    #dde8f3;

  /* ── Fondos de los bloques de la ficha ───────────────────────
     Seis matices para los seis bloques de «Datos del inmueble» en
     Valorar con IA. Su única función es delimitar: por eso NO se
     reutilizan los semánticos —verde positivo, ámbar aviso— ni el
     latón, que significan otra cosa y dejarían de significarla.
     Todos rondan el 96 % de luminosidad: separan sin gritar, y el
     texto en --ink-900 mantiene su contraste. */
  --bloque-1: #eef3f8;   /* identificación · azul papel */
  --bloque-2: #f4f1e8;   /* antigüedad · arena */
  --bloque-3: #edf3f0;   /* parcela · verde grisáceo */
  --bloque-4: #f3f0f4;   /* superficies · malva */
  --bloque-5: #f2f4ec;   /* anexos · oliva */
  --bloque-6: #f6f0ea;   /* superficie útil · lino */

  /* ── Veladuras sobre la cabecera navy ────────────────────────
     Blanco con alfa, para que los controles de la cabecera sigan
     funcionando si el navy cambia de tono. */
  --on-navy:    #fff;                  /* texto y iconos sobre navy */
  --on-navy-12: rgba(255,255,255,.12);
  --on-navy-20: rgba(255,255,255,.2);
  --on-navy-22: rgba(255,255,255,.22);
  --on-navy-90: rgba(255,255,255,.9);
  --shadow-soft: rgba(0,0,0,.1);

  --shadow: 0 1px 2px rgba(27,27,22,.05), 0 4px 14px -6px rgba(27,27,22,.10);


  /* ── Espaciado · base 4 ──────────────────────────────────────*/
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 48px;

  /* ── Radios ──────────────────────────────────────────────────*/
  --r-sm: 5px; --r-md: 8px; --r-lg: 12px; --r-pill: 20px;

  /* ── Tipografía ──────────────────────────────────────────────*/
  --t-micro: 10px;   /* rótulos en versal */
  --t-mini:  11px;   /* controles compactos */
  --t-sm:    12px;   /* tablas y formularios: el tamaño de trabajo */
  --t-base:  13px;   /* texto corrido */
  --t-md:    15px;   /* títulos de tarjeta */
  --t-lg:    18px;   /* título de pantalla */
  --t-xl:    23px;   /* cifra de resultado */

  --font-ui:  'Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-num: 'Plex Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;
}
