/* Chat Mateo · IDENTIDAD VISUAL en un solo lugar.
 * Cambiando estas variables cambia el color de TODO: el chat (lista lateral, mensajes, botones, bordes) Y la pantalla de
 * login (login.css también las usa). `app.css` no escribe colores sueltos: los toma de acá (--bg, --green, etc. son apodos).
 * Paleta del diseño de Tomás (2026-10-03, «App Mateo AI Login» y «Dashboard Mateo AI»): negro verdoso profundo,
 * superficies translúcidas y el verde neón de la "M" de red neuronal.
 * 2026-10-09 (Tomás): un poco más de luz en fondos y paneles (mejor lectura, contraste menos agresivo), sin perder lo sobrio. */
:root {
  --mateo-bg: #0b1512;               /* fondo principal: gris verdoso muy oscuro (antes #030807, casi negro) */
  --mateo-surface: #101d19;          /* paneles (lista lateral) */
  --mateo-surface-2: rgba(26, 44, 37, .78);  /* caja de texto, tarjetas, paneles al pasar el mouse (translúcidos) */
  --mateo-surface-3: #1d3129;        /* detalles (avatares, menús) */
  --mateo-border: rgba(140, 210, 175, .16);         /* bordes sutiles */
  --mateo-border-strong: rgba(140, 225, 180, .3);  /* bordes marcados */
  --mateo-text: #e9f2ed;             /* texto principal */
  --mateo-text-secondary: #a8bab1;   /* texto secundario */
  --mateo-green: #22e58a;            /* verde neón de la marca */
  --mateo-green-hover: #4dffa6;      /* verde al pasar el mouse */
  --mateo-green-ink: #022614;        /* texto sobre fondo verde */
  --mateo-green-soft: rgba(34, 229, 138, .12);  /* fondos verdes suaves (elemento activo) */
  --mateo-green-line: rgba(34, 229, 138, .45);  /* bordes verdes */
  --mateo-glow: rgba(34, 229, 138, .32);        /* resplandor del logo */
  --mateo-danger: #ff4d5e;
  --mateo-danger-soft: rgba(255, 77, 94, .12);
  --mateo-warn: #f5b942;
  --mateo-topbar: rgba(11, 21, 18, .82);           /* barra superior (semitransparente, con desenfoque) */
  --mateo-bg-fade: rgba(11, 21, 18, 0);            /* el degradé que "funde" la caja de texto con el fondo */
  --mateo-code-bg: #0c1714;                     /* fondo de los bloques de código */
  --mateo-backdrop: rgba(4, 10, 8, .68);         /* el velo detrás de las ventanas */
}