/* Tumbo colors — aligned to the Manual de Marca v1.0 (Aug 2026).
   The neutrals carry a slight warm charge toward the red; a pure neutral grey looks borrowed. */
:root{
  /* base ramp — brand red */
  --red-50:#FDE9E8;--red-100:#FBD2D1;--red-200:#F7A9A7;--red-300:#F4807E;
  --red-400:#FA4B4C;--red-500:#F81416;--red-600:#C40E10;--red-700:#9A0B0C;--red-800:#660708;

  /* base ramp — warm neutrals (carbón black, papel white) */
  --neutral-0:#FFFFFF;--neutral-25:#FDFAF9;--neutral-50:#FBF7F6;--neutral-100:#F4EDEC;
  --neutral-200:#EBDEDC;--neutral-300:#D6C4C2;--neutral-400:#A99795;--neutral-500:#8B7C7A;
  --neutral-600:#6A5B5A;--neutral-700:#4E4241;--neutral-800:#2C2223;--neutral-900:#171112;

  /* base ramp — data / semantic support */
  --green-100:#D9F0E6;--green-500:#0B8A60;--green-600:#086A4A;
  --amber-100:#FBEED6;--amber-500:#B87309;--amber-600:#8F5906;

  /* brand — the four named colours of the manual */
  --brand-red:var(--red-500);          /* Rojo Tumbo   #F81416 */
  --brand-red-press:var(--red-600);    /* Rojo Brasa   #C40E10 */
  --brand-black:var(--neutral-900);    /* Negro Carbón #171112 */
  --brand-white:var(--neutral-0);
  --brand-paper:var(--neutral-50);     /* Papel        #FBF7F6 */
  --brand-red-soft:var(--red-50);      /* Rojo Tenue   #FDE9E8 */
  --brand-ash:var(--neutral-500);      /* Gris Ceniza  #8B7C7A */
  --brand-line:var(--neutral-200);     /* Línea        #EBDEDC */

  /* semantic — text */
  --text-strong:var(--neutral-900);
  --text-body:var(--neutral-700);
  --text-muted:var(--neutral-500);
  --text-faint:var(--neutral-400);
  --text-on-red:var(--neutral-0);
  --text-on-dark:var(--neutral-0);
  --text-brand:var(--red-500);
  --text-link:var(--red-500);
  --text-link-hover:var(--red-600);

  /* semantic — surfaces */
  --surface-page:var(--neutral-50);
  --surface-card:var(--neutral-0);
  --surface-sunken:var(--neutral-100);
  --surface-red:var(--red-500);
  --surface-red-soft:var(--red-50);
  --surface-dark:var(--neutral-900);
  --surface-overlay:rgba(23,17,18,.55);

  /* semantic — lines */
  --border-hairline:var(--neutral-200);
  --border-strong:var(--neutral-300);
  --border-red:var(--red-500);
  --border-on-red:rgba(255,255,255,.32);

  /* semantic — states (product only; outside the product red is brand, not error) */
  --state-success:var(--green-500);    /* Verde Cuadre */
  --state-success-soft:var(--green-100);
  --state-warning:var(--amber-500);    /* Ámbar Aviso  */
  --state-warning-soft:var(--amber-100);
  --state-danger:var(--red-500);
  --state-danger-soft:var(--red-50);
  --state-focus:var(--red-500);

  /* money direction — used across caja / ingresos / egresos */
  --money-in:var(--green-500);
  --money-out:var(--red-600);
}

/* Modo oscuro — the POS is used at night. Carbón as ground, red raised to hold contrast. */
:root[data-theme="dark"],[data-theme="dark"]{
  --brand-red:#FF3A33;
  --brand-red-press:#FF6B62;
  --text-strong:#F7F0EF;
  --text-body:#C6B7B5;
  --text-muted:#938482;
  --text-faint:#7A6B6A;
  --text-brand:#FF3A33;
  --text-link:#FF3A33;
  --text-link-hover:#FF6B62;
  --surface-page:#100C0D;
  --surface-card:#1A1516;
  --surface-sunken:#231D1E;
  --surface-red:#FF3A33;
  --surface-red-soft:#3A1615;
  --surface-dark:#100C0D;
  --surface-overlay:rgba(0,0,0,.62);
  --border-hairline:#2E2627;
  --border-strong:#403536;
  --border-red:#FF3A33;
  --state-success:#35C08D;
  --state-success-soft:#123329;
  --state-warning:#E5A63F;
  --state-warning-soft:#3A2A11;
  --state-danger:#FF3A33;
  --state-danger-soft:#3A1615;
  --money-in:#35C08D;
  --money-out:#FF6B62;
}