/* ==========================================================================
   Design Tokens - Template de Tema (Theme System)
   Todas as cores da aplicação derivam estritamente deste template.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Template Base / Tema Padrão: Corporate (Azul Corporativo / Slate)
   -------------------------------------------------------------------------- */
:root,
[data-theme="corporate"] {
  /* Identificador do Tema */
  --theme-name: 'corporate';
  --color-scheme: light;

  /* Cores de Destaque / Primárias */
  --color-primary: hsl(221, 83%, 49%);
  --color-primary-hover: hsl(221, 83%, 45%);
  --color-primary-active: hsl(221, 83%, 38%);
  --color-primary-subtle: hsl(221, 83%, 96%);
  --color-primary-contrast: #ffffff;

  /* Superfícies e Fundos */
  --color-bg: hsl(210, 20%, 98%);
  --color-surface: hsl(0, 0%, 100%);
  --color-surface-hover: hsl(210, 20%, 96%);
  --color-surface-muted: hsl(210, 20%, 93%);

  /* Barra Lateral (Sidebar) */
  --color-sidebar: hsl(222, 47%, 11%);
  --color-sidebar-surface: hsl(222, 47%, 15%);
  --color-sidebar-text: hsl(215, 20%, 85%);
  --color-sidebar-active: hsl(221, 83%, 53%);
  --color-sidebar-border: rgba(255, 255, 255, 0.08);

  /* Tipografia & Cores de Texto */
  --color-text-main: hsl(222, 47%, 11%);
  --color-text-muted: hsl(215, 16%, 40%);
  --color-text-subtle: hsl(215, 16%, 40%);
  --color-text-secondary: hsl(215, 16%, 40%);
  --color-text-inverse: #ffffff;
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);

  /* Bordas e Divisores */
  --color-border: hsl(214, 32%, 91%);
  --color-border-hover: hsl(214, 32%, 80%);
  --color-border-subtle: hsl(214, 32%, 95%);

  /* Status Semânticos */
  --color-success: hsl(158, 64%, 40%);
  --color-success-bg: hsl(158, 64%, 95%);
  --color-warning: hsl(38, 92%, 50%);
  --color-warning-bg: hsl(38, 92%, 95%);
  --color-danger: hsl(0, 72%, 51%);
  --color-danger-bg: hsl(0, 72%, 96%);
  --color-info: hsl(221, 83%, 53%);
  --color-info-bg: hsl(221, 83%, 96%);

  /* Sombras */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
}

/* GFinance original: paleta escura definida em DESIGN.md. */
html[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: #ffffff;
  --color-primary-hover: #e4eaf4;
  --color-primary-active: #cbd5e1;
  --color-primary-subtle: #12244f;
  --color-primary-contrast: #0b0c0e;
  --color-bg: #0e111b;
  --color-surface: #0d172b;
  --color-surface-hover: #15233b;
  --color-surface-muted: #12244f;
  --color-sidebar: #0b0c0e;
  --color-sidebar-surface: #0d172b;
  --color-sidebar-text: #c7c9d1;
  --color-sidebar-active: #2862d7;
  --color-sidebar-border: #172540;
  --color-text-main: #ffffff;
  --color-text-muted: #c7c9d1;
  --color-text-subtle: #abaebb;
  --color-text-secondary: #abaebb;
  --color-text-inverse: #0b0c0e;
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);
  --color-border: #172540;
  --color-border-hover: #24375a;
  --color-border-subtle: #151e32;
  --color-success: #65d6a5;
  --color-success-bg: #102b27;
  --color-warning: #f1c66d;
  --color-warning-bg: #302719;
  --color-danger: #ff9292;
  --color-danger-bg: #351f29;
  --color-info: #8bb8ff;
  --color-info-bg: #132747;
  --shadow-sm: 0 2px 8px rgba(0,0,0,.24);
  --shadow-md: 0 4px 20px rgba(0,0,0,.28);
  --shadow-lg: 0 16px 34px rgba(0,0,0,.34);
  --radius-sm: 8px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* GFinance Claro: derivação acessível do mesmo sistema visual. */
