/* === SIMPLES LOJA — Design Tokens (Stitch MCP) === */
:root {
  /* Primary */
  --primary: #2D4CD8;
  --primary-container: #4B67F2;
  --primary-hover: #2341BE;
  --on-primary: #FFFFFF;
  --on-primary-container: #FFFBFF;
  --primary-fixed: #DEE1FF;
  --primary-fixed-dim: #BAC3FF;
  /* Secondary */
  --secondary: #565E71;
  --secondary-container: #DBE2F9;
  --on-secondary: #FFFFFF;
  /* Tertiary */
  --tertiary: #525C70;
  --tertiary-container: #6B758A;
  /* Surface */
  --background: #F8F9FA;
  --surface: #FFFFFF;
  --surface-dim: #D9DADB;
  --surface-container: #EDEEEF;
  --surface-container-high: #E7E8E9;
  --surface-container-low: #F3F4F5;
  --surface-variant: #E1E3E4;
  /* Text */
  --on-surface: #191C1D;
  --on-surface-variant: #444655;
  --on-background: #191C1D;
  /* Outline */
  --outline: #757686;
  --outline-variant: #C5C5D7;
  --border: #EAECF0;
  --input-border: #D0D5DD;
  /* Semantic */
  --error: #BA1A1A;
  --error-container: #FFDAD6;
  --success: #10B981;
  --success-light: #D1FAE5;
  --warning: #F59E0B;
  --warning-light: #FEF3C7;
  --info: #3B82F6;
  --info-light: #DBEAFE;
  /* Icon Hover Colors per Module */
  --icon-dashboard: #4F6BF6;
  --icon-pdv: #10B981;
  --icon-produtos: #8B5CF6;
  --icon-categorias: #F59E0B;
  --icon-fornecedores: #06B6D4;
  --icon-estoque: #0284C7;
  --icon-relatorios: #EC4899;
  --icon-usuarios: #F97316;
  --icon-configuracoes: #64748B;
  --icon-ajuda: #14B8A6;
  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
  --shadow-xl: 0 20px 40px rgba(0,0,0,0.12);
  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  /* Spacing */
  --sp-xs: 4px;
  --sp-sm: 8px;
  --sp-md: 12px;
  --sp-lg: 16px;
  --sp-xl: 24px;
  --sp-2xl: 32px;
  --sp-3xl: 48px;
  /* Layout */
  --sidebar-width: 240px;
  --header-height: 60px;
  --container-max: 1280px;
  --app-max-width: 1440px;
  /* Transitions */
  --transition: 0.2s ease;
  --transition-spring: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* === DARK MODE === */
[data-theme="dark"] {
  --primary: #BAC3FF;
  --primary-container: #0532C3;
  --primary-hover: #D0D7FF;
  --on-primary: #001159;
  --on-primary-container: #DEE1FF;
  --primary-fixed: #DEE1FF;
  --secondary: #BFC6DC;
  --secondary-container: #3F4759;
  --on-secondary: #282F42;
  --tertiary: #BDC7DE;
  --tertiary-container: #3D475A;
  --background: #191C1D;
  --surface: #2E3132;
  --surface-dim: #121415;
  --surface-container: #1E2122;
  --surface-container-high: #282B2C;
  --surface-container-low: #1A1D1E;
  --surface-variant: #3A3D3E;
  --on-surface: #E1E3E4;
  --on-surface-variant: #C5C5D7;
  --on-background: #E1E3E4;
  --outline: #8F909F;
  --outline-variant: #444655;
  --border: #3A3D3E;
  --input-border: #555;
  --error: #FFB4AB;
  --error-container: #93000A;
  --success: #34D399;
  --success-light: #064E3B;
  --warning: #FBBF24;
  --warning-light: #78350F;
  --info: #60A5FA;
  --info-light: #1E3A5F;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.3);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.4);
  --shadow-xl: 0 20px 40px rgba(0,0,0,0.5);

  /* Icon hover colors adaptados para Dark Mode */
  --icon-dashboard: #818CF8;
  --icon-pdv: #34D399;
  --icon-produtos: #A78BFA;
  --icon-categorias: #FBBF24;
  --icon-fornecedores: #22D3EE;
  --icon-estoque: #38BDF8;
  --icon-relatorios: #F472B6;
  --icon-usuarios: #FB923C;
  --icon-configuracoes: #94A3B8;
  --icon-ajuda: #2DD4BF;
}