        /* ========================================
           CSS VARIABLES - TEMA CHIARO (default)
           ======================================== */
        :root {
            /* Colori principali */
            --bg-primary: #fafafa;
            --bg-secondary: #ffffff;
            --bg-gradient-start: #e8f5e9;
            --bg-gradient-mid: #c8e6c9;
            --bg-gradient-end: #a5d6a7;
            
            /* Testo */
            --text-primary: #212121;
            --text-secondary: #555555;       /* WCAG AA 4.6:1 su #fafafa */
            --text-inverse: #ffffff;
            
            /* Accenti - Default (verde, si aggiornano con portale) */
            --accent-primary: #2e7d32;
            --accent-secondary: #388e3c;
            --accent-tertiary: #43a047;
            --accent-light: #66bb6a;
            
            /* Colori portali - Default (NL verde) */
            --portal-primary: #2e7d32;
            --portal-secondary: #388e3c;
            --portal-tertiary: #43a047;

            /* Stagione - blu per badge/bottoni filtro stagione */
            --season-accent: #1565c0;
            --season-accent-hover: #0d47a1;

            /* Storico - accenti per tipo */
            --storico-pos-accent: #f57c00;
            --storico-pareggi-accent: #7b1fa2;
            --storico-cf-header: #bf360c;

            /* UI Elements */
            --border-color: #e0e0e0;
            --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
            --hover-bg: rgba(0, 0, 0, 0.04);
            --bg-tertiary: #f5f5f5;
            --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.1);
            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.15);
            
            /* Tabelle */
            --table-row-even: #f1f8f4;
            --table-row-odd: #ffffff;
            --table-hover: #e8f5e9;
            --table-header-bg: linear-gradient(135deg, var(--portal-primary) 0%, var(--portal-secondary) 100%);
            
            /* Color Coding - Light Mode */
            --color-mastercard: #c5e1a5;
            --color-visa: #b3e5fc;
            --color-bonifico: #fff9c4;
            --color-contanti: #d7ccc8;
            --color-pos: #b2dfdb;
            --color-carta: #c5cae9;
            --color-bancomat: #dcedc8;
            --color-voucher: #e1bee7;
            --color-caparra: #f0f4c3;
            --color-bonus: #d1c4e9;
            --color-estate: #fff9c4;
            --color-inverno: #bbdefb;
            --color-hotel-nl: #c8e6c9;
            --color-hotel-hp: #e1bee7;
            --color-hotel-she: #ffe0b2;
            --color-sig-sergio-done: #ffe0b2;
            --color-totale-bg: #e3f2fd;
            --color-totale-text: #000000;
            --color-error: #ffebee;
            --color-error-text: #c62828;
            --color-selected: #fff176;
            --color-selected-border: #fbc02d;
            --color-nav-highlight: #80cbc4;
            --color-nav-highlight-border: #00897b;
            --color-editable-hover: #fff3cd;
            
            /* Stati (Bootstrap-style alert colors) */
            --status-success-bg: #d4edda;
            --status-success-text: #155724;
            --status-error-bg: #f8d7da;
            --status-error-text: #721c24;
            --status-error-border: #f5c6cb;
            --status-warning-bg: #fff3cd;
            --status-warning-text: #856404;
            --status-warning-border: #ffc107;
            --status-secondary-bg: #e2e3e5;
            --status-secondary-text: #383d41;
            --status-secondary-border: #d6d8db;
            --status-loading-bg: #d1ecf1;
            --status-loading-text: #0c5460;

            /* FASE J: Annullamento caparre */
            --annullata-badge-bg: #ef5350;
            --annullata-badge-text: #ffffff;
            --restituzione-badge-bg: #5c6bc0;
            --restituzione-badge-text: #ffffff;
            --annullata-row-opacity: 0.5;
            --annullamenti-panel-bg: #fff8e1;
            --annullamenti-panel-border: #ffe082;
            --annullamenti-card-bg: #ffffff;
            --annullamenti-confirm-bg: #43a047;
            --annullamenti-confirm-hover: #2e7d32;

            /* Colori semantici - warning/danger/info (STRUCT-005) */
            --color-warning: #ff9800;
            --color-warning-dark: #e65100;
            --color-warning-light: rgba(255, 152, 0, 0.1);
            --color-warning-medium: rgba(255, 152, 0, 0.15);
            --color-danger: #f44336;
            --color-danger-dark: #c62828;
            --color-success: #4caf50;
            --color-success-dark: #2e7d32;
            --color-success-light: rgba(76, 175, 80, 0.1);
            --color-success-medium: rgba(76, 175, 80, 0.2);
            --color-success-border: rgba(76, 175, 80, 0.3);
            --color-disabled: #999;
            --color-disabled-light: #ccc;
            --color-tipo-fe: #9c27b0;       /* Viola per GIR tipo FE (non FEST) */

            /* JI-P2-02: Border radius design tokens */
            --radius-sm: 4px;       /* badge, input piccoli, chip */
            --radius-md: 8px;       /* bottoni, input, card piccole */
            --radius-lg: 12px;      /* card, pannelli, dropdown */
            --radius-xl: 20px;      /* container principale */
            --radius-pill: 50px;    /* bottoni pill, avatar */

            /* SPRING-019: Matching manuale */
            --suggested-badge-bg: #fff3e0;
            --suggested-badge-text: #e65100;
            --suggested-badge-border: #ffcc80;
            --partial-btn-bg: #f57c00;
            --partial-btn-hover: #e65100;
            --inline-panel-bg: #f8f9fa;
            --inline-panel-border: #dee2e6;
            --search-result-hover: #e8f5e9;
            --search-result-selected: #c8e6c9;
        }

        /* ========================================
           CSS VARIABLES - TEMA SCURO (Budget Dashboard Style)
           Ispirato alle immagini: Nero + Lime Neon
           ======================================== */
        [data-theme="dark"] {
            /* Colori principali - VERDE MONOCROMATICO */
            --bg-primary: #1a2a1a;          /* Verde-grigio scuro esterno */
            --bg-secondary: #2a3a2a;        /* Verde-grigio medio - cards/tabella */
            --bg-gradient-start: #1a2a1a;
            --bg-gradient-mid: #202820;
            --bg-gradient-end: #2a3a2a;
            
            /* Testo - Tonalità verde */
            --text-primary: #b8d4b8;        /* Verde chiaro - leggibile */
            --text-secondary: #a0b8a0;      /* WCAG AA 5.1:1 su #1a2a1a */
            --text-inverse: #0a1a0a;        /* Verde scurissimo per testo su verde chiaro */
            
            /* Accenti - VERDE NATURALE (come immagini) */
            --accent-primary: #4CAF50;      /* Verde medio naturale */
            --accent-secondary: #5cb85c;    /* Verde chiaro */
            --accent-tertiary: #66bb6a;     /* Verde chiaro hover */
            --accent-light: #3d8b40;        /* Verde scuro */
            
            /* UI Elements */
            --border-color: #b8d4b8;        /* Verde chiaro (stesso header) */
            --hover-bg: rgba(255, 255, 255, 0.06); /* Hover leggero su sfondo scuro */
            --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.5);
            --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.6);
            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.8);
            
            /* Tabelle - Verde monocromatico */
            --table-row-even: #2d402d;      /* Verde-grigio medio */
            --table-row-odd: #2a3a2a;       /* Verde-grigio base */
            --table-hover: #344a34;         /* Verde più chiaro hover */
            --table-header-bg: #4CAF50;     /* Verde medio come INCOME! */
            
            /* Color Coding - Tonalità verdi differenziate */
            --color-mastercard: #3a4a35;    /* Verde oliva medio */
            --color-visa: #354045;          /* Verde-blu scuro */
            --color-bonifico: #4a4a35;      /* Verde-giallo scuro */
            --color-contanti: #3d3a38;      /* Marrone neutro */
            --color-pos: #2d4040;           /* Verde-azzurro scuro */
            --color-carta: #353545;         /* Indaco scuro */
            --color-bancomat: #3d4535;      /* Verde oliva chiaro */
            --color-voucher: #40354a;       /* Viola scuro */
            --color-caparra: #454535;       /* Giallo-verde scuro */
            --color-bonus: #3d354a;         /* Lilla scuro */
            --color-estate: #4a4a35;        /* Verde-giallo scuro */
            --color-inverno: #354045;       /* Verde-azzurro scuro */
            --color-hotel-nl: #3d5040;      /* Verde foresta */
            --color-hotel-hp: #404040;      /* Verde-grigio neutro */
            --color-hotel-she: #4a4035;     /* Verde-marrone */
            --color-sig-sergio-done: #4a4035; /* Verde-marrone completato */
            --color-totale-bg: #3d5545;     /* Verde-blu medio */
            --color-totale-text: #88dd88;   /* Verde chiaro */
            --color-error: #4a3535;         /* Verde-rosso scuro */
            --color-error-text: #dd8888;    /* Rosso-rosa chiaro */
            --color-selected: #4a5a35;      /* Verde-giallo selezione */
            --color-selected-border: #66bb6a; /* Verde chiaro bordo */
            --color-nav-highlight: #2d4a4a;   /* Teal scuro navigazione */
            --color-nav-highlight-border: #4db6ac; /* Teal bordo navigazione */
            --color-editable-hover: #344434; /* Verde scuro hover */
            
            /* Stati (Bootstrap-style alert colors) */
            --status-success-bg: #2a4a2a;
            --status-success-text: #88dd88;
            --status-error-bg: #4a2a2a;
            --status-error-text: #dd8888;
            --status-error-border: #663333;
            --status-warning-bg: #4a3a1a;
            --status-warning-text: #ddbb55;
            --status-warning-border: #886600;
            --status-secondary-bg: #3a3a3a;
            --status-secondary-text: #aaaaaa;
            --status-secondary-border: #555555;
            --status-loading-bg: #2a3a4a;
            --status-loading-text: #88ccdd;

            /* FASE J: Annullamento caparre - Dark Mode */
            --annullamenti-panel-bg: #2a3a2a;
            --annullamenti-panel-border: #4a5a3a;
            --annullamenti-card-bg: #2a3a2a;
            --annullamenti-confirm-bg: #388e3c;
            --annullamenti-confirm-hover: #2e7d32;
            --annullata-row-opacity: 0.45;

            /* SPRING-019: Matching manuale - Dark Mode */
            --bg-tertiary: #3a4a3a;
            --suggested-badge-bg: #3a2a1a;
            --suggested-badge-text: #ffb74d;
            --suggested-badge-border: #5a4a2a;
            --partial-btn-bg: #e65100;
            --partial-btn-hover: #bf360c;
            --inline-panel-bg: #2a3a2a;
            --inline-panel-border: #4a5a3a;
            --search-result-hover: #344a34;
            --search-result-selected: #3d5540;
        }
