/* ============================================
   CRM Compro Oro - Design System Variables
   Enterprise Editorial Theme
   ============================================ */

:root {
    /* === Colori Primari === */
    --color-primary: #0f6b88;
    --color-primary-light: #2f93b8;
    --color-primary-dark: #0a5268;
    --color-primary-50: #eef8fb;
    --color-primary-100: #d7ecf3;
    --color-primary-200: #b5dde9;
    --color-primary-600: #0f6b88;
    --color-primary-700: #0a5268;
    --color-primary-900: #082f3c;

    /* === Colori Accent (Gold - Compro Oro) === */
    --color-gold: #b8891c;
    --color-gold-light: #e2be67;
    --color-gold-dark: #8a6714;
    --color-gold-50: #fdf8ec;
    --color-gold-100: #f5e7bc;

    /* === Colori Semantici === */
    --color-success: #0b8a5d;
    --color-success-light: #ecfaf4;
    --color-success-border: #b8ebd2;
    --color-warning: #c07615;
    --color-warning-light: #fef6ea;
    --color-warning-border: #f4d19b;
    --color-danger: #c53a2c;
    --color-danger-light: #fff1ef;
    --color-danger-border: #f4c2bc;
    --color-info: #155eef;
    --color-info-light: #eff4ff;
    --color-info-border: #c7d7fe;

    /* === Grigi Neutri === */
    --color-gray-25: #fcfdff;
    --color-gray-50: #f7f9fc;
    --color-gray-100: #eef2f6;
    --color-gray-200: #dbe3ed;
    --color-gray-300: #c2cedb;
    --color-gray-400: #93a0b3;
    --color-gray-500: #6d7890;
    --color-gray-600: #4d5a70;
    --color-gray-700: #334155;
    --color-gray-800: #162133;
    --color-gray-900: #0f1728;
    --color-gray-950: #070b14;

    /* === Testo === */
    --text-primary: #101828;
    --text-secondary: #3f4d63;
    --text-tertiary: #617186;
    --text-muted: #8693a5;
    --text-inverse: #ffffff;

    /* === Sfondo === */
    --bg-body: #edf2f7;
    --bg-body-alt: #f7fafc;
    --bg-sidebar: #09121f;
    --bg-sidebar-hover: rgba(255, 255, 255, 0.08);
    --bg-sidebar-active: linear-gradient(90deg, rgba(15, 107, 136, 0.3), rgba(15, 107, 136, 0.08));
    --bg-card: rgba(255, 255, 255, 0.88);
    --bg-card-strong: #ffffff;
    --bg-header: rgba(247, 250, 252, 0.78);
    --bg-input: rgba(255, 255, 255, 0.94);
    --bg-hover: #f7fbfd;
    --bg-muted: #e9eff6;

    /* === Bordi === */
    --border-color: rgba(146, 162, 181, 0.28);
    --border-color-light: rgba(171, 186, 204, 0.18);
    --border-color-strong: rgba(121, 140, 163, 0.42);
    --border-radius-xs: 0.25rem;
    --border-radius-sm: 0.5rem;
    --border-radius: 0.75rem;
    --border-radius-lg: 1rem;
    --border-radius-xl: 1.375rem;
    --border-radius-2xl: 1.75rem;
    --border-radius-full: 9999px;

    /* === Ombre Premium === */
    --shadow-xs: 0 1px 2px rgba(9, 18, 31, 0.05);
    --shadow-sm: 0 4px 10px -8px rgba(9, 18, 31, 0.18);
    --shadow: 0 18px 40px -30px rgba(9, 18, 31, 0.28);
    --shadow-md: 0 24px 48px -28px rgba(9, 18, 31, 0.34);
    --shadow-lg: 0 30px 70px -34px rgba(9, 18, 31, 0.38);
    --shadow-xl: 0 36px 90px -40px rgba(9, 18, 31, 0.46);
    --shadow-primary: 0 16px 36px -22px rgba(15, 107, 136, 0.48);
    --shadow-gold: 0 16px 36px -22px rgba(184, 137, 28, 0.42);
    --shadow-card: 0 24px 50px -34px rgba(14, 23, 38, 0.22), 0 8px 16px -12px rgba(10, 82, 104, 0.18);
    --shadow-card-hover: 0 30px 68px -34px rgba(14, 23, 38, 0.28), 0 14px 26px -18px rgba(10, 82, 104, 0.24);
    --shadow-panel: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 0 rgba(255, 255, 255, 0.4);

    /* === Tipografia === */
    --font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'IBM Plex Mono', 'SF Mono', Monaco, 'Cascadia Code', monospace;
    --font-size-2xs: 0.625rem;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8125rem;
    --font-size-base: 0.9375rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.0625rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.625rem;
    --font-size-3xl: 2.125rem;
    --font-size-4xl: 2.75rem;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --line-height: 1.6;
    --line-height-tight: 1.2;
    --line-height-snug: 1.35;
    --letter-spacing-tight: -0.03em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.02em;
    --letter-spacing-wider: 0.08em;
    --letter-spacing-widest: 0.12em;

    /* === Spaziatura === */
    --spacing-0: 0;
    --spacing-px: 1px;
    --spacing-0-5: 0.125rem;
    --spacing-1: 0.25rem;
    --spacing-1-5: 0.375rem;
    --spacing-2: 0.5rem;
    --spacing-2-5: 0.625rem;
    --spacing-3: 0.75rem;
    --spacing-3-5: 0.875rem;
    --spacing-4: 1rem;
    --spacing-5: 1.25rem;
    --spacing-6: 1.5rem;
    --spacing-7: 1.75rem;
    --spacing-8: 2rem;
    --spacing-10: 2.5rem;
    --spacing-12: 3rem;
    --spacing-16: 4rem;
    --spacing-20: 5rem;

    /* === Layout === */
    --sidebar-width: 304px;
    --sidebar-collapsed-width: 72px;
    --header-height: 86px;
    --content-max-width: 1580px;

    /* === Transizioni === */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 320ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-spring: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* === Z-Index === */
    --z-dropdown: 100;
    --z-sidebar: 200;
    --z-header: 300;
    --z-modal-backdrop: 400;
    --z-modal: 500;
    --z-toast: 600;
    --z-tooltip: 700;
}

