/* ==========================================================================
   A7SYSTEM — Design tokens
   Identidade A7 (logo: A branco + 7 vermelho sobre preto) aplicada a uma estrutura
   corporativa inspirada em Salesforce Lightning e SAP Fiori: shell grafite,
   vermelho de ação, neutros grafite, densidade de painel e superfícies em camadas.
   Toda cor da aplicação sai daqui; o modo escuro redefine os mesmos papéis.
   ========================================================================== */

/* A fonte Inter é carregada pelo index.html (com preconnect), não por @import. */

:root {
  color-scheme: light;

  /* Marca A7 — vermelho da logo sobre grafite */
  --brand: #d3181f;            /* ação primária, item ativo, foco */
  --brand-strong: #a91319;
  --brand-soft: #fdeced;       /* fundo de item selecionado */
  --brand-mark: #e3161c;       /* o "7" da logo */
  --link: #18181b;             /* links de registro: tinta forte + sublinhado vermelho */

  /* Estrutura (shell escuro, como o fundo da logo) */
  --shell-bg: #111113;
  --shell-fg: #f4f4f5;
  --shell-muted: #a1a1aa;
  --shell-hover: rgba(255, 255, 255, 0.08);
  --shell-input: rgba(255, 255, 255, 0.08);
  --shell-border: rgba(255, 255, 255, 0.1);
  --nav-bg: #18181b;
  --nav-fg: #d4d4d8;
  --nav-muted: #8b8b94;
  --nav-hover: rgba(255, 255, 255, 0.06);
  --nav-active-bg: rgba(227, 22, 28, 0.16);
  --nav-active-fg: #ffffff;

  /* Superfícies (neutros grafite) */
  --bg: #f4f4f5;
  --surface: #ffffff;
  --surface-2: #fafafa;
  --surface-3: #f1f1f3;
  --border: #e4e4e7;
  --border-strong: #cfcfd6;

  /* Texto */
  --text: #18181b;
  --text-2: #3f3f46;
  --muted: #5f5f69;
  --text-on-brand: #ffffff;

  /* Semânticas (status — sempre com ícone/rótulo, nunca só cor) */
  --success: #15803d;  --success-soft: #e7f6ec;
  --warning: #a15c07;  --warning-soft: #fdf3e1;
  --danger:  #b42318;  --danger-soft:  #fdecea;
  --info:    #1d5fb8;  --info-soft:    #e9f1fb;

  /* Cor de cada módulo (ícone do objeto, como no Lightning) */
  --obj-inicio: #27272a;
  --obj-comercial: #d3181f;
  --obj-financeiro: #15803d;
  --obj-suprimentos: #6d3fc8;
  --obj-estoque: #b45309;
  --obj-admin: #52525b;

  /* Séries de gráfico (validadas para daltonismo: slot 1 azul, slot 2 laranja) */
  --series-1: #2a78d6;
  --series-2: #eb6834;
  --chart-grid: #e8e8ec;

  /* Tipografia */
  --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-xs: 0.75rem;    /* 12 */
  --fs-sm: 0.8125rem;  /* 13 */
  --fs-base: 0.875rem; /* 14 — densidade de painel */
  --fs-md: 1rem;       /* 16 */
  --fs-lg: 1.125rem;   /* 18 */
  --fs-xl: 1.375rem;   /* 22 */
  --fs-2xl: 1.75rem;   /* 28 */

  /* Espaçamento (base 4) */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  --radius-sm: 4px;
  --radius: 6px;
  --radius-lg: 10px;
  --radius-full: 999px;

  --shadow-1: 0 1px 2px rgba(24, 24, 27, 0.05);
  --shadow-2: 0 4px 14px rgba(24, 24, 27, 0.08);
  --shadow-3: 0 18px 44px rgba(24, 24, 27, 0.2);
  --focus-ring: 0 0 0 3px rgba(211, 24, 31, 0.25);

  --header-h: 56px;
  --nav-w: 248px;
  --nav-w-collapsed: 64px;

  --t-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1);
  --t: 220ms cubic-bezier(0.4, 0, 0.2, 1);

  --z-dropdown: 1000; --z-sticky: 1020; --z-drawer-backdrop: 1025; --z-drawer: 1030;
  --z-modal-backdrop: 1040; --z-modal: 1050; --z-toast: 1060;

  --touch-target-min: 40px;

  /* ---- Aliases dos nomes antigos (telas e estilos legados) ---- */
  --color-primary: var(--brand);
  --color-primary-dark: var(--brand-strong);
  --color-primary-light: var(--brand-soft);
  --color-bg: var(--surface);
  --color-bg-secondary: var(--surface-2);
  --color-border: var(--border);
  --color-text: var(--text);
  --color-text-secondary: var(--muted);
  --color-success: var(--success);
  --color-success-light: var(--success-soft);
  --color-warning: var(--warning);
  --color-warning-light: var(--warning-soft);
  --color-danger: var(--danger);
  --color-danger-light: var(--danger-soft);
  --color-info: var(--info);
  --color-info-light: var(--info-soft);
  --font-size-xs: var(--fs-xs);
  --font-size-sm: var(--fs-sm);
  --font-size-base: var(--fs-base);
  --font-size-lg: var(--fs-lg);
  --font-size-xl: var(--fs-xl);
  --font-size-2xl: var(--fs-xl);
  --spacing-1: var(--sp-1); --spacing-2: var(--sp-2); --spacing-3: var(--sp-3);
  --spacing-4: var(--sp-4); --spacing-6: var(--sp-6); --spacing-8: var(--sp-8);
  --radius-md: var(--radius);
  --shadow-sm: var(--shadow-1);
  --shadow-md: var(--shadow-2);
  --shadow-lg: var(--shadow-2);
  --shadow-xl: var(--shadow-3);
  --transition-fast: var(--t-fast);
  --transition-normal: var(--t);
}

