/* === VARIÁVEIS DE COR (Light & Dark) === */
:root {
    /* Cores da marca (gradiente do logo) */
    --primary-50: #f2f0ff;
    --primary-100: #e6e0ff;
    --primary-200: #d4c7ff;
    --primary-300: #b8a0ff;
    --primary-400: #9d7aff;
    --primary-500: #6300ED;
    /* Primária - cor inicial do logo */
    --primary-600: #5300c7;
    --primary-700: #4300a1;
    --primary-800: #33007b;
    --primary-900: #230055;

    --secondary-50: #f0f7ff;
    --secondary-100: #e1efff;
    --secondary-200: #c2dfff;
    --secondary-300: #93c7ff;
    --secondary-400: #66aaff;
    --secondary-500: #4797FF;
    /* Secundária - cor intermediária */
    --secondary-600: #2d7de6;
    --secondary-700: #1d63c2;
    --secondary-800: #134a9e;
    --secondary-900: #0c357a;

    --tertiary-50: #f0fffd;
    --tertiary-100: #dcfffa;
    --tertiary-200: #b8fff5;
    --tertiary-300: #84ffef;
    --tertiary-400: #47ffe8;
    --tertiary-500: #03DAC6;
    /* Terciária - cor final do logo */
    --tertiary-600: #00b8a5;
    --tertiary-700: #009685;
    --tertiary-800: #007465;
    --tertiary-900: #005245;

    /* Cores neutras (suas cores) */
    --neutral-50: #FFFFFF;
    /* Cor neutra - branco puro */
    --neutral-100: #F8FAFC;
    --neutral-200: #EDF2FC;
    /* Fundo principal */
    --neutral-300: #E2E8F0;
    --neutral-400: #CBD5E1;
    --neutral-500: #94A3B8;
    --neutral-600: #64748B;
    --neutral-700: #475966;
    /* Texto Secundário */
    --neutral-800: #334155;
    --neutral-900: #252B33;
    /* Texto Primário */

    /* Cores semânticas baseadas na sua paleta */
    /* SUCCESS — base #03DAC6 */
    --success-500: #03DAC6;
    --success-600: #00b8a5;

    --bg-success: #E0FAF8;
    /* #03DAC6 @ 12% sobre #fff */
    --bg-success-subtle: #F0FDFB;
    /* #03DAC6 @ 6% sobre #fff  */
    --bg-success-icon: #ADFAF3;
    /* #03DAC6 @ 28% sobre #fff */
    --border-success: #03DAC633;
    /* #03DAC6 @ 20%            */
    --text-success: #007A6E;
    /* #03DAC6 escurecido ~45%  */

    /* WARNING — base #FFB347 */
    --warning-500: #FFB347;
    --warning-600: #ff9900;

    --bg-warning: #FFF3E0;
    /* #FFB347 @ 12% */
    --bg-warning-subtle: #FFFAF2;
    /* #FFB347 @ 6%  */
    --bg-warning-icon: #FFE0A8;
    /* #FFB347 @ 28% */
    --border-warning: #FFB34733;
    --text-warning: #A65C00;
    /* #FF9900 escurecido ~35% */

    /* ERROR — base #FF6B6B */
    --error-500: #FF6B6B;
    --error-600: #ff4757;

    --bg-error: #FEEDED;
    /* #FF6B6B @ 12% */
    --bg-error-subtle: #FFF5F5;
    /* #FF6B6B @ 6%  */
    --bg-error-icon: #FFC2C2;
    /* #FF6B6B @ 28% */
    --border-error: #FF6B6B33;
    --text-error: #C0001A;
    /* #FF4757 escurecido ~40% */

    /* INFO — base #4797FF */
    --info-500: #4797FF;

    --bg-info: #E4EFFF;
    /* #4797FF @ 12% */
    --bg-info-subtle: #F2F7FF;
    /* #4797FF @ 6%  */
    --bg-info-icon: #AECEFF;
    /* #4797FF @ 28% */
    --border-info: #4797FF33;
    --text-info: #0047CC;

    /* Sistema de aplicação */
    --bg-primary: var(--neutral-50);
    /* #FFFFFF */
    --bg-secondary: var(--neutral-200);
    /* #EDF2FC - Fundo */
    --bg-tertiary: var(--neutral-100);

    --text-primary: var(--neutral-900);
    /* #252B33 */
    --text-secondary: var(--neutral-700);
    /* #475966 */
    --text-tertiary: var(--neutral-600);
    --text-muted: var(--neutral-300);
    --text-inverse: var(--neutral-50);
    /* #FFFFFF */

    --font-display: 'Poppins', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', monospace;

    --border-light: var(--neutral-300);
    --border-medium: var(--neutral-400);
    --border-strong: var(--neutral-500);

    /* Efeitos */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-sm-on: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3);
    --shadow-md-on: 0 6px 8px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 10px rgba(0, 0, 0, 0.4);
    --shadow-lg-on: 0 10px 12px rgba(0, 0, 0, 0.5);
    --shadow-focus: 0 0 0 4px rgba(0, 0, 0, 0.1);

    /* Glass morphism light */
    --glass-bg: rgba(237, 242, 252, 0.7);
    --glass-clean: rgba(255, 255, 255, 0.2);
    --glass-border: rgba(255, 255, 255, 0.6);
    --frosted: 8px;

    /* Ripple Effect */
    --ripple-effect: rgba(255, 255, 255, 0.3);
    --ripple-effect-secondary: rgba(71, 89, 102, 0.1);

    /* Overlayers */
    --overlayer: rgba(0, 0, 0, 0.55);

    /* Sistema proporcional baseado em rem */
    --radius-1: 0.25rem;
    /* 4px  - Para elementos muito pequenos */
    --radius-2: 0.375rem;
    /* 6px  - Buttons pequenos, inputs */
    --radius-3: 0.5rem;
    /* 8px  - Padrão (buttons médios, cards pequenos) */
    --radius-4: 0.75rem;
    /* 12px - Buttons grandes, cards médios */
    --radius-5: 1rem;
    /* 16px - Cards grandes, modais */
    --radius-6: 1.5rem;
    /* 24px - Containers grandes */
    --radius-pill: 9999px;
    /* Para pills/cápsulas */
    --radius-full: 50%;
    /* Para círculos */

    /* Metro UI */
    /* Paleta de Cores em Hexadecimal */
    --lime: #8cbf26;
    --green: #60a917;
    --emerald: #008a00;
    --teal: #00aba9;
    --cyan: #1ba1e2;
    --cobalt: #0050ef;
    --indigo: #6a00ff;
    --violet: #aa00ff;
    --pink: #f472d0;
    --magenta: #d80073;
    --crimson: #a20025;
    --red: #e51400;
    --orange: #fa6800;
    --amber: #f0a30a;
    --yellow: #e3c800;
    --brown: #825a2c;
    --olive: #6d8764;
    --steel: #647687;
    --mauve: #76608a;
    --taupe: #87794e;

    /* BI Layout Specific */
    --sidebar-collapsed: 64px;
    --sidebar-expanded: 210px;
    --sidebar-width: 210px;
    --sidebar-transition: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    --bg-sidebar: var(--neutral-900);
    --text-sidebar: var(--neutral-500);
    --text-sidebar-on: var(--neutral-200);
    --sidebar-toggle-border: var(--neutral-800);
    --topbar-height: 56px;
    --charts-panel-width: 52%;
    --charts-panel-min: 480px;
    --charts-panel-max: 730px;
}

