:root {

       /* Aggiungi in :root */
   --gradient-app: #595082;
   --gradient-app-start: #667eea;
   --gradient-app-end: #764ba2;
   --gradient-app-palette: #595082;
   --gradient-success-btn: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
   --gradient-danger-btn: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
   --gradient-cyan-btn: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%);
   --gradient-purple-btn: linear-gradient(135deg, #8e2de2 0%, #4a00e0 100%);
   --gradient-pink-btn: linear-gradient(135deg, #ff758c 0%, #ff7eb3 100%);
   --gradient-peach-btn: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
   --gradient-blue-btn: linear-gradient(135deg, #396afc 0%, #2948ff 100%);
   --gradient-quartary-btn: linear-gradient(135deg, #2a9cdf 0%, #0a0ddb 100%);
   --gradient-quintary-btn: linear-gradient(135deg, #4b0afd 0%, #632bff 100%);
   --gradient-sestiary-btn: linear-gradient(135deg, #fdb051 0%, #fdd937 100%);
   --gradient-septiary-btn: linear-gradient(135deg, #464d53 0%, #8b8b8b 100%);
   --gradient-management-btn: linear-gradient(135deg, #a855f7 0%, #c084fc 100%);
   --gradient-dark-btn: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
   --gradient-summary: linear-gradient(to right, #f3f4f6, #f9fafb);
   --gradient-score-total: linear-gradient(to bottom, #ffffff, #f0fdf4);
   --bg-surface-translucent: rgba(255, 255, 255, 0.95);
    /* =========================================
       TESTI
       ========================================= */
    --text-primary: #595082;
    --text-secondary: #666666;
    --text-muted: #999999;
    --text-hint: #aaaaaa;
    --text-disabled: #bbbbbb;
    --text-inverse: #ffffff;
    --text-heading: #1a202c;
    --text-link: #1976d2;
    --text-link-hover: #1565c0;
    --text-stable-white: #ffffff;
    --text-gray: #444444;
    --text-stable-light-gray: #b9b8b8;
    --text-placeholder:#606060;;
    

    /* =========================================
       SFONDI PAGINA / LAYOUT
       ========================================= */
    --bg-body: #f5f5f5;
    --bg-surface: #ffffff;
    --bg-surface-raised: #f8f9fa;
    --bg-surface-card: #ffffff;      /* card */
    --bg-surface-sunken: #f0f0f0;
    --bg-surface-alt: #f7f7f7;
    --bg-sidebar: #2c3e50;
    --bg-sidebar-hover: #34495e;
    --bg-sidebar-active: #1a202c;
    --bg-navbar: #ffffff;
    --bg-input: #ffffff;
    --bg-input-disabled: #e9ecef;
    --bg-light-blue-stable: linear-gradient(180deg,#eef2ff,#f5f7ff);

    /* =========================================
       SFONDI HOVER / ACTIVE / SELECTED
       ========================================= */
    --bg-hover: rgba(0, 0, 0, 0.05);
    --bg-hover-medium: rgba(0, 0, 0, 0.08);
    --bg-active: rgba(0, 0, 0, 0.1);
    --bg-selected: rgba(0, 0, 0, 0.12);
    --bg-hover-inverse: rgba(255, 255, 255, 0.1);
    --bg-active-inverse: rgba(255, 255, 255, 0.2);

    /* =========================================
       OVERLAY / BACKDROP
       ========================================= */
    --overlay-lightest: rgba(0, 0, 0, 0.02);
    --overlay-light: rgba(0, 0, 0, 0.06);
    --overlay-medium: rgba(0, 0, 0, 0.25);
    --overlay-heavy: rgba(0, 0, 0, 0.5);
    --overlay-darker: rgba(0, 0, 0, 0.7);
    --overlay-darkest: rgba(0, 0, 0, 0.9);

    /* =========================================
       BORDI
       ========================================= */
    --border-lightest: #f0f0f0;
    --border-light: #eeeeee;
    --border-medium: #dddddd;
     --border-inverse: #dddddd;
    --border-strong: #cccccc;
    --border-dark: #aaaaaa;
    --border-input: #ced4da;
    --border-input-focus: #80bdff;
    --border-inverse: rgba(0, 0, 0, 0.3);

    /* =========================================
       OMBRE
       ========================================= */
    --shadow-sm: rgba(0, 0, 0, 0.08);
    --shadow-md: rgba(0, 0, 0, 0.15);
    --shadow-lg: rgba(0, 0, 0, 0.25);
    --shadow-focus: rgba(0, 123, 255, 0.25);
    --shadow-brand-sm: rgba(102, 126, 234, 0.15);
    --shadow-brand-md: rgba(102, 126, 234, 0.3);
       
    --primary-darkest: #0f172a;
    --primary-darker: #1e40af;
    --primary-dark: #1565c0;
    --primary: #1976d2;
    --primary-light: #3182ce;
    --primary-lighter: #60a5fa;
    --primary-bg: #e3f2fd;
    --primary-bg-light: #f0f8ff;
    --primary-border: #90caf9;
    --primary-hover: #1565c0;
    --primary-active: #1e40af;
    --text-title: #1976d2;

    /* =========================================
       COLORE BRAND / TEAL (il tuo #11998e)
       ========================================= */
    --brand-dark: #0d7a6f;
    --brand: #11998e;
    --brand-light: #16a085;
    --brand-lighter: #38b2ac;
    --brand-bg: #e0f2f1;
    --brand-bg-light: #e8f5f3;
    --brand-bg-hover: rgba(17, 153, 142, 0.1);
    --brand-bg-active: rgba(17, 153, 142, 0.2);
    --brand-border: rgba(17, 153, 142, 0.3);
    --brand-shadow: rgba(17, 153, 142, 0.4);

    /* =========================================
       SUCCESSO (Verde)
       ========================================= */
    --success-darkest: #0f5132;
    --success-dark: #166534;
    --success: #27ae60;
    --success-medium: #4caf50;
    --success-light: #66bb6a;
    --success-lighter: #a5d6a7;
    --success-bg: #d4edda;
    --success-bg-light: #e8f5e9;
    --success-bg-lightest: #f0fff4;
    --success-border: #c3e6c9;
    --success-text: #155724;
    --success-hover: rgba(76, 175, 80, 0.15);
    --success-active: rgba(76, 175, 80, 0.3);

    /* =========================================
       PERICOLO (Rosso)
       ========================================= */
    --danger-darkest: #721c24;
    --danger-dark: #c62828;
    --danger: #e74c3c;
    --danger-medium: #ef4444;
    --danger-light: #ef9a9a;
    --danger-lighter: #fca5a5;
    --danger-bg: #f8d7da;
    --danger-bg-light: #fee2e2;
    --danger-bg-lightest: #fff5f5;
    --danger-border: #f5c6cb;
    --danger-text: #721c24;
    --danger-hover: rgba(231, 76, 60, 0.1);
    --danger-active: rgba(231, 76, 60, 0.2);

    /* =========================================
       AVVISO (Arancione/Giallo)
       ========================================= */
    --warning-darkest: #78350f;
    --warning-dark: #92400e;
    --warning: #f59e0b;
    --warning-medium: #ffc107;
    --warning-light: #fbd38d;
    --warning-bg: #fff3cd;
    --warning-pdf: #fff3cd;
    --warning-bg-light: #fff8e1;
    --warning-bg-lightest: #fffbeb;
    --warning-border: #ffeaa7;
    --warning-text: #856404;
    --warning-hover: rgba(243, 156, 18, 0.2);

    /* =========================================
       INFO (Ciano/Azzurro chiaro)
       ========================================= */
    --info-dark: #0c5460;
    --info: #17a2b8;
    --info-light: #45b7d1;
    --info-bg: #d1ecf1;
    --info-bg-light: #e0f7ff;
    --info-bg-lightest: #ecfeff;
    --info-border: #bee5eb;
    --info-text: #0c5460;

   /* =========================================
       BRN ALTERNATIVE AND DELETE AND ACTIONS
       ========================================= */
      --alt-btn: linear-gradient(135deg, rgba(0, 198, 255, 0.4) 0%, rgba(0, 114, 255, 0.4) 100%);
    --delete-btn-bg: rgba(239, 68, 68, 0.65);
    --delete-btn-boder: rgba(239, 68, 68, 0.6);

    /* Action Principale - Viola deciso */
    --action-btn-bg: rgba(118, 75, 162, 0.65);
    --action-btn-border: rgba(118, 75, 162, 0.6);

    /* Success (Verde) */
    --success-btn-soft-bg: rgba(22, 160, 133, 0.65);
    --success-btn-soft-border: rgba(22, 160, 133, 0.6);
    
    /* Peach (Arancione) - Ora molto più visibile */
    --peach-btn-soft-bg: rgba(253, 176, 81, 0.65);
    --peach-btn-soft-border: rgba(217, 119, 6, 0.6);
    
    /* Blue */
    --blue-btn-soft-bg: rgba(37, 99, 235, 0.65);
    --blue-btn-soft-border: rgba(37, 99, 235, 0.6);
    
    /* Cyan */
    --cyan-btn-soft-bg: rgba(2, 132, 199, 0.65);
    --cyan-btn-soft-border: rgba(2, 132, 199, 0.6);
    
    /* Purple */
    --purple-btn-soft-bg: rgba(142, 45, 226, 0.65);
    --purple-btn-soft-border: rgba(142, 45, 226, 0.6);
    
    /* Pink */
    --pink-btn-soft-bg: rgba(219, 39, 119, 0.65);
    --pink-btn-soft-border: rgba(219, 39, 119, 0.6);
    
    /* Altri */
    --quartary-btn-soft-bg: rgba(30, 64, 175, 0.65);
    --quartary-btn-soft-border: rgba(30, 64, 175, 0.6);
    
    --quintary-btn-soft-bg: rgba(124, 58, 237, 0.65);
    --quintary-btn-soft-border: rgba(124, 58, 237, 0.6);
    
    --sestiary-btn-soft-bg: rgba(180, 83, 9, 0.65);
    --sestiary-btn-soft-border: rgba(180, 83, 9, 0.6);
    
    --septiary-btn-soft-bg: rgba(71, 85, 105, 0.65);
    --septiary-btn-soft-border: rgba(71, 85, 105, 0.6);
    
    --management-btn-soft-bg: rgba(168, 85, 247, 0.65);
    --management-btn-soft-border: rgba(168, 85, 247, 0.6);

    /* =========================================
       VIOLA (Accento secondario)
       ========================================= */
    --violet-dark: #6a3f91;
    --violet: #764ba2;
    --violet-medium: #8e44ad;
    --violet-light: #bb8fce;
    --violet-bg: #f3e5f5;
    --violet-bg-light: #f5ebff;
    --violet-border: #e9d5ff;
    --violet-hover: rgba(118, 75, 162, 0.1);

    /* =========================================
       ROSA/MAGENTA (Accento)
       ========================================= */
    --pink-dark: #c2185b;
    --pink: #d53f8c;
    --pink-light: #ff7eb3;
    --pink-bg: #fce4ec;
    --pink-bg-light: #fff0f5;

    /* =========================================
       BLU SCURO (Header, sidebar, card scure)
       ========================================= */
    --navy-darkest: #0f172a;
    --navy-dark: #111827;
    --navy: #1f2937;
    --navy-medium: #2d3748;
    --navy-light: #374151;
    --navy-lighter: #475569;

    /* =========================================
       GRIGI FUNZIONALI (Bootstrap-like)
       ========================================= */
   --gray-100: hsl(60, 3%, 14%);
   --gray-200: hsl(60, 3%, 17%);
   --gray-300: hsl(60, 3%, 20%);
   --gray-400: hsl(60, 3%, 25%);
   --gray-500: hsl(60, 3%, 30%);
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #333333;
    --gray-900: #212529;

    /* =========================================
       GRADIENTE (se usati)
       ========================================= */
    --gradient-brand-start: #11998e;
    --gradient-brand-end: #38ef7d;
    --gradient-primary-start: #396afc;
    --gradient-primary-end: #2948ff;

    /* =========================================
       TABLE / LISTE
       ========================================= */
    --table-header-bg: hsl(60, 3%, 17%);
   --table-row-alt: hsl(60, 3%, 15.5%);
   --table-border: hsl(60, 3%, 20%);
   --table-row-hover: rgba(0, 0, 0, 0.05);

    /* =========================================
       MODAL / CARD
       ========================================= */
    --card-bg: #ffffff;
    --card-border: #e0e0e0;
    --card-shadow: rgba(0, 0, 0, 0.1);
    --modal-backdrop: rgba(0, 0, 0, 0.5);

    /* =========================================
       BADGE / TAG
       ========================================= */
    --badge-default-bg: #6c757d;
    --badge-default-text: #ffffff;

    /* =========================================
       SCROLLBAR
       ========================================= */
   --scrollbar-track: hsl(60, 3%, 14%);
   --scrollbar-thumb: hsl(60, 3%, 25%);
   --scrollbar-thumb-hover: hsl(60, 3%, 30%);

      /* Badge tipo dieta */
--badge-chetogenica: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
--badge-chetogenica-text: var(--text-primary);
--badge-vegetariana: linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%);
--badge-vegetariana-text: var(--text-primary);
--badge-vegana: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
--badge-vegana-text: var(--text-primary);
--badge-intermittente: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
--badge-intermittente-text: var(--text-inverse);
--badge-mediterranea: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
--badge-mediterranea-text: var(--text-primary);
--badge-lowcarb: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);
--badge-lowcarb-text: var(--text-primary);
/* Badge tipo dieta — tutti */
--badge-normale: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
--badge-normale-text: #fff;
--badge-macro: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
--badge-macro-text: #fff;
--badge-paleo: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
--badge-paleo-text: var(--text-primary);
--badge-altro: linear-gradient(135deg, #e0e0e0 0%, #bdbdbd 100%);
--badge-altro-text: #666;
--badge-medical: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
--badge-medical-text: #c62828;
--badge-medical-border: #ef5350;
--badge-medical-hover: linear-gradient(135deg, #ffcdd2 0%, #ef9a9a 100%);
--badge-medical-shadow: rgba(198, 40, 40, 0.2);
--badge-lifestyle: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
--badge-lifestyle-text: #2e7d32;
--badge-lifestyle-border: #66bb6a;
--badge-lifestyle-hover: linear-gradient(135deg, #c8e6c9 0%, #a5d6a7 100%);
--badge-lifestyle-shadow: rgba(46, 125, 50, 0.2);
/* Badge stato dieta */
--status-attiva-bg: #d4edda;
--status-attiva-text: #155724;
--status-completata-bg: #cce5ff;
--status-completata-text: #004085;
--status-sospesa-bg: #fff3cd;
--status-sospesa-text: #856404;
--status-annullata-bg: #f8d7da;
--status-annullata-text: #721c24;

/* =============================================
   CUSTOM ANALISI
   ============================================= */


--analysis-few-bg: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
--analysis-some-bg: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%);
--analysis-many-bg: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
--analysis-full-bg: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%);
--analysis-default-bg: linear-gradient(135deg, #8e44ad 0%, #9b59b6 100%);
--analysis-text: #ffffff;

/* =============================================
   CUSTOM CARD
   ============================================= */

--add-plica-bg: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
--add-plica-bg-hover: linear-gradient(135deg, #c8e6c9 0%, #a5d6a7 100%);
--add-plica-border: #4caf50;
--add-plica-text: #4caf50;
--add-plica-text-hover: #2e7d32;

--add-circ-bg: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
--add-circ-bg-hover: linear-gradient(135deg, #c8e6c9 0%, #a5d6a7 100%);
--add-circ-border: #4caf50;
--add-circ-text: #4caf50;

--add-diam-bg: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
--add-diam-bg-hover: linear-gradient(135deg, #bbdefb 0%, #90caf9 100%);
--add-diam-border: #2196f3;
--add-diam-text: #4e4caf;

   }




/* =============================================
   DARK MODE
   ============================================= */
.dark-mode {
    /* --- Testi --- */
    --text-primary: #f8c662;
    --text-secondary: #d6d6d6;
    --text-muted: #6c757d;
    --text-hint: #555555;
    --text-disabled: #444444;
    --text-inverse: #0a0a18;
    --text-heading: #f0f0f0;
    --text-link: #60a5fa;
    --text-link-hover: #90caf9;
    --text-stable-white: #ffffff;
    --text-stable-white: #ffffff;
    --text-gray: #444444;
    --text-stable-light-gray: #b9b8b8;
    --text-placeholder:#767676;;

    /* --- Sfondi pagina / layout --- */
   --bg-body: hsl(60, 3%, 11%);             /* più scuro, sfondo pagina */
   --bg-surface: hsl(60, 3%, 14%);          /* il tuo colore base */
   --bg-surface-raised: hsl(60, 3%, 17%);   /* elementi sopra */
   --bg-surface-card: hsl(0, 0%, 28%);      /* card */
      --bg-surface-card-light: hsl(0, 0%, 58%);      /* card */
   --bg-surface-sunken: hsl(60, 3%, 9%);    /* elementi incassati */
   --bg-surface-alt: hsl(60, 3%, 15.5%);    /* righe alternate */
    --bg-sidebar: #1a1a2e;
    --bg-sidebar-hover: #16213e;
    --bg-sidebar-active: #0f3460;
   --bg-navbar: hsl(60, 3%, 14%);
   --bg-input: hsl(60, 3%, 17%);
   --bg-input-disabled: hsl(60, 3%, 20%);
   --bg-light-blue-stable: linear-gradient(180deg,#eef2ff,#f5f7ff);

    /* --- Hover / Active --- */
    --bg-hover: rgba(255, 255, 255, 0.06);
    --bg-hover-medium: rgba(255, 255, 255, 0.1);
    --bg-active: rgba(255, 255, 255, 0.14);
    --bg-selected: rgba(255, 255, 255, 0.18);
    --bg-hover-inverse: rgba(0, 0, 0, 0.2);
    --bg-active-inverse: rgba(0, 0, 0, 0.3);

    /* --- Overlay --- */
    --overlay-lightest: rgba(255, 255, 255, 0.02);
    --overlay-light: rgba(255, 255, 255, 0.06);
    --overlay-medium: rgba(0, 0, 0, 0.4);
    --overlay-heavy: rgba(0, 0, 0, 0.6);
    --overlay-darker: rgba(0, 0, 0, 0.8);
    --overlay-darkest: rgba(0, 0, 0, 0.95);

    /* --- Bordi --- */
   --border-lightest: hsl(60, 3%, 17%);
   --border-light: hsl(60, 3%, 20%);
   --border-medium: hsl(60, 3%, 25%);
   --border-inverse: #7e7e7e;
   --border-strong: hsl(60, 3%, 30%);
   --border-dark: hsl(60, 3%, 35%);
   --border-input: hsl(60, 3%, 25%);
    --border-input-focus: #60a5fa;

    /* --- Ombre --- */
    --shadow-sm: rgba(0, 0, 0, 0.3);
    --shadow-md: rgba(0, 0, 0, 0.4);
    --shadow-lg: rgba(0, 0, 0, 0.5);
    --shadow-focus: rgba(96, 165, 250, 0.3);
    --shadow-brand-sm: rgba(109, 129, 233, 0.2);
    --shadow-brand-md: rgba(109, 129, 233, 0.35);
    --primary-darkest: #0a1020;
    --primary-darker: #1e40af;
    --primary-dark: #2563eb;
    --primary: #3b82f6;
    --primary-light: #60a5fa;
    --primary-lighter: #93c5fd;
    --primary-bg: rgba(37, 99, 235, 0.15);
    --primary-bg-light: rgba(37, 99, 235, 0.08);
    --primary-border: rgba(59, 130, 246, 0.3);
    --primary-hover: #2563eb;
    --primary-active: #1d4ed8;
    --text-title: #90caf9;

    /* --- Brand / Teal --- */
    --brand-dark: #059669;
    --brand: #14b8a6;
    --brand-light: #2dd4bf;
    --brand-lighter: #5eead4;
    --brand-bg: rgba(20, 184, 166, 0.12);
    --brand-bg-light: rgba(20, 184, 166, 0.06);
    --brand-bg-hover: rgba(20, 184, 166, 0.15);
    --brand-bg-active: rgba(20, 184, 166, 0.25);
    --brand-border: rgba(20, 184, 166, 0.3);
    --brand-shadow: rgba(20, 184, 166, 0.3);

    /* --- Successo (Verde) --- */
    --success-darkest: #065f46;
    --success-dark: #059669;
    --success: #10b981;
    --success-medium: #34d399;
    --success-light: #6ee7b7;
    --success-lighter: #a7f3d0;
    --success-bg: rgba(16, 185, 129, 0.15);
    --success-bg-light: rgba(16, 185, 129, 0.08);
    --success-bg-lightest: rgba(16, 185, 129, 0.04);
    --success-border: rgba(16, 185, 129, 0.3);
    --success-text: #6ee7b7;
    --success-hover: rgba(16, 185, 129, 0.12);
    --success-active: rgba(16, 185, 129, 0.25);

    /* --- Pericolo (Rosso) --- */
    --danger-darkest: #7f1d1d;
    --danger-dark: #b91c1c;
    --danger: #ef4444;
    --danger-medium: #f87171;
    --danger-light: #fca5a5;
    --danger-lighter: #fecaca;
    --danger-bg: rgba(239, 68, 68, 0.15);
    --danger-bg-light: rgba(239, 68, 68, 0.08);
    --danger-bg-lightest: rgba(239, 68, 68, 0.04);
    --danger-border: rgba(239, 68, 68, 0.3);
    --danger-text: #fca5a5;
    --danger-hover: rgba(239, 68, 68, 0.12);
    --danger-active: rgba(239, 68, 68, 0.25);

    /* --- Avviso (Arancione/Giallo) --- */
    --warning-darkest: #78350f;
    --warning-dark: #b45309;
    --warning: #f59e0b;
    --warning-medium: #fbbf24;
    --warning-light: #fde68a;
    --warning-bg: rgba(245, 158, 11, 0.15);
    --warning-pdf: #fbd38d;
    --warning-bg-light: rgba(245, 158, 11, 0.08);
    --warning-bg-lightest: rgba(245, 158, 11, 0.04);
    --warning-border: rgba(245, 158, 11, 0.3);
    --warning-text: #fde68a;
    --warning-hover: rgba(245, 158, 11, 0.12);

    /* --- Info (Ciano) --- */
    --info-dark: #0e7490;
    --info: #06b6d4;
    --info-light: #22d3ee;
    --info-bg: rgba(6, 182, 212, 0.15);
    --info-bg-light: rgba(6, 182, 212, 0.08);
    --info-bg-lightest: rgba(6, 182, 212, 0.04);
    --info-border: rgba(6, 182, 212, 0.3);
    --info-text: #67e8f9;

       /* =========================================
       BRN ALTERNATIVE AND DELETE AND ACTIONS
       ========================================= */
    --alt-btn: rgba(6, 182, 212, 0.3);
    --delete-btn-bg: rgba(239, 68, 68, 0.3);
    --delete-btn-boder: rgba(239, 68, 68, 0.15);
    --action-btn-bg: rgba(139, 92, 246, 0.15);
    --action-btn-border: rgba(100, 62, 189, 0.5);
    --success-btn-soft-bg: rgba(16, 185, 129, 0.18);
    --success-btn-soft-border: rgba(52, 211, 153, 0.34);
    --peach-btn-soft-bg: rgba(217, 119, 6, 0.18);
    --peach-btn-soft-border: rgba(245, 158, 11, 0.34);
    --blue-btn-soft-bg: rgba(37, 99, 235, 0.18);
    --blue-btn-soft-border: rgba(96, 165, 250, 0.34);
    --cyan-btn-soft-bg: rgba(2, 132, 199, 0.18);
    --cyan-btn-soft-border: rgba(34, 211, 238, 0.32);
    --purple-btn-soft-bg: rgba(67, 56, 202, 0.18);
    --purple-btn-soft-border: rgba(139, 92, 246, 0.34);
    --pink-btn-soft-bg: rgba(219, 39, 119, 0.18);
    --pink-btn-soft-border: rgba(244, 114, 182, 0.34);
    --quartary-btn-soft-bg: rgba(30, 64, 175, 0.18);
    --quartary-btn-soft-border: rgba(56, 189, 248, 0.32);
    --quintary-btn-soft-bg: rgba(124, 58, 237, 0.18);
    --quintary-btn-soft-border: rgba(129, 140, 248, 0.34);
    --sestiary-btn-soft-bg: rgba(180, 83, 9, 0.18);
    --sestiary-btn-soft-border: rgba(251, 191, 36, 0.34);
    --septiary-btn-soft-bg: rgba(71, 85, 105, 0.24);
    --septiary-btn-soft-border: rgba(148, 163, 184, 0.30);
    --management-btn-soft-bg: rgba(168, 85, 247, 0.18);
    --management-btn-soft-border: rgba(192, 132, 252, 0.34);

    /* --- Viola --- */
    --violet-dark: #7c3aed;
    --violet: #8b5cf6;
    --violet-medium: #a78bfa;
    --violet-light: #c4b5fd;
    --violet-bg: rgba(139, 92, 246, 0.15);
    --violet-bg-light: rgba(139, 92, 246, 0.08);
    --violet-border: rgba(139, 92, 246, 0.3);
    --violet-hover: rgba(139, 92, 246, 0.12);

    /* --- Rosa --- */
    --pink-dark: #db2777;
    --pink: #ec4899;
    --pink-light: #f9a8d4;
    --pink-bg: rgba(236, 72, 153, 0.15);
    --pink-bg-light: rgba(236, 72, 153, 0.08);

    /* --- Navy --- */
    --navy-darkest: #020617;
    --navy-dark: #0f172a;
    --navy: #1e293b;
    --navy-medium: #334155;
    --navy-light: #475569;
    --navy-lighter: #64748b;

    /* --- Grigi --- */
   --gray-100: #222236;             /* era #1e1e1e */
   --gray-200: #2a2a40;             /* era #2a2a2a */
   --gray-300: #33334a;             /* era #333333 */
   --gray-400: #44445a;             /* era #444444 */
   --gray-500: #55556a;             /* era #555555 */
    --gray-600: #888888;
    --gray-700: #aaaaaa;
    --gray-800: #cccccc;
    --gray-900: #e0e0e0;

    /* --- Gradienti --- */
    --gradient-brand-start: #14b8a6;
    --gradient-brand-end: #34d399;
    --gradient-primary-start: #3b82f6;
    --gradient-primary-end: #2563eb;

    /* --- Tabelle --- */
    --table-header-bg: #2a2a40;      /* era #2a2a2a */
    --table-row-alt: #252538;        /* era #252525 */
    --table-border: #33334a;         /* era #333333 */
    --table-row-hover: rgba(255, 255, 255, 0.05);


    /* --- Modal / Card --- */
   --card-bg: hsl(60, 3%, 14%);
   --card-border: hsl(60, 3%, 20%);
    --card-shadow: rgba(0, 0, 0, 0.4);
    --modal-backdrop: rgba(0, 0, 0, 0.7);

    /* --- Badge --- */
    --badge-default-bg: #444444;
    --badge-default-text: #e0e0e0;

    /* --- Scrollbar --- */
    --scrollbar-track: #1e1e1e;
    --scrollbar-thumb: #444444;
    --scrollbar-thumb-hover: #555555;

   /* Aggiungi in .dark-mode */
   --gradient-app: #595082;
   --gradient-app-start: #6d81e9;
   --gradient-app-end: #6a3f91;
   --gradient-app-palette: #595082;
   --gradient-success-btn: linear-gradient(135deg, #0d7a6f 0%, #10b981 100%);
   --gradient-danger-btn: linear-gradient(135deg, #dc2626 0%, #ef4444 100%);
   --gradient-cyan-btn: linear-gradient(135deg, #0284c7 0%, #2563eb 100%);
   --gradient-purple-btn: linear-gradient(135deg, #4338ca 0%, #7c3aed 100%);
   --gradient-pink-btn: linear-gradient(135deg, #db2777 0%, #ec4899 100%);
   --gradient-peach-btn: linear-gradient(135deg, #b45309e3 0%, #b28815c9 100%);
   --gradient-blue-btn: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
   --gradient-quartary-btn: linear-gradient(135deg, #0284c7 0%, #1e40af 100%);
   --gradient-quintary-btn: linear-gradient(135deg, #7c3aed 0%, #4338ca 100%);
   --gradient-sestiary-btn: linear-gradient(135deg, #b45309 0%, #d97706 100%);
   --gradient-septiary-btn: linear-gradient(135deg, #374151 0%, #6b7280 100%);
   --gradient-management-btn: linear-gradient(135deg, #a855f7 0%, #c084fc 100%);
   --gradient-dark-btn: linear-gradient(135deg, #1e293b 0%, #334155 100%);
   --gradient-summary: linear-gradient(to right, var(--bg-surface-raised), var(--bg-surface-alt));
   --gradient-score-total: linear-gradient(to bottom, var(--bg-surface), var(--success-bg-lightest));
   --bg-surface-translucent: hsla(60, 3%, 14%, 0.95);

   /* Badge tipo dieta — dark mode: più saturi, meno pastello */
--badge-chetogenica: linear-gradient(135deg, #d4305a 0%, #c9a800 100%);
--badge-chetogenica-text: #fff;
--badge-vegetariana: linear-gradient(135deg, #1a9c5a 0%, #2a8fb0 100%);
--badge-vegetariana-text: #fff;
--badge-vegana: linear-gradient(135deg, #2aaba5 0%, #c47a9a 100%);
--badge-vegana-text: #fff;
--badge-intermittente: linear-gradient(135deg, #1a6fd4 0%, #0098c8 100%);
--badge-intermittente-text: #fff;
--badge-mediterranea: linear-gradient(135deg, #1aaa50 0%, #15a88e 100%);
--badge-mediterranea-text: #fff;
--badge-lowcarb: linear-gradient(135deg, #d4555a 0%, #a84a8a 100%);
--badge-lowcarb-text: #fff;
/* Badge tipo dieta — dark mode: saturi e profondi */
--badge-normale: linear-gradient(135deg, #4a5ab8 0%, #5a3580 100%);
--badge-normale-text: #fff;
--badge-macro: linear-gradient(135deg, #b050c8 0%, #c43050 100%);
--badge-macro-text: #fff;
--badge-paleo: linear-gradient(135deg, #8a5a2a 0%, #a05530 100%);
--badge-paleo-text: #fff;
--badge-altro: linear-gradient(135deg, #4a4a5a 0%, #5a5a6a 100%);
--badge-altro-text: #ccc;
--badge-medical: linear-gradient(135deg, #7a1a1a 0%, #a02020 100%);
--badge-medical-text: #fca5a5;
--badge-medical-border: #b91c1c;
--badge-medical-hover: linear-gradient(135deg, #8a2020 0%, #b02828 100%);
--badge-medical-shadow: rgba(239, 68, 68, 0.3);
--badge-lifestyle: linear-gradient(135deg, #0a4a20 0%, #156030 100%);
--badge-lifestyle-text: #6ee7b7;
--badge-lifestyle-border: #059669;
--badge-lifestyle-hover: linear-gradient(135deg, #156030 0%, #1a7a3a 100%);
--badge-lifestyle-shadow: rgba(16, 185, 129, 0.3);
/* Badge stato dieta — dark mode */
--status-attiva-bg: rgba(16, 185, 129, 0.2);
--status-attiva-text: #6ee7b7;
--status-completata-bg: rgba(59, 130, 246, 0.2);
--status-completata-text: #93c5fd;
--status-sospesa-bg: rgba(245, 158, 11, 0.2);
--status-sospesa-text: #fde68a;
--status-annullata-bg: rgba(239, 68, 68, 0.2);
--status-annullata-text: #fca5a5;

/* =============================================
   CUSTOM ANALISI
   ============================================= */


--analysis-few-bg: rgba(59, 130, 246, 0.12);
--analysis-some-bg: rgba(16, 185, 129, 0.12);
--analysis-many-bg: rgba(245, 158, 11, 0.12);
--analysis-full-bg: rgba(139, 92, 246, 0.12);
--analysis-default-bg: rgba(139, 92, 246, 0.12);
--analysis-text: var(--text-primary);


/* =============================================
   CUSTOM card
   ============================================= */


--add-plica-bg: rgba(16, 185, 129, 0.08);
--add-plica-bg-hover: rgba(16, 185, 129, 0.15);
--add-plica-border: rgba(16, 185, 129, 0.4);
--add-plica-text: var(--success);
--add-plica-text-hover: var(--success-light);

--add-circ-bg: rgba(16, 185, 129, 0.08);
--add-circ-bg-hover: rgba(16, 185, 129, 0.15);
--add-circ-border: rgba(16, 185, 129, 0.4);
--add-circ-text: var(--success);

--add-diam-bg: rgba(59, 130, 246, 0.08);
--add-diam-bg-hover: rgba(59, 130, 246, 0.15);
--add-diam-border: rgba(59, 130, 246, 0.4);
--add-diam-text: var(--primary-light);



}