/* ============================================================
   ECD Design Tokens
   Single source of truth per colori, ombre, raggi e tipografia
   del CRM. Estratti dal linguaggio visivo maturo di Guacamole
   (--gg-*) e allineati allo sfondo brand di pattern.php.

   Solo variabili: NESSUN selettore che stili elementi, quindi
   includere questo file e' a impatto zero finche' non si usano
   le classi .ecd-* (vedi ecd-ui.css).

   Namespace --ecd-* condiviso con card-sidebar.css (che definisce
   i token di layout --ecd-sidebar-*). Nessuna collisione: qui i
   nomi sono semantici (--ecd-primary, --ecd-card, ...).
   ============================================================ */

:root {
    /* --- Layer sfondo / brand (allineato a pattern.php) --- */
    --ecd-brand-start: #00CBA3;
    --ecd-brand-end: #0A3D62;
    --ecd-brand-gradient: linear-gradient(135deg, #00CBA3 0%, #0A3D62 100%);

    /* --- Layer accento UI (da Guacamole) --- */
    --ecd-primary: #017181;
    --ecd-primary-dark: #015a66;
    --ecd-primary-light: #00a0b0;
    --ecd-primary-gradient: linear-gradient(135deg, #017181 0%, #00a0b0 100%);
    --ecd-primary-soft: rgba(1, 113, 129, 0.10);
    --ecd-primary-ring: rgba(1, 113, 129, 0.25);

    /* --- Testo --- */
    --ecd-text: #232846;
    --ecd-muted: #6c757d;

    /* --- Superfici (glass) --- */
    --ecd-card: rgba(255, 255, 255, 0.92);
    --ecd-card-solid: #f4fafb;
    --ecd-card-border: rgba(255, 255, 255, 0.65);
    --ecd-blur: 10px;

    /* --- Elevazione --- */
    --ecd-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    --ecd-shadow-hover: 0 16px 36px rgba(0, 0, 0, 0.16);

    /* --- Forma --- */
    --ecd-radius: 16px;
    --ecd-radius-sm: 12px;
    --ecd-radius-pill: 20px;
    --ecd-gutter: 24px;

    /* --- Colori semantici --- */
    --ecd-success: #10b981;
    --ecd-success-bg: #d1fae5;
    --ecd-warning: #d97706;
    --ecd-warning-bg: rgba(217, 119, 6, 0.12);
    --ecd-danger: #dc2626;
    --ecd-danger-bg: rgba(220, 38, 38, 0.12);
    --ecd-info: #6d28d9;
    --ecd-info-bg: #ede9fe;
    --ecd-wait-bg: #e2e8f0;
    --ecd-wait-fg: #475569;

    /* --- Tipografia --- */
    --ecd-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ecd-font-num: 'Plus Jakarta Sans', var(--ecd-font);

    /* --- Z-index (sopra la sidebar di navigazione, z 1040) --- */
    --ecd-z-modal: 1200;
    --ecd-z-toast: 1300;

    /* ------------------------------------------------------------
       Alias token legacy consumati da card-sidebar.css.
       Valori identici a css/dark-mode.css: quando entrambi i file
       sono presenti non c'e' conflitto (stesso valore a parita' di
       specificita'); quando dark-mode.css manca (pagine solo
       pattern.php) la sidebar resta comunque alimentata.
       Mantenere in sync con css/dark-mode.css.
       ------------------------------------------------------------ */
    --primary-color: var(--ecd-primary);
    --primary-light: var(--ecd-primary-soft);
    --primary-medium: rgba(1, 113, 129, 0.3);
    --primary-dark: #016b75;
    --accent-color: #ff9800;
    --text-dark: #333;
    --text-medium: var(--ecd-muted);
    --bg-glass: rgba(255, 255, 255, 0.45);
    --border-light: rgba(255, 255, 255, 0.4);
    --shadow-color: rgba(0, 0, 0, 0.1);
    --transition-speed: 0.3s;
}

/* ============================================================
   Dark mode
   I token accento (--ecd-primary*) restano invariati, come in
   Guacamole: cambiano solo superfici, testo e ombre.
   ============================================================ */
body.dark-mode {
    --ecd-text: #E8EAED;
    --ecd-muted: #BDC1C6;

    --ecd-card: rgba(32, 33, 36, 0.88);
    --ecd-card-solid: #24262a;
    --ecd-card-border: rgba(255, 255, 255, 0.08);

    --ecd-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
    --ecd-shadow-hover: 0 16px 36px rgba(0, 0, 0, 0.45);

    --ecd-success-bg: rgba(16, 185, 129, 0.18);
    --ecd-warning: #fcd34d;
    --ecd-warning-bg: rgba(245, 158, 11, 0.18);
    --ecd-danger: #fca5a5;
    --ecd-danger-bg: rgba(239, 68, 68, 0.18);
    --ecd-info: #c4b5fd;
    --ecd-info-bg: rgba(139, 92, 246, 0.18);
    --ecd-wait-bg: rgba(148, 163, 184, 0.2);
    --ecd-wait-fg: #CBD5E1;

    /* Alias legacy (mirror di css/dark-mode.css body.dark-mode) */
    --primary-color: #8AB4F8;
    --primary-light: rgba(138, 180, 248, 0.15);
    --primary-medium: rgba(138, 180, 248, 0.3);
    --primary-dark: #6698E8;
    --accent-color: #F8B195;
    --text-dark: #E8EAED;
    --text-medium: #BDC1C6;
    --bg-glass: rgba(32, 33, 36, 0.85);
    --border-light: rgba(100, 100, 100, 0.4);
    --shadow-color: rgba(0, 0, 0, 0.5);
}

/* --- Densita' responsive del gutter --- */
@media (max-width: 1024px) {
    :root { --ecd-gutter: 18px; }
}
@media (max-width: 767px) {
    :root { --ecd-gutter: 14px; }
}