[data-theme="dark"] {

    --font-display: 'Poppins', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', monospace;

    /* Cores da marca (mais escuras mas vibrantes) */
    --primary-50: #230055;
    --primary-100: #33007b;
    --primary-200: #4300a1;
    --primary-300: #5300c7;
    --primary-400: #6300ED;
    --primary-500: #7d29ff;
    /* Mais claro no dark para contraste */
    --primary-600: #9350ff;
    --primary-700: #a977ff;
    --primary-800: #bf9eff;
    --primary-900: #d5c5ff;

    --secondary-50: #0c357a;
    --secondary-100: #134a9e;
    --secondary-200: #1d63c2;
    --secondary-300: #2d7de6;
    --secondary-400: #4797FF;
    --secondary-500: #66aaff;
    /* Mais claro no dark */
    --secondary-600: #85bdff;
    --secondary-700: #a4d0ff;
    --secondary-800: #c3e3ff;
    --secondary-900: #e2f6ff;

    --tertiary-50: #005245;
    --tertiary-100: #007465;
    --tertiary-200: #009685;
    --tertiary-300: #00b8a5;
    --tertiary-400: #03DAC6;
    --tertiary-500: #47ffe8;
    /* Mais vibrante no dark */
    --tertiary-600: #84ffef;
    --tertiary-700: #b8fff5;
    --tertiary-800: #dcfffa;
    --tertiary-900: #f0fffd;

    /* Cores neutras (invertidas para dark) */
    --neutral-50: #0f1419;
    /* Preto azulado em vez de branco */
    --neutral-100: #1a2026;
    --neutral-200: #252B33;
    /* Fundo dark (era texto primário) */
    --neutral-300: #2d3843;
    --neutral-400: #475966;
    /* Era texto secundário */
    --neutral-500: #64748B;
    --neutral-600: #94A3B8;
    --neutral-700: #CBD5E1;
    --neutral-800: #E2E8F0;
    --neutral-900: #FFFFFF;
    /* Texto no dark */

    /* Cores semânticas dark */
    /* SUCCESS — base #47ffe8 */
    --success-500: #47ffe8;
    --success-600: #84ffef;

    --bg-success: #0D3330;
    /* #47ffe8 @ 14% sobre #121212 */
    --bg-success-subtle: #071F1D;
    /* #47ffe8 @ 7%               */
    --bg-success-icon: #134D49;
    /* #47ffe8 @ 22% sobre #1E1E1E */
    --border-success: #47ffe826;
    --text-success: #47ffe8;
    /* usa direto a semântica       */

    /* WARNING — base #ffb347 */
    --warning-500: #ffb347;
    --warning-600: #ffc47d;

    --bg-warning: #332408;
    /* #ffb347 @ 14% sobre #121212 */
    --bg-warning-subtle: #1F1504;
    /* #ffb347 @ 7%               */
    --bg-warning-icon: #4D360D;
    /* #ffb347 @ 22% sobre #1E1E1E */
    --border-warning: #ffb34726;
    --text-warning: #ffb347;

    /* ERROR — base #ff6b6b */
    --error-500: #ff6b6b;
    --error-600: #ff8e8e;

    --bg-error: #331212;
    /* #ff6b6b @ 14% sobre #121212 */
    --bg-error-subtle: #1F0A0A;
    /* #ff6b6b @ 7%               */
    --bg-error-icon: #4D1A1A;
    /* #ff6b6b @ 22% sobre #1E1E1E */
    --border-error: #ff6b6b26;
    --text-error: #ff6b6b;

    /* INFO — base #66aaff */
    --info-500: #66aaff;

    --bg-info: #0F2340;
    /* #66aaff @ 14% sobre #121212 */
    --bg-info-subtle: #091526;
    /* #66aaff @ 7%               */
    --bg-info-icon: #163566;
    /* #66aaff @ 22% sobre #1E1E1E */
    --border-info: #66aaff26;
    --text-info: #66aaff;

    /* Sistema de aplicação dark */
    --bg-primary: var(--neutral-100);
    /* #1a2026 */
    --bg-secondary: var(--neutral-200);
    /* #252B33 - Fundo dark */
    --bg-tertiary: var(--neutral-300);

    --text-primary: var(--neutral-900);
    /* #FFFFFF */
    --text-secondary: var(--neutral-700);
    /* #CBD5E1 */
    --text-tertiary: var(--neutral-600);
    --text-muted: var(--neutral-300);
    --text-inverse: var(--neutral-50);
    /* #252B33 */

    --border-light: var(--neutral-300);
    --border-medium: var(--neutral-400);
    --border-strong: var(--neutral-500);

    /* Efeitos dark */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-sm-on: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3);
    --shadow-md-on: 0 6px 8px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 10px rgba(0, 0, 0, 0.4);
    --shadow-lg-on: 0 10px 12px rgba(0, 0, 0, 0.5);
    --shadow-focus: 0 0 0 4px rgba(255, 255, 255, 0.1);

    /* Glass morphism dark */
    --glass-bg: rgba(37, 43, 51, 0.7);
    --glass-clean: rgba(255, 255, 255, 0.2);
    --glass-border: rgba(60, 60, 60, 0.5);
    --frosted: 8px;

    /* Ripple Effect */
    --ripple-effect: rgba(0, 0, 0, 0.15);
    --ripple-effect-secondary: rgba(110, 136, 155, 0.5);

    /* Overlayers */
    --overlayer: rgba(175, 175, 175, 0.2);

    /* Sistema proporcional baseado em rem */
    --radius-1: 0.25rem;
    /* 4px  - Para elementos muito pequenos */
    --radius-2: 0.375rem;
    /* 6px  - Buttons pequenos, inputs */
    --radius-3: 0.5rem;
    /* 8px  - Padrão (buttons médios, cards pequenos) */
    --radius-4: 0.75rem;
    /* 12px - Buttons grandes, cards médios */
    --radius-5: 1rem;
    /* 16px - Cards grandes, modais */
    --radius-6: 1.5rem;
    /* 24px - Containers grandes */
    --radius-pill: 9999px;
    /* Para pills/cápsulas */
    --radius-full: 50%;
    /* Para círculos */

    /* Metro UI */
    /* Paleta de Cores em Hexadecimal */
    /* Verdes */
    --lime: #d4f07a;
    --green: #aaed6b;
    --emerald: #7aed7a;

    /* Azul-esverdeados */
    --teal: #6af0ee;
    --cyan: #8dd4fa;

    /* Azuis */
    --cobalt: #85b8ff;
    --indigo: #c285ff;

    /* Roxos/rosas */
    --violet: #db85ff;
    --pink: #fac4f2;
    --magenta: #f77dc0;

    /* Vermelhos */
    --crimson: #f0899a;
    --red: #ff8c78;

    /* Quentes */
    --orange: #ffb87a;
    --amber: #fae085;
    --yellow: #f7f07a;

    /* Neutros terrosos */
    --brown: #d4a882;
    --olive: #bdd4b5;
    --steel: #bacad6;
    --mauve: #ccbcda;
    --taupe: #d4c096;

    /* BI Layout Specific */
    --sidebar-collapsed: 64px;
    --sidebar-expanded: 210px;
    --sidebar-width: 210px;
    --sidebar-transition: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    --bg-sidebar: var(--neutral-50);
    --text-sidebar: var(--neutral-500);
    --text-sidebar-on: var(--neutral-700);
    --sidebar-toggle-border: var(--neutral-200);
    --topbar-height: 56px;
    --charts-panel-width: 52%;
    --charts-panel-min: 480px;
    --charts-panel-max: 730px;
}