/* ============================================================
   Bolsa de Trabajo CMP — Tokens de diseño
   Fuente de verdad: Manual_Marca_CMP.pdf §1.5, §1.14, §1.15
   Reemplaza los ~53 hex hardcodeados del prototipo.
   ============================================================ */
:root{
  /* ---- Corporativos (Manual §1.5) ---------------------------- */
  --cmp-purple:        #681E5B;  /* PANTONE 167-1C  */
  --cmp-gold:          #D29703;  /* PANTONE 20-1C   */
  --cmp-purple-alt:    #543576;  /* PANTONE 269 C   */
  --cmp-amber:         #EFA527;  /* PANTONE 7409 C  */
  --cmp-black:         #3C3C3B;  /* PANTONE Black C */
  --cmp-cream:         #FFF8EB;  /* PANTONE 18-9C   */

  /* ---- Derivados de UI (tonos operativos) -------------------- */
  --purple-deep:       #4A1340;  /* títulos, fin de gradiente */
  --purple-soft:       #7E2A6F;  /* inicio de gradiente, outline */
  --purple-tint:       #F5E9F2;  /* fondo de pill e íconos */
  --gold-deep:         #A87905;
  --gold-soft:         #F4D77A;
  --gold-tint:         #FBF1D8;
  --gold-ink:          #3A2400;  /* texto sobre dorado: el negro de marca no contrasta */

  /* ---- Neutros ---------------------------------------------- */
  --paper:             #FFFFFF;
  --surface:           var(--cmp-cream);
  --ink:               #1A1015;
  --ink-soft:          #5B4E55;
  --ink-mute:          #8A7E85;
  --ink-disabled:      #B3A9AF;

  /* ---- Bordes ------------------------------------------------ */
  --line-card:         #ECE4E9;
  --line-input:        #DDD3D9;
  --line-muted:        #E5DBE2;
  --line-divider:      #F2EAEF;

  /* ---- Semánticos -------------------------------------------- */
  --ok:                #2F7D5B;  --ok-deep:  #256448;  --ok-tint:  #E4F1EA;
  --err:               #B23A48;  --err-deep: #8F2E3A;  --err-tint: #FDF3F4;
  --warn:              #B26A00;  --warn-deep:#8A6D12;  --warn-tint:#FDF6E9;
  --info:              #1F4E79;  --info-tint:#EAF3FB;  --info-line:#C4DCF0;

  /* ---- Gama del Gestor (panel administrativo) ---------------- */
  --adm-ink:           #28303F;
  --adm-base:          #42506A;
  --adm-soft:          #3A4557;
  --adm-deep:          #222934;
  --adm-line:          #D3DAE6;
  --adm-surface:       #EEF1F6;
  --adm-card-line:     #E2E5EB;

  /* ---- Gradientes (Manual §1.6 "Degradado Morado / Gris") ---- */
  --grad-purple:       linear-gradient(135deg, var(--purple-soft), var(--purple-deep));
  --grad-purple-round: linear-gradient(160deg, var(--purple-soft), var(--purple-deep));
  --grad-purple-v:     linear-gradient(180deg, var(--cmp-purple), var(--purple-deep));
  --grad-gold:         linear-gradient(135deg, var(--cmp-amber), var(--gold-deep));
  --grad-ok:           linear-gradient(135deg, var(--ok), var(--ok-deep));
  --grad-admin:        linear-gradient(135deg, var(--adm-base), var(--adm-ink));
  --grad-admin-v:      linear-gradient(180deg, var(--adm-soft), var(--adm-deep));

  /* ---- Tipografía (Manual §1.14 y §1.15) -------------------- */
  --font-display: 'Montserrat', system-ui, -apple-system, sans-serif; /* titulares */
  --font-body:    'Open Sans', system-ui, -apple-system, sans-serif;  /* cuerpo, web */
  --font-mono:    'Roboto Mono', ui-monospace, 'Cascadia Mono', monospace; /* RUC, CMP, montos */
  --tracking-tight: -0.02em;   /* ≈ tracking -10 del manual, en titulares */
  --tracking-wide:   0.05em;   /* labels en versalita */

  /* ---- Radios ------------------------------------------------ */
  --r-sm: 9px;  --r-md: 12px;  --r-lg: 16px;  --r-xl: 20px;  --r-pill: 999px;

  /* ---- Elevación (offset de blur negativo = difusa) ---------- */
  --sh-card:   0 8px 24px -20px rgba(74,19,55,.5);
  --sh-panel:  0 10px 30px -22px rgba(74,19,55,.5);
  --sh-modal:  0 20px 50px -30px rgba(74,19,55,.5);
  --sh-admin:  0 20px 50px -30px rgba(40,48,63,.5);
  --sh-toast:  0 14px 34px -14px rgba(0,0,0,.5);

  /* ---- Alturas de control ------------------------------------ */
  --h-input: 44px;  --h-btn: 48px;  --h-btn-sm: 38px;
}

/* Estados de foco que el prototipo eliminó sin sustituto (a11y) */
:where(input, select, textarea, button, a):focus-visible{
  outline: 2px solid var(--cmp-gold);
  outline-offset: 2px;
}