html[data-theme="light"] {
  color-scheme: light;
  --theme-name: 'gfinance-light';
  --color-primary: #2862d7;
  --color-primary-hover: #1f52b8;
  --color-primary-active: #193f8e;
  --color-primary-subtle: #eaf1ff;
  --color-primary-contrast: #ffffff;
  --color-bg: #f5f7fb;
  --color-surface: #ffffff;
  --color-surface-hover: #f0f4fa;
  --color-surface-muted: #eaf1fb;
  --color-sidebar: #0e111b;
  --color-sidebar-surface: #0d172b;
  --color-sidebar-text: #c7c9d1;
  --color-sidebar-active: #2862d7;
  --color-sidebar-border: #24375a;
  --color-text-main: #0e111b;
  --color-text-muted: #43516a;
  --color-text-subtle: #5a6780;
  --color-text-secondary: #43516a;
  --color-text-inverse: #ffffff;
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);
  --color-border: #d5deeb;
  --color-border-hover: #aabbd3;
  --color-border-subtle: #e6ebf2;
  --color-success: #176b49;
  --color-success-bg: #e5f5ed;
  --color-warning: #765000;
  --color-warning-bg: #fff3d6;
  --color-danger: #a72f39;
  --color-danger-bg: #ffeaec;
  --color-info: #2456b6;
  --color-info-bg: #eaf1ff;
  --shadow-sm: 0 2px 8px rgba(14,17,27,.06);
  --shadow-md: 0 4px 20px rgba(14,17,27,.08);
  --shadow-lg: 0 16px 34px rgba(14,17,27,.12);
  --radius-sm: 8px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme] body { background: var(--color-bg); color: var(--color-text-main); font-family: var(--font-ui); }
