/* Docuprint — Color tokens
   Architecture: Material Design 3 · Black & White core · single chromatic accent.
   Accent = Docuprint brand red (#C1121F family, from the logo "D" mark).
   The accent is the ONLY chromatic colour in the system — <10% of any surface.
   Source of truth: Livriz/Docuprint "Folio" M3 token set + Proyecto 180K/3000 deck. */

:root {
  /* ─── Brand accent (Docuprint red) ──────────────────────── */
  --brand-accent:        #c1121f;   /* primary brand red */
  --brand-accent-hover:  #9e0e18;
  --brand-accent-pressed:#7e0b13;
  --brand-accent-soft:   #fbe8e9;   /* tinted surface — chips, banners */
  --brand-accent-deep:   #6e1416;   /* deepest red, decorative */
  --brand-accent-on:     #ffffff;   /* foreground on accent */

  /* ─── Neutrals (Black & White core) ─────────────────────── */
  --neutral-0:    #ffffff;
  --neutral-50:   #fafafa;
  --neutral-100:  #f4f4f4;
  --neutral-200:  #e8e8e8;
  --neutral-300:  #d6d6d6;
  --neutral-400:  #b8b8b8;
  --neutral-500:  #909090;
  --neutral-600:  #6b6b6b;
  --neutral-700:  #4a4a4a;
  --neutral-800:  #2a2a2a;
  --neutral-900:  #141414;
  --neutral-1000: #000000;

  /* ─── M3 semantic tokens (light scheme) ─────────────────── */
  --md-sys-color-primary:              var(--brand-accent);
  --md-sys-color-on-primary:           #ffffff;
  --md-sys-color-primary-container:    var(--brand-accent-soft);
  --md-sys-color-on-primary-container: #5a0a10;
  --md-sys-color-secondary:            #000000;
  --md-sys-color-on-secondary:         #ffffff;
  --md-sys-color-secondary-container:  #f4f4f4;
  --md-sys-color-on-secondary-container:#141414;
  --md-sys-color-surface:              #ffffff;
  --md-sys-color-surface-dim:          #f4f4f4;
  --md-sys-color-surface-container-low: #fafafa;
  --md-sys-color-surface-container:    #f4f4f4;
  --md-sys-color-surface-container-high:#ececec;
  --md-sys-color-on-surface:           #141414;
  --md-sys-color-on-surface-variant:   #4a4a4a;
  --md-sys-color-outline:              #b8b8b8;
  --md-sys-color-outline-variant:      #e8e8e8;
  --md-sys-color-inverse-surface:      #2a2a2a;
  --md-sys-color-inverse-on-surface:   #fafafa;
  --md-sys-color-scrim:                rgba(0,0,0,0.5);

  /* ─── Status palette (desaturated, sits next to the red) ── */
  /* Copy carries urgency, colour confirms it. Saturated value = text/icon/border
     only; `-soft` is the only banner/chip background. <10% of any screen. */
  --status-danger:       #c8200c;
  --status-danger-hover: #a41809;
  --status-danger-soft:  #fbe9e6;
  --status-warning:      #b7791f;
  --status-warning-soft: #fbf1de;
  --status-success:      #1f8a5b;
  --status-success-soft: #e4f4eb;
  --status-info:         #0e63c4;   /* celeste/azul — informativo (no reusa el rojo) */
  --status-info-soft:    #e4eefb;

  /* ─── Foreground / background roles ─────────────────────── */
  --fg-1: var(--neutral-1000);   /* primary text */
  --fg-2: var(--neutral-700);    /* secondary text */
  --fg-3: var(--neutral-500);    /* tertiary text, placeholders */
  --fg-disabled: var(--neutral-400);
  --fg-accent: var(--brand-accent);
  --fg-inverse: var(--neutral-0);

  --bg-1: var(--neutral-0);      /* base canvas */
  --bg-2: var(--neutral-50);     /* subtle surface */
  --bg-3: var(--neutral-100);    /* raised surface / cards */
  --bg-4: var(--neutral-200);    /* recessed / well */
  --bg-inverse: var(--neutral-1000);

  --border-1: var(--neutral-200);  /* default divider */
  --border-2: var(--neutral-300);  /* stronger border */
  --border-strong: var(--neutral-1000);

  /* ─── Legacy aliases (keep older components/cards working) ─ */
  --dp-red:        var(--brand-accent);
  --dp-red-dark:   var(--brand-accent-hover);
  --dp-red-deep:   var(--brand-accent-deep);
  --dp-gray:       var(--neutral-700);
  --dp-white:      var(--neutral-0);
  --dp-neutral-50: var(--neutral-50);
  --dp-neutral-100:var(--neutral-100);
  --dp-neutral-200:var(--neutral-200);
  --dp-neutral-300:var(--neutral-300);
  --dp-neutral-400:var(--neutral-400);
  --dp-neutral-500:var(--neutral-500);
  --dp-neutral-600:var(--neutral-600);
  --dp-neutral-700:var(--neutral-700);
  --dp-neutral-800:var(--neutral-800);
  --dp-neutral-900:var(--neutral-900);
  --dp-wine-950:#1d0611;
  --dp-wine-900:#2f050c;
  --dp-wine-800:#5a0c14;
  --dp-wine-700:#75111d;

  --text-display: var(--fg-1);
  --text-body:    var(--fg-2);
  --text-muted:   var(--fg-3);
  --text-inverse: var(--fg-inverse);
  --text-accent:  var(--brand-accent);
  --surface-page: var(--bg-1);
  --surface-subtle: var(--bg-2);
  --surface-card: var(--bg-1);
  --surface-dark: var(--dp-wine-950);
  --surface-brand: var(--brand-accent);
  --border-subtle: var(--border-1);
  --action-primary: var(--brand-accent);
  --action-primary-hover: var(--brand-accent-hover);
  --focus-ring: rgba(193, 18, 31, 0.35);
}