/**
 * FireSys / ExtinControl — Design System
 * Referência visual: mockup FireSys 2026
 * Azul institucional + vermelho acento (extintores)
 */
:root,
[data-bs-theme="light"] {
    /* Marca — azul */
    --brand-primary: #023F80;
    --brand-primary-dark: #012D5C;
    --brand-primary-darker: #01254A;
    --brand-primary-light: #12548B;
    --brand-primary-rgb: 2, 63, 128;

    /* Acento — vermelho (uso pontual) */
    --accent-red: #E02424;
    --accent-red-hover: #C81E1E;
    --accent-red-rgb: 224, 36, 36;
    --accent-red-subtle: rgba(var(--accent-red-rgb), 0.1);

    /* Tokens de UI */
    --primary-color: var(--brand-primary);
    --primary-rgb: var(--brand-primary-rgb);
    --secondary-color: var(--brand-primary-dark);
    --accent-color: var(--accent-red);
    --primary-hover: var(--brand-primary-darker);
    --primary-subtle: rgba(var(--brand-primary-rgb), 0.1);
    --primary-subtle-strong: rgba(var(--brand-primary-rgb), 0.15);

    /* Bootstrap 5.3 */
    --bs-primary: var(--brand-primary);
    --bs-primary-rgb: var(--brand-primary-rgb);
    --bs-danger: var(--accent-red);
    --bs-danger-rgb: var(--accent-red-rgb);
    --bs-link-color: var(--brand-primary);
    --bs-link-hover-color: var(--brand-primary-dark);
    --bs-focus-ring-color: rgba(var(--brand-primary-rgb), 0.25);

    /* Superfícies */
    --text-color: #1F2937;
    --text-muted: #6B7280;
    --light-text: #6B7280;
    --background-color: #F8FAFC;
    --card-background: #FFFFFF;
    --border-color: #E5E7EB;

    /* Sidebar */
    --sidebar-width: 260px;
    --sidebar-width-collapsed: 72px;
    --sidebar-bg: var(--brand-primary);
    --sidebar-bg-subtle: var(--brand-primary-light);
    --sidebar-text: rgba(255, 255, 255, 0.92);
    --sidebar-text-muted: rgba(255, 255, 255, 0.65);
    --sidebar-active-bg: var(--accent-red);
    --sidebar-active-color: #FFFFFF;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.1);
    --sidebar-submenu-bg: rgba(255, 255, 255, 0.08);
    --sidebar-submenu-border: rgba(255, 255, 255, 0.12);

    /* Topbar / chrome do workspace (altura via flexbox, não hardcoded em páginas) */
    --topbar-height: 64px;
    --workspace-tab-height: 38px;
    --topbar-bg: #FFFFFF;
    --topbar-border: var(--border-color);

    /* Cards — padrão visual oficial FireSys */
    --card-radius: 10px;
    --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --card-shadow-hover: 0 2px 8px rgba(0, 0, 0, 0.08);
    --card-border: 1px solid var(--border-color);

    /* Espaçamento — workspace / páginas (única fonte de verdade) */
    --page-padding: 24px;
    --page-padding-desktop: var(--page-padding);
    --page-padding-tablet: 20px;
    --page-padding-mobile: 16px;
    --card-padding: 24px;
    --card-padding-compact: 16px;
    --section-gap: 16px;
    --page-section-gap: var(--section-gap);
    --content-gap: 16px;
    --form-gap: var(--content-gap);
    --page-header-gap: 8px;
    --action-bar-height: 52px;
    --form-action-bar-height: var(--action-bar-height);

    /* Espaçamento — escala geral */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;

    /* Transições */
    --transition-fast: 150ms ease;
    --transition-base: 200ms ease;
    --transition-sidebar: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --sidebar-accordion-duration: 200ms cubic-bezier(0.4, 0, 0.2, 1);

    /* Tabelas */
    --table-header-bg: #F8FAFC;
    --table-header-color: var(--text-color);
    --table-border-color: var(--border-color);
    --table-row-hover: rgba(var(--brand-primary-rgb), 0.04);

    /* Alertas */
    --alert-info-bg: rgba(var(--brand-primary-rgb), 0.12);
    --alert-info-border: var(--brand-primary);
    --alert-info-color: var(--brand-primary-dark);
}

[data-theme="dark"] {
    --brand-primary: #0361C6;
    --brand-primary-dark: #023F80;
    --brand-primary-darker: #0258B3;
    --brand-primary-light: #12548B;
    --brand-primary-rgb: 3, 97, 198;

    --accent-red: #EF4444;
    --accent-red-hover: #DC2626;
    --accent-red-rgb: 239, 68, 68;

    --text-color: #F9FAFB;
    --text-muted: #9CA3AF;
    --light-text: #D1D5DB;
    --background-color: #111827;
    --card-background: #1F2937;
    --border-color: #374151;

    --sidebar-bg: #01254A;
    --sidebar-bg-subtle: #023F80;
    --sidebar-submenu-bg: rgba(255, 255, 255, 0.06);

    --topbar-bg: #1F2937;
    --topbar-border: #374151;

    --table-header-bg: rgba(255, 255, 255, 0.05);
    --table-header-color: #E5E7EB;
    --table-row-hover: rgba(255, 255, 255, 0.04);

    --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}