/* Modo escuro: hierarquia por superfície mais clara, não por sombra. */
@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) {
    color-scheme: dark;
    --brand: #e3262d; --brand-strong: #f0555a; --brand-soft: rgba(227, 38, 45, 0.16); --link: #f4f4f5;
    --shell-bg: #0a0a0b; --shell-fg: #f4f4f5; --shell-muted: #9a9aa3;
    --nav-bg: #111113; --nav-fg: #d4d4d8; --nav-muted: #85858e; --nav-hover: rgba(255, 255, 255, 0.05);
    --bg: #0c0c0e; --surface: #151518; --surface-2: #1a1a1e; --surface-3: #222227;
    --border: #2a2a30; --border-strong: #3a3a42;
    --text: #f1f1f3; --text-2: #d0d0d6; --muted: #a0a0aa; --text-on-brand: #ffffff;
    --success: #4ac486; --success-soft: rgba(74, 196, 134, 0.13);
    --warning: #f0b44c; --warning-soft: rgba(240, 180, 76, 0.13);
    --danger: #f2706a;  --danger-soft: rgba(242, 112, 106, 0.13);
    --info: #6aa7f0;    --info-soft: rgba(106, 167, 240, 0.13);
    --obj-inicio: #3f3f46; --obj-comercial: #e0262d; --obj-financeiro: #2f9e62; --obj-suprimentos: #8a63e0;
    --obj-estoque: #cf7a22; --obj-admin: #5f5f69;
    --series-1: #3987e5; --series-2: #d95926; --chart-grid: #26262c;
    --shadow-1: 0 0 0 1px rgba(255, 255, 255, 0.02);
    --shadow-2: 0 6px 18px rgba(0, 0, 0, 0.4);
    --shadow-3: 0 18px 48px rgba(0, 0, 0, 0.6);
    --focus-ring: 0 0 0 3px rgba(239, 58, 64, 0.35);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --brand: #e3262d; --brand-strong: #f0555a; --brand-soft: rgba(227, 38, 45, 0.16); --link: #f4f4f5;
  --shell-bg: #0a0a0b; --shell-fg: #f4f4f5; --shell-muted: #9a9aa3;
  --nav-bg: #111113; --nav-fg: #d4d4d8; --nav-muted: #85858e; --nav-hover: rgba(255, 255, 255, 0.05);
  --bg: #0c0c0e; --surface: #151518; --surface-2: #1a1a1e; --surface-3: #222227;
  --border: #2a2a30; --border-strong: #3a3a42;
  --text: #f1f1f3; --text-2: #d0d0d6; --muted: #a0a0aa; --text-on-brand: #ffffff;
  --success: #4ac486; --success-soft: rgba(74, 196, 134, 0.13);
  --warning: #f0b44c; --warning-soft: rgba(240, 180, 76, 0.13);
  --danger: #f2706a;  --danger-soft: rgba(242, 112, 106, 0.13);
  --info: #6aa7f0;    --info-soft: rgba(106, 167, 240, 0.13);
  --obj-inicio: #3f3f46; --obj-comercial: #e0262d; --obj-financeiro: #2f9e62; --obj-suprimentos: #8a63e0;
  --obj-estoque: #cf7a22; --obj-admin: #5f5f69;
  --series-1: #3987e5; --series-2: #d95926; --chart-grid: #26262c;
  --shadow-1: 0 0 0 1px rgba(255, 255, 255, 0.02);
  --shadow-2: 0 6px 18px rgba(0, 0, 0, 0.4);
  --shadow-3: 0 18px 48px rgba(0, 0, 0, 0.6);
  --focus-ring: 0 0 0 3px rgba(239, 58, 64, 0.35);
}