/* ==========================================================================
   ELETRO ERP - DESIGN TOKENS GLOBAIS DE TEMA
   Centralização de cores, superfícies, bordas e estados funcionais.
   Modo Claro (:root) e Modo Escuro ([data-theme="dark"]).
   ========================================================================== */

:root {
    /* Superfícies e Fundos (Modo Claro) */
    --bg-canvas: #f1f5f9;
    --bg-surface: #ffffff;
    --bg-surface-secondary: #f8fafc;
    --bg-surface-tertiary: #f1f5f9;
    --bg-surface-elevated: #ffffff;
    --bg-surface-input: #ffffff;
    --bg-surface-hover: #f1f5f9;
    --bg-surface-active: #e2e8f0;

    /* Tipografia e Textos (Modo Claro) */
    --text-primary: #0f172a;
    --text-secondary: #334155;
    --text-muted: #64748b;
    --text-subtle: #94a3b8;
    --text-inverse: #ffffff;

    /* Bordas e Divisores (Modo Claro) */
    --border-default: #e2e8f0;
    --border-subtle: #f1f5f9;
    --border-strong: #cbd5e1;
    --border-focus: #db0038;

    /* Cores Institucionais e Acentos (Modo Claro) */
    --brand-primary: #db0038;
    --brand-primary-hover: #b8002e;
    --brand-primary-subtle: #ffe4e6;
    --brand-primary-contrast: #ffffff;

    /* Estados e Semântica */
    --status-success: #10b981;
    --status-success-subtle: #ecfdf5;
    --status-warning: #f59e0b;
    --status-warning-subtle: #fffbeb;
    --status-danger: #ef4444;
    --status-danger-subtle: #fef2f2;
    --status-info: #3b82f6;
    --status-info-subtle: #eff6ff;

    /* Componentes Específicos do PDV */
    --pdv-scanner-bg: #ffffff;
    --pdv-scanner-border: #e2e8f0;
    --pdv-shortcut-bg: #ffffff;
    --pdv-shortcut-border: #e2e8f0;
    --pdv-shortcut-key-bg: #f1f5f9;
    --pdv-shortcut-text: #475569;
    --pdv-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    /* Aliases e compatibilidade com sistema legado */
    --text-dark: var(--text-primary);
    --text-light: var(--text-muted);
    --card-white: var(--bg-surface);
    --border-color: var(--border-default);
    --bg-gray: var(--bg-surface-secondary);
}

/* ==========================================================================
   MODO ESCURO - PALETA GOOGLE WORKSPACE / MATERIAL YOU (ALTO CONTRASTE)
   Inspirada no Google Drive / Docs / Sheets Dark Mode (Superfícies carvão neutro).
   ========================================================================== */
[data-theme="dark"] {
    /* Superfícies e Fundos (Padrão Google Workspace) */
    --bg-canvas: #1b1b1b;
    --bg-surface: #131314;
    --bg-surface-secondary: #1e1f20;
    --bg-surface-tertiary: #282a2c;
    --bg-surface-elevated: #1e1f20;
    --bg-surface-input: #282a2c;
    --bg-surface-hover: #2f3133;
    --bg-surface-active: #37393b;

    /* Tipografia e Textos (Padrão Google) */
    --text-primary: #e3e3e3;
    --text-secondary: #c4c7c5;
    --text-muted: #8e918f;
    --text-subtle: #727775;
    --text-inverse: #131314;

    /* Bordas e Divisores */
    --border-default: #282a2c;
    --border-subtle: #1e1f20;
    --border-strong: #3c4043;
    --border-focus: #f43f5e;

    /* Cores Institucionais e Acentos */
    --brand-primary: #e11d48;
    --brand-primary-hover: #f43f5e;
    --brand-primary-subtle: rgba(225, 29, 72, 0.15);
    --brand-primary-contrast: #ffffff;

    /* Estados e Semântica */
    --status-success: #10b981;
    --status-success-subtle: rgba(16, 185, 129, 0.12);
    --status-warning: #f59e0b;
    --status-warning-subtle: rgba(245, 158, 11, 0.12);
    --status-danger: #f43f5e;
    --status-danger-subtle: rgba(244, 63, 94, 0.12);
    --status-info: #38bdf8;
    --status-info-subtle: rgba(56, 189, 248, 0.12);

    /* Componentes Específicos do PDV */
    --pdv-scanner-bg: #282a2c;
    --pdv-scanner-border: #3c4043;
    --pdv-shortcut-bg: #1e1f20;
    --pdv-shortcut-border: #282a2c;
    --pdv-shortcut-key-bg: #282a2c;
    --pdv-shortcut-text: #c4c7c5;
    --pdv-card-shadow: 0 4px 16px rgba(0, 0, 0, 0.45);
    --pdv-popover-shadow: 0 16px 40px rgba(0, 0, 0, 0.65);

    /* Aliases e compatibilidade com sistema legado (Modo Escuro) */
    --text-dark: var(--text-primary);
    --text-light: var(--text-muted);
    --card-white: var(--bg-surface);
    --border-color: var(--border-default);
    --bg-gray: var(--bg-surface-secondary);
}