html[data-theme] :is(h1,h2,h3,h4) { color: var(--color-text-main); letter-spacing: -.025em; }
html[data-theme="dark"] :is(input,select,textarea) { color-scheme: dark; background-color: var(--color-bg); border-color: var(--color-border); border-radius: 8px; }
html[data-theme="light"] :is(input,select,textarea) { color-scheme: light; background-color: var(--color-surface); border-color: var(--color-border); border-radius: 8px; }
html[data-theme] :is(button,a,input,select,textarea,[tabindex]):focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }
html[data-theme="dark"] ::selection { color: #0b0c0e; background: #85a6e9; }
html[data-theme="light"] ::selection { color: #fff; background: #2862d7; }
html[data-theme] a { text-underline-offset: .22em; }
html[data-theme] :is(.card,.panel,.stat-card,.dashboard-card,.module-card,.chart-card,.data-card) { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: none; }
html[data-theme] :is(table, .table-container) { color: var(--color-text-main); }
html[data-theme] :is(th,td) { border-color: var(--color-border); }
@media (prefers-reduced-motion: reduce) { html[data-theme] *, html[data-theme] *::before, html[data-theme] *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* --------------------------------------------------------------------------
   2. Preset: Emerald (Verde Esmeralda)
   -------------------------------------------------------------------------- */
[data-theme="emerald"] {
  --theme-name: 'emerald';
  --color-scheme: light;

  /* Primária Verde Esmeralda Institucional */
  --color-primary: hsl(164, 88%, 26%);
  --color-primary-hover: hsl(164, 88%, 23%);
  --color-primary-active: hsl(164, 88%, 20%);
  --color-primary-subtle: hsl(164, 60%, 94%);
  --color-primary-contrast: #ffffff;

  /* Superfícies e Fundos */
  --color-bg: hsl(160, 20%, 98%);
  --color-surface: hsl(0, 0%, 100%);
  --color-surface-hover: hsl(160, 20%, 95%);
  --color-surface-muted: hsl(160, 15%, 92%);

  /* Sidebar em Verde Escuro Petróleo */
  --color-sidebar: hsl(166, 60%, 9%);
  --color-sidebar-surface: hsl(166, 60%, 13%);
  --color-sidebar-text: hsl(160, 25%, 85%);
  --color-sidebar-active: hsl(164, 88%, 32%);
  --color-sidebar-border: rgba(255, 255, 255, 0.09);

  /* Textos */
  --color-text-main: hsl(166, 60%, 11%);
  --color-text-muted: hsl(160, 15%, 38%);
  --color-text-subtle: hsl(160, 15%, 38%);
  --color-text-secondary: hsl(160, 15%, 38%);
  --color-text-inverse: #ffffff;
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);

  /* Bordas */
  --color-border: hsl(160, 25%, 89%);
  --color-border-hover: hsl(160, 25%, 78%);
  --color-border-subtle: hsl(160, 25%, 94%);

  /* Status Semânticos */
  --color-success: hsl(164, 88%, 32%);
  --color-success-bg: hsl(164, 60%, 94%);
  --color-warning: hsl(38, 92%, 48%);
  --color-warning-bg: hsl(38, 92%, 95%);
  --color-danger: hsl(0, 72%, 51%);
  --color-danger-bg: hsl(0, 72%, 96%);
  --color-info: hsl(188, 78%, 40%);
  --color-info-bg: hsl(188, 78%, 94%);

  --shadow-sm: 0 1px 2px 0 rgba(0, 40, 20, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 40, 20, 0.07), 0 2px 4px -2px rgba(0, 40, 20, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 40, 20, 0.08), 0 4px 6px -4px rgba(0, 40, 20, 0.04);
}

/* --------------------------------------------------------------------------
   3. Preset: Dark Slate (Modo Escuro Elegante & Ergonômico)
   -------------------------------------------------------------------------- */
[data-theme="dark"] {
  --theme-name: 'dark';
  --color-scheme: dark;

  /* Primária Azul Celeste Brilhante para Alto Contraste no Escuro */
  --color-primary: hsl(217, 91%, 60%);
  --color-primary-hover: hsl(217, 91%, 68%);
  --color-primary-active: hsl(217, 91%, 74%);
  --color-primary-subtle: hsl(217, 70%, 18%);
  --color-primary-contrast: var(--color-text-inverse);

  /* Superfícies e Fundos Escuros */
  --color-bg: hsl(222, 47%, 9%);
  --color-surface: hsl(222, 47%, 13%);
  --color-surface-hover: hsl(222, 47%, 17%);
  --color-surface-muted: hsl(222, 47%, 19%);

  /* Sidebar */
  --color-sidebar: hsl(224, 71%, 6%);
  --color-sidebar-surface: hsl(224, 71%, 10%);
  --color-sidebar-text: hsl(215, 20%, 75%);
  --color-sidebar-active: hsl(217, 91%, 60%);
  --color-sidebar-border: hsl(220, 30%, 16%);

  /* Textos */
  --color-text-main: hsl(210, 40%, 98%);
  --color-text-muted: hsl(215, 20%, 70%);
  --color-text-subtle: hsl(215, 15%, 65%);
  --color-text-secondary: hsl(215, 20%, 70%);
  --color-text-inverse: hsl(222, 47%, 9%);
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);

  /* Bordas */
  --color-border: hsl(220, 30%, 20%);
  --color-border-hover: hsl(220, 30%, 30%);
  --color-border-subtle: hsl(220, 30%, 15%);

  /* Status Semânticos Dark */
  --color-success: hsl(158, 64%, 52%);
  --color-success-bg: hsl(158, 64%, 14%);
  --color-warning: hsl(38, 92%, 58%);
  --color-warning-bg: hsl(38, 92%, 14%);
  --color-danger: hsl(0, 75%, 62%);
  --color-danger-bg: hsl(0, 75%, 15%);
  --color-info: hsl(217, 91%, 65%);
  --color-info-bg: hsl(217, 91%, 15%);

  /* Sombras Profundas */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 8px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 20px -3px rgba(0, 0, 0, 0.6), 0 4px 6px -4px rgba(0, 0, 0, 0.4);
}

/* --------------------------------------------------------------------------
   4. Preset: Midnight (Índigo Noturno Sofisticado)
   -------------------------------------------------------------------------- */
[data-theme="midnight"] {
  --theme-name: 'midnight';
  --color-scheme: dark;

  /* Primária Índigo Elétrico */
  --color-primary: hsl(245, 82%, 70%);
  --color-primary-hover: hsl(245, 82%, 73%);
  --color-primary-active: hsl(245, 82%, 79%);
  --color-primary-subtle: hsl(245, 60%, 18%);
  --color-primary-contrast: var(--color-text-inverse);

  /* Superfícies e Fundos Midnight */
  --color-bg: hsl(240, 30%, 8%);
  --color-surface: hsl(240, 25%, 12%);
  --color-surface-hover: hsl(240, 25%, 16%);
  --color-surface-muted: hsl(240, 25%, 18%);

  /* Sidebar */
  --color-sidebar: hsl(240, 35%, 6%);
  --color-sidebar-surface: hsl(240, 35%, 10%);
  --color-sidebar-text: hsl(235, 20%, 75%);
  --color-sidebar-active: hsl(245, 82%, 67%);
  --color-sidebar-border: hsl(240, 20%, 18%);

  /* Textos */
  --color-text-main: hsl(240, 30%, 98%);
  --color-text-muted: hsl(235, 20%, 70%);
  --color-text-subtle: hsl(235, 15%, 65%);
  --color-text-secondary: hsl(235, 20%, 70%);
  --color-text-inverse: hsl(240, 30%, 8%);
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);

  /* Bordas */
  --color-border: hsl(240, 20%, 20%);
  --color-border-hover: hsl(240, 20%, 30%);
  --color-border-subtle: hsl(240, 20%, 15%);

  /* Status Semânticos */
  --color-success: hsl(160, 70%, 52%);
  --color-success-bg: hsl(160, 70%, 13%);
  --color-warning: hsl(40, 95%, 60%);
  --color-warning-bg: hsl(40, 95%, 13%);
  --color-danger: hsl(350, 80%, 65%);
  --color-danger-bg: hsl(350, 80%, 15%);
  --color-info: hsl(245, 82%, 70%);
  --color-info-bg: hsl(245, 82%, 16%);

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 8px -1px rgba(0, 0, 0, 0.55), 0 2px 4px -2px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 12px 20px -3px rgba(0, 0, 0, 0.65), 0 4px 6px -4px rgba(0, 0, 0, 0.45);
}

