/* ==========================================================================
   ATLAS — standard.css  (tema di default)
   Percorso: frontend/public/themes/standard.css

   Restyling UI-1 (26 Marzo 2026): allineamento allo stile editoriale FOLIO.
   Palette greige calda, tipografia mista serif/sans, accenti ocra.

   COME FUNZIONA:
   Sovrascrive SOLO le CSS custom properties definite in globals.css.
   Non contiene regole sui componenti — quelle stanno tutte in globals.css.
   Un tenant personalizza SOLO questo file: cambia i valori delle variabili,
   il look dell'intera app cambia senza toccare una riga di codice React.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Font import
   - Cormorant Garamond: serif elegante per titoli (atlas-heading-*)
   - DM Sans 300/400/500: sans leggero per body, label, UI
   -------------------------------------------------------------------------- */

:root {
  /* --- Identità tenant --- */
  --tenant-name:            'ATLAS';
  --tenant-logo-url:        none;

  /* --- Palette primaria ---
       Blu navy sostituito con antracite caldo.
       Mantiene autorevolezza senza freddezza corporate.
  --- */
  --color-primary:          #2c2c2a;   /* antracite caldo — bottoni, link, accenti */
  --color-primary-hover:    #1a1a18;   /* scurito per hover */
  --color-primary-light:    #f0ede8;   /* greige chiarissimo per sfondi/badge */
  --color-primary-text:     #ffffff;

  /* --- Palette secondaria ---
       Ocra/ambra calda — usata per accenti, warning, progress.
       Stessa tonalità dell'arancione FOLIO.
  --- */
  --color-secondary:        #b07d3a;   /* ocra calda */
  --color-secondary-hover:  #8f6428;
  --color-secondary-light:  #faf3e6;
  --color-secondary-text:   #ffffff;

  /* --- Superfici ---
       Sfondo greige caldo invece di grigio freddo.
       Le card restano bianche ma con un bianco leggermente caldo.
  --- */
  --color-bg:               #f5f3ef;   /* greige FOLIO */
  --color-surface:          #fdfcfa;   /* bianco caldo — card, modal, pannelli */
  --color-surface-hover:    #f5f3ef;   /* hover → torna al greige */
  --color-border:           #e8e4dc;   /* bordo caldo, quasi invisibile */
  --color-border-focus:     #2c2c2a;   /* focus → antracite */

  /* --- Testo ---
       Antracite caldo invece di slate freddo.
       Il secondario è più chiaro per creare gerarchia editoriale.
  --- */
  --color-text-primary:     #2c2c2a;   /* antracite caldo */
  --color-text-secondary:   #8a8780;   /* grigio caldo medio */
  --color-text-disabled:    #b8b5ae;   /* grigio caldo chiaro */

  /* --- Tipografia ---
       Cormorant Garamond per i titoli: elegante, editoriale.
       DM Sans 300/400 per il corpo: leggero, aerato.
  --- */
  --font-sans:              'DM Sans', system-ui, sans-serif;
  --font-heading:           'Cormorant Garamond', Georgia, serif;
  --font-mono:              'DM Mono', 'Courier New', monospace;

  /* Font weight più leggeri per l'estetica editoriale */
  --font-light:             300;
  --font-regular:           400;
  --font-medium:            500;
  --font-semibold:          500;   /* Cormorant a 500 è già ben definito — non serve 600 */
  --font-bold:              600;

  /* --- Border radius ---
       Ridotto rispetto al default: meno "SaaS", più editoriale.
  --- */
  --radius-sm:   2px;    /* badge, tag — quasi piatto */
  --radius-md:   4px;    /* input, bottoni */
  --radius-lg:   6px;    /* card */
  --radius-xl:   8px;    /* modal */
  --radius-full: 9999px;

  /* --- Ombre ---
       Molto più sottili — quasi impercettibili.
       L'eleganza editoriale non ha ombre pronunciate.
  --- */
  --shadow-sm:  0 1px 3px 0 rgb(0 0 0 / 0.04);
  --shadow-md:  0 2px 8px -1px rgb(0 0 0 / 0.07), 0 1px 3px -1px rgb(0 0 0 / 0.04);
  --shadow-lg:  0 6px 16px -4px rgb(0 0 0 / 0.09), 0 2px 6px -2px rgb(0 0 0 / 0.05);
  --shadow-xl:  0 16px 32px -6px rgb(0 0 0 / 0.10), 0 4px 10px -4px rgb(0 0 0 / 0.05);

  /* --- Spaziature ---
       Leggermente più generose per dare respiro editoriale.
  --- */
  --space-6:   1.75rem;   /* 28px — era 1.5rem (24px) */
  --space-8:   2.25rem;   /* 36px — era 2rem (32px) */

  /* --- Colori di stato ---
       Mantenuti semanticamente corretti ma con tonalità più calde.
  --- */
  --color-success:          #3a6b4f;
  --color-success-light:    #eaf3ed;
  --color-success-text:     #2a5039;

  --color-warning:          #b07d3a;   /* = secondary — coerenza ocra */
  --color-warning-light:    #faf3e6;
  --color-warning-text:     #7a5520;

  --color-danger:           #b03a3a;
  --color-danger-light:     #faecec;
  --color-danger-text:      #7a2020;

  --color-info:             #3a5f8a;
  --color-info-light:       #eaf0f8;
  --color-info-text:        #2a4a6a;
}

/* ==========================================================================
   ESEMPIO — Come appare un file tema cliente (cliente1.css)
   ==========================================================================

:root {
  --tenant-name:            'Studio Rossi Architettura';
  --tenant-logo-url:        url('/themes/studiorossi-logo.svg');

  --color-primary:          #8B2635;   <- rosso terracotta dello studio
  --color-primary-hover:    #6d1e29;
  --color-primary-light:    #fdf0f1;
  --color-primary-text:     #ffffff;

  --color-secondary:        #c8a96e;   <- oro
  --color-secondary-hover:  #b8955a;
  --color-secondary-light:  #fdf8ee;
  --color-secondary-text:   #ffffff;

  --color-bg:               #fafaf8;
  --font-heading:           'Playfair Display', serif;
}

  Solo 12 righe per trasformare completamente l'identità visiva dell'app.
   ========================================================================== */