/* === Dark Mode === */
[data-theme="dark"] {
    --text-primary: #edf2f7;
    --text-secondary: #c9d3df;
    --text-tertiary: #a5b3c4;
    --text-muted: #7f8ca0;
    --bg-body: #07111e;
    --bg-body-alt: #0b1726;
    --bg-sidebar: #020712;
    --bg-sidebar-hover: rgba(255, 255, 255, 0.08);
    --bg-sidebar-active: linear-gradient(90deg, rgba(47, 147, 184, 0.26), rgba(47, 147, 184, 0.08));
    --bg-card: rgba(12, 24, 39, 0.9);
    --bg-card-strong: #0f1c2d;
    --bg-header: rgba(5, 12, 22, 0.82);
    --bg-input: rgba(12, 24, 39, 0.95);
    --bg-hover: #102134;
    --bg-muted: #0e2033;
    --border-color: rgba(109, 130, 156, 0.3);
    --border-color-light: rgba(109, 130, 156, 0.16);
    --border-color-strong: rgba(131, 149, 173, 0.38);
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.24);
    --shadow-sm: 0 4px 10px -8px rgba(0, 0, 0, 0.3);
    --shadow: 0 18px 40px -30px rgba(0, 0, 0, 0.42);
    --shadow-md: 0 24px 48px -28px rgba(0, 0, 0, 0.46);
    --shadow-lg: 0 30px 70px -34px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 36px 90px -40px rgba(0, 0, 0, 0.58);
    --shadow-card: 0 24px 50px -34px rgba(0, 0, 0, 0.5), 0 8px 16px -12px rgba(0, 0, 0, 0.34);
    --shadow-card-hover: 0 30px 68px -34px rgba(0, 0, 0, 0.58), 0 14px 26px -18px rgba(0, 0, 0, 0.42);
    --shadow-panel: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 1px 0 rgba(255, 255, 255, 0.02);
    --color-success-light: rgba(11, 138, 93, 0.16);
    --color-warning-light: rgba(192, 118, 21, 0.16);
    --color-danger-light: rgba(197, 58, 44, 0.16);
    --color-info-light: rgba(21, 94, 239, 0.16);
    --color-success-border: rgba(11, 138, 93, 0.28);
    --color-warning-border: rgba(192, 118, 21, 0.28);
    --color-danger-border: rgba(197, 58, 44, 0.28);
    --color-info-border: rgba(21, 94, 239, 0.28);
    --color-gray-50: #0f1c2d;
    --color-gray-100: #142437;
}