/* ============================================================
   COLORE — core, accenti, stati, superfici, palette 12 mesi
   Nero, crema e lime sono il cuore del brand.
   ============================================================ */

:root {
  /* Ink — il nero brand, foreground principale */
  --color-ink-950: #0E1B2E;   /* nero assoluto, titoli, logo */
  --color-ink-900: #14213A;
  --color-ink-800: #1B2C50;
  --color-ink-700: #2C2C2C;
  --color-ink-600: #4A4A4A;
  --color-ink-500: #6B6B6B;
  --color-ink-400: #8E8E8E;
  --color-ink-300: #B4B4B4;
  --color-ink-200: #D4D4D4;
  --color-ink-100: #E8E7E0;
  --color-ink-50:  #F2EBD3;   /* crema brand — sfondo caldo */

  /* Bone — crema e bianchi caldi */
  --color-bone-base: #F2EBD3; /* crema primaria */
  --color-bone-soft: #F8F2DD;
  --color-bone-pure: #FFFFFF;

  /* Lime — accento primario del brand */
  --color-lime-950: #2B3A06;
  --color-lime-900: #3F5509;
  --color-lime-800: #56730F;
  --color-lime-700: #6F9214;
  --color-lime-600: #A8C72E;
  --color-lime-500: #C5E445;  /* lime brand — core */
  --color-lime-400: #D4FF3A;
  --color-lime-300: #D6E888;
  --color-lime-200: #E6F2B1;
  --color-lime-100: #F0F7D1;
  --color-lime-50:  #F7FBE6;

  /* -----------------------------
     ACCENTI SEMANTICI
     Categorie tematiche editoriali + colori serie nei grafici.
     ----------------------------- */
  /* Bordeaux — "Concerti, live, teatro" */
  --color-bordeaux-700: #3D0F1B;
  --color-bordeaux-600: #5C2B2E;
  --color-bordeaux-500: #7A1F35;
  --color-bordeaux-400: #A8174A;
  --color-bordeaux-200: #F2C4D3;

  /* Coral — "Energia, folla, collettività" */
  --color-coral-700: #C44A38;
  --color-coral-600: #E36550;
  --color-coral-500: #ECA292;
  --color-coral-400: #F9A28F;
  --color-coral-200: #FCD4C7;

  /* Midnight — "Dati, analisi, affidabilità" */
  --color-midnight-900: #0B1438;
  --color-midnight-800: #14215C;
  --color-midnight-700: #1E3080;
  --color-midnight-600: #2C43A6;
  --color-midnight-500: #4861D1;
  --color-midnight-300: #A6B4E8;
  --color-midnight-100: #DCE3F7;

  /* Electric — "Tech, infographic, controllo" */
  --color-electric-700: #0F1FC4;
  --color-electric-600: #1F34E8;
  --color-electric-500: #3B4EF0;
  --color-electric-300: #8D99F6;

  /* Lavanda — "Autorevole, culturale" */
  --color-lavender-500: #9F95C2;
  --color-lavender-300: #C8B6D8;
  --color-lavender-100: #E4DCEE;

  /* Cyan — "Metodo, ordine" */
  --color-cyan-600: #0FB5CC;
  --color-cyan-500: #2CC8DE;
  --color-cyan-300: #82E0EB;

  /* Warm data extras — SOLO dentro grafici / box-dato. */
  --color-red-500:   #E0381F;
  --color-rust-500:  #E0512A;
  --color-olive-700: #3F4A18;
  --color-olive-500: #6E7F2C;
  --color-olive-300: #B6C572;
  --color-dust-300:  #B7C4DD;

  /* Alias semantici legacy (nomi web/feed → token canonici) */
  --color-violet:  var(--color-lavender-500);
  --color-mauve:   var(--color-lavender-300);
  --color-crimson: var(--color-bordeaux-400);

  /* Palette 12 mesi — ordine Gen→Dic. Barre/heatmap temporali. */
  --month-01: var(--color-midnight-800);
  --month-02: #2640D9;
  --month-03: #52BCD4;
  --month-04: #A9B4E4;
  --month-05: var(--color-lavender-500);
  --month-06: var(--color-coral-500);
  --month-07: var(--color-red-500);
  --month-08: var(--color-bordeaux-400);
  --month-09: #7A1F47;
  --month-10: #A3942C;
  --month-11: var(--color-olive-300);
  --month-12: var(--color-olive-700);

  /* -----------------------------
     STATI SEMANTICI (UI prodotto)
     ----------------------------- */
  --color-success: #2FA35E;
  --color-success-bg: #E6F4EC;
  --color-warning: #D6A416;
  --color-warning-bg: #FBF2D6;
  --color-danger: #D23B3B;
  --color-danger-bg: #FBE5E5;
  --color-info: var(--color-electric-500);
  --color-info-bg: #E6EAFD;

  /* -----------------------------
     SUPERFICI (LIGHT / PRODUCT)
     ----------------------------- */
  --surface-page: var(--color-bone-soft);
  --surface-elevated: var(--color-bone-pure);
  --surface-sunken: #EFEEE2;
  --surface-contrast: var(--color-ink-950);
  --surface-accent: var(--color-lime-500);

  --border-subtle: #E1DFD0;
  --border-default: #CFCDBE;
  --border-strong: var(--color-ink-300);

  --text-primary: var(--color-ink-950);
  --text-secondary: var(--color-ink-600);
  --text-muted: var(--color-ink-500);
  --text-inverse: var(--color-bone-soft);
  --text-accent: var(--color-lime-800);
}

/* Dark / editorial surfaces */
.theme-dark {
  --surface-page: var(--color-ink-950);
  --surface-elevated: var(--color-ink-900);
  --surface-sunken: #050505;
  --surface-contrast: var(--color-bone-soft);

  --border-subtle: #242424;
  --border-default: #333;
  --border-strong: #555;

  --text-primary: var(--color-bone-soft);
  --text-secondary: var(--color-ink-300);
  --text-muted: var(--color-ink-400);
  --text-inverse: var(--color-ink-950);
  --text-accent: var(--color-lime-400);
}