/* --------------------------------------------------------------------------
   5. Preset: Sunset (Âmbar Quente / Terracota Executivo)
   -------------------------------------------------------------------------- */
[data-theme="sunset"] {
  --theme-name: 'sunset';
  --color-scheme: light;

  /* Primária Âmbar / Laranja Queimado Quente */
  --color-primary: hsl(24, 90%, 36%);
  --color-primary-hover: hsl(24, 90%, 33%);
  --color-primary-active: hsl(24, 90%, 30%);
  --color-primary-subtle: hsl(24, 90%, 95%);
  --color-primary-contrast: #ffffff;

  /* Superfícies e Fundos Quentes */
  --color-bg: hsl(30, 25%, 97%);
  --color-surface: hsl(0, 0%, 100%);
  --color-surface-hover: hsl(30, 25%, 94%);
  --color-surface-muted: hsl(30, 20%, 91%);

  /* Sidebar Café Escuro / Chocolate */
  --color-sidebar: hsl(20, 35%, 11%);
  --color-sidebar-surface: hsl(20, 35%, 15%);
  --color-sidebar-text: hsl(25, 20%, 85%);
  --color-sidebar-active: hsl(24, 90%, 48%);
  --color-sidebar-border: rgba(255, 255, 255, 0.08);

  /* Textos */
  --color-text-main: hsl(20, 35%, 13%);
  --color-text-muted: hsl(20, 15%, 38%);
  --color-text-subtle: hsl(20, 15%, 38%);
  --color-text-secondary: hsl(20, 15%, 38%);
  --color-text-inverse: #ffffff;
  --text-main: var(--color-text-main);
  --text-secondary: var(--color-text-muted);
  --text-muted: var(--color-text-muted);

  /* Bordas */
  --color-border: hsl(25, 25%, 88%);
  --color-border-hover: hsl(25, 25%, 78%);
  --color-border-subtle: hsl(25, 25%, 94%);

  /* Status Semânticos */
  --color-success: hsl(145, 65%, 38%);
  --color-success-bg: hsl(145, 65%, 94%);
  --color-warning: hsl(24, 90%, 48%);
  --color-warning-bg: hsl(24, 90%, 95%);
  --color-danger: hsl(0, 72%, 51%);
  --color-danger-bg: hsl(0, 72%, 96%);
  --color-info: hsl(200, 85%, 45%);
  --color-info-bg: hsl(200, 85%, 95%);

  --shadow-sm: 0 1px 2px 0 rgba(40, 20, 10, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(40, 20, 10, 0.07), 0 2px 4px -2px rgba(40, 20, 10, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(40, 20, 10, 0.08), 0 4px 6px -4px rgba(40, 20, 10, 0.04);
}
