/*
 * Design System Forge — theme.css
 * Project: colber-admin
 * Personality: Enterprise Calm
 * Generated: 2026-05-19
 *
 * Single source of CSS variables consumed by all pages and components.
 * Dark theme is the BASE — apply .dark to <html> or root element.
 * Light theme overrides on .light or :root without .dark.
 */

/* ─────────────────────────────────────────────
   COR — DIVERGÊNCIA INTENCIONAL E PERMANENTE do
   docs/colber-admin/design-system/theme.css do fornecedor.

   A paleta deste app é a identidade do Instituto Humanitas — papel quente,
   texto marrom, acento terracota — e não o azul "Enterprise Calm" do
   boilerplate. Os valores foram transcritos do CSS de produção do site
   institucional (formacaoclinicosistemica.lovable.app), que já publica seus
   tokens em oklch; a derivação de cada valor que o site não tem (status,
   gráficos, avatares, sidebar, tema escuro, alto contraste) está registrada
   em openspec/changes/align-brand-palette/design.md.

   Ao receber um drop novo do fornecedor: reconcilie ESTRUTURA — nomes de
   token, conjunto de papéis semânticos, espaçamento, raio, tipografia,
   sombra, movimento, --font-size-root — e NÃO traga as cores dele de volta.
   Um token de cor novo no drop entra aqui com valor derivado desta paleta.

   Toda cor com matiz do produto mora neste arquivo. Nenhum outro CSS, view
   ou script deve escrever oklch()/hex/rgb() — só var(--color-*) ou
   color-mix() sobre um destes tokens. Acromáticos de sombra e overlay
   (oklch(0 0 0 / α)) são a única exceção, porque não carregam marca.

   Depois de qualquer alteração aqui: npm run check:contrast
   ───────────────────────────────────────────── */

/* ─────────────────────────────────────────────
   Fonts — INTENTIONAL DIVERGENCE from the vendor's design-system/theme.css

   The vendor file declares @font-face rules pointing at ./fonts/*.woff2,
   relative to design-system/. This project instead loads Lexend and JetBrains
   Mono from public/css/fonts.css (@fontsource files under public/fonts/),
   which partials/head.ejs includes before this file.

   Neither the vendor's @font-face block nor the Google Fonts @import this file
   used to carry belongs here: the @import was a blocking CDN request, and a
   blocked or slow response silently falls back to the OS sans-serif with
   completely different metrics — the exact failure fonts.css was written to
   remove. Do not reintroduce either on the next package drop.
   ───────────────────────────────────────────── */

/* ─────────────────────────────────────────────
   Light Mode (default / :root)
   ───────────────────────────────────────────── */
:root {
  /* ── Colors — Semantic ───────────────────
     Transcritos do site (--paper / --paper-alt / --paper-light /
     --foreground / --border / --ring / --destructive), exceto onde anotado. */
  --color-background:             oklch(0.957 0.018 80);  /* site --paper */
  --color-foreground:             oklch(0.295 0.028 50);  /* site --foreground */
  /* site: 0.523. Escurecido 1.8pt de L porque o texto de .badge-primary sobre
     a própria tinta de 15% media 4.24:1; a 0.505 vai a 4.54:1. */
  --color-primary:                oklch(0.505 0.058 55);
  --color-primary-foreground:     oklch(0.975 0.012 82);  /* site --paper-light */
  --color-secondary:              oklch(0.927 0.022 78);  /* site --paper-alt */
  --color-secondary-foreground:   oklch(0.295 0.028 50);
  /* --accent aqui é a SUPERFÍCIE de hover do shadcn, emparelhada com
     --accent-foreground — não o terracota saturado que o site chama de
     accent. Esse foi para --color-ring / --color-sidebar-primary / --chart-1,
     que é onde o site também o usa. */
  --color-accent:                 oklch(0.925 0.030 60);
  --color-accent-foreground:      oklch(0.295 0.028 50);
  --color-muted:                  oklch(0.927 0.022 78);  /* site --paper-alt */
  /* site: 0.568. Escurecido porque media 4.46:1 sobre a superfície muted. */
  --color-muted-foreground:       oklch(0.510 0.020 60);
  --color-border:                 oklch(0.850 0.016 78);  /* site --border */
  /* Limite de CONTROLE, distinto da régua decorativa acima.
     A WCAG 1.4.11 pede 3:1 do contorno de um controle; de uma divisória, nada.
     --color-border mede 1.40:1 contra o fundo — fiel ao site do Instituto, que
     mede o mesmo — e continua assim de propósito para cartões, tabelas e
     réguas. Pedir a um único valor que sirva aos dois deixaria as divisórias
     pesadas: escurecer --color-border até 3:1 exige L≈0.62, e o resultado
     contraria "Enterprise Calm" e a identidade.
     Medido com a própria matemática de scripts/check-contrast.js:
     L=0.620 dá 3.21 contra --color-background e 3.39 contra --color-card.
     L=0.635 também passaria (3.03) mas fica a um arredondamento da falha. */
  --color-control-border:         oklch(0.620 0.016 78);
  /* NÃO é o --input do site. Lá esse token é a COR DA BORDA do campo
     (convenção shadcn) e vale o mesmo que --border; aqui --color-input é
     usado só como SUPERFÍCIE — fundo das caixas de OTP e do campo de
     login-otp, que também levam `border: 1px solid var(--color-border)`.
     Com o valor do site, preenchimento e borda ficariam idênticos e a borda
     desapareceria dentro do próprio fundo: a caixa vira um retângulo chapado
     em vez de um campo delineado. Fica entre --color-border (0.850) e
     --color-card (0.975), repetindo a RELAÇÃO do fornecedor (0.88 de input
     sob 0.96 de card), não o número dele. */
  --color-input:                  oklch(0.910 0.020 78);
  --color-ring:                   oklch(0.595 0.082 47);  /* site --ring/--accent */
  --color-card:                   oklch(0.975 0.012 82);  /* site --paper-light */
  --color-card-foreground:        oklch(0.295 0.028 50);
  --color-popover:                oklch(0.975 0.012 82);
  --color-popover-foreground:     oklch(0.295 0.028 50);
  --color-destructive:            oklch(0.505 0.170 28);  /* site --destructive */
  --color-destructive-foreground: oklch(0.975 0.012 82);
  /* Derivados: o site é um one-pager e não tem estado de sistema. Verde e
     âmbar de croma reduzido para conviverem com a paleta quente, na
     luminosidade que passa 4.5:1 como texto de badge sobre a própria tinta. */
  --color-success:                oklch(0.480 0.100 150);
  --color-success-foreground:     oklch(0.975 0.012 82);
  --color-warning:                oklch(0.500 0.105 75);
  /* Era o marrom de texto. Com warning em L=0.50, texto escuro por cima
     falharia; papel claro por cima dá 5.69:1. */
  --color-warning-foreground:     oklch(0.975 0.012 82);
  /* info = primary, como o boilerplate já fazia: não há azul na paleta e
     inventar uma sexta matiz só para "informação" não acrescenta sinal. */
  --color-info:                   oklch(0.505 0.058 55);
  --color-info-foreground:        oklch(0.975 0.012 82);

  /* ── Sidebar (always dark — exceção intencional do DNA) ──
     Continua escura em todos os temas; a escuridão passa a ser marrom, não
     azul. Base tirada do marrom do rodapé do site (~#332822). */
  --color-sidebar-background:     oklch(0.240 0.020 55);
  --color-sidebar-foreground:     oklch(0.940 0.012 80);
  --color-sidebar-primary:        oklch(0.720 0.090 47);  /* terracota clareado p/ fundo escuro */
  --color-sidebar-accent:         oklch(0.310 0.024 55);  /* superfície de hover */
  --color-sidebar-border:         oklch(0.340 0.020 55);
  /* Camada secundária da sidebar: rótulos de seção, sub-itens, chevrons.
     Subiu de 0.700 para 0.780 junto com o clareamento dos itens de menu —
     em 0.700 lia como texto desabilitado sobre o marrom escuro. */
  --color-sidebar-muted:          oklch(0.780 0.016 60);

  /* ── Rampa de avatares (fallback de iniciais em /users) ──
     Era um array literal de 6 oklch() dentro das views, um deles roxo
     (h=300), matiz removida do projeto. Agora é token, dentro da família
     quente, todos com >= 4.5:1 para a inicial branca por cima. */
  --color-avatar-1:               oklch(0.520 0.075 45);
  --color-avatar-2:               oklch(0.500 0.080 25);
  --color-avatar-3:               oklch(0.480 0.075 145);
  --color-avatar-4:               oklch(0.510 0.080 70);
  --color-avatar-5:               oklch(0.470 0.060 15);
  --color-avatar-6:               oklch(0.500 0.045 100);
  /* A inicial por cima da tinta. Papel claro em vez de branco puro, e token
     em vez de `color: white` literal em três regras de ds-patterns.css.
     Claro por função nos dois temas: as tintas acima não são redeclaradas
     em .dark, então a inicial não pode escurecer junto com o tema. */
  --color-avatar-foreground:      oklch(0.975 0.012 82);

  /* ── Knob do .ds-switch ──
     Era `background: white` fixo — branco puro aparece como um ponto frio
     numa UI de papel creme. É claro por FUNÇÃO, não por tema: precisa
     contrastar com a trilha tanto desligado (--color-muted) quanto ligado
     (--color-primary), nos dois temas. Por isso é token próprio e não
     --color-card (que no tema escuro é escuro e faria o knob desaparecer
     dentro da trilha desligada, ambas em L=0.250). */
  --color-switch-knob:            oklch(0.975 0.012 82);

  /* ── shadcn/ui variable mapping (required) ─ */
  --background:                   var(--color-background);
  --foreground:                   var(--color-foreground);
  --primary:                      var(--color-primary);
  --primary-foreground:           var(--color-primary-foreground);
  --secondary:                    var(--color-secondary);
  --secondary-foreground:         var(--color-secondary-foreground);
  --muted:                        var(--color-muted);
  --muted-foreground:             var(--color-muted-foreground);
  --accent:                       var(--color-accent);
  --accent-foreground:            var(--color-accent-foreground);
  --destructive:                  var(--color-destructive);
  --destructive-foreground:       var(--color-destructive-foreground);
  --border:                       var(--color-border);
  --input:                        var(--color-input);
  --ring:                         var(--color-ring);
  --card:                         var(--color-card);
  --card-foreground:              var(--color-card-foreground);
  --popover:                      var(--color-popover);
  --popover-foreground:           var(--color-popover-foreground);

  /* ── shadcn Sidebar mapping ──────────────── */
  --sidebar-background:           var(--color-sidebar-background);
  --sidebar-foreground:           var(--color-sidebar-foreground);
  --sidebar-primary:              var(--color-sidebar-primary);
  --sidebar-primary-foreground:   var(--color-sidebar-foreground);
  --sidebar-accent:               var(--color-sidebar-accent);
  --sidebar-accent-foreground:    var(--color-sidebar-foreground);
  --sidebar-border:               var(--color-sidebar-border);
  --sidebar-ring:                 var(--color-sidebar-primary);

  /* ── Chart colors ──────────────────────────
     Paleta categórica de 5 — exceção já concedida por design-rules.md.
     Quatro quentes; --chart-5 é um azul-petróleo de croma baixo porque não
     existe quinta matiz distinguível dentro da faixa quente, e cinco
     variações só de luminosidade leriam como escala sequencial (ordem),
     não como categoria. Fora da faixa roxa proibida e dessaturado o
     suficiente para não parecer o azul do boilerplate voltando.
     Todos os 10 pares passam a separação mínima (>=25° de matiz ou
     >=0.12 de L) e todos atingem 3:1 contra o fundo claro. */
  --chart-1: oklch(0.585 0.090 47);   /* terracota da marca */
  --chart-2: oklch(0.620 0.095 150);  /* verde sálvia */
  --chart-3: oklch(0.630 0.130 80);   /* âmbar */
  --chart-4: oklch(0.470 0.110 20);   /* barro/vinho */
  --chart-5: oklch(0.600 0.055 215);  /* petróleo dessaturado */

  /* ── Typography ──────────────────────────── */
  --font-family-heading: 'Lexend', system-ui, sans-serif;
  --font-family-body:    'Lexend', system-ui, sans-serif;
  --font-family-mono:    'JetBrains Mono', 'Fira Code', monospace;

  --font-display:  2.25rem / 1.15  700  var(--font-family-heading);
  --font-heading:  1.5rem  / 1.25  600  var(--font-family-heading);
  --font-title:    1.125rem / 1.35 600  var(--font-family-body);
  --font-body:     0.875rem / 1.55 400  var(--font-family-body);
  --font-caption:  0.75rem  / 1.45 400  var(--font-family-body);

  --tracking-display: -0.025em;
  --tracking-heading: -0.015em;
  --tracking-title:   -0.010em;
  --tracking-body:     0em;
  --tracking-caption:  0.01em;

  /* ── Radius ──────────────────────────────── */
  --radius-none: 0px;
  --radius-xs:   0.125rem;
  --radius-sm:   0.25rem;
  --radius-md:   0.375rem;
  --radius-lg:   0.5rem;
  --radius-xl:   0.75rem;
  --radius-full: 9999px;

  /* shadcn radius mapping */
  --radius: var(--radius-md);

  /* ── Spacing ─────────────────────────────── */
  --spacing-1:  0.25rem;
  --spacing-2:  0.5rem;
  --spacing-3:  0.75rem;
  --spacing-4:  1rem;
  --spacing-5:  1.25rem;
  --spacing-6:  1.5rem;
  --spacing-8:  2rem;
  --spacing-10: 2.5rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-20: 5rem;
  --spacing-24: 6rem;

  /* ── Shadows ─────────────────────────────── */
  --shadow-none: none;
  --shadow-sm:   0 1px 3px oklch(0 0 0 / 0.25);
  --shadow-md:   0 4px 12px oklch(0 0 0 / 0.30);
  --shadow-lg:   0 8px 24px oklch(0 0 0 / 0.35);
  --shadow-xl:   0 16px 40px oklch(0 0 0 / 0.40);

  /* ── Motion ──────────────────────────────── */
  --duration-fast:   120ms;
  --duration-normal: 200ms;
  --duration-slow:   400ms;
  --ease-default:    cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in:         cubic-bezier(0.4, 0, 1, 1);
  --ease-out:        cubic-bezier(0, 0, 0.2, 1);

  /* ── Density (default = compact) ─────────── */
  --density-scale: 0.75;

  /* ── Root font-size — sets compact density. MUST stay on html, not body:
     every --spacing-* / --radius- * token above is in rem, relative to this. ── */
  --font-size-root: 0.875rem;
}

/* ─────────────────────────────────────────────
   Dark Mode
   ───────────────────────────────────────────── */
/* O site institucional não tem tema escuro — este é DERIVADO da paleta, não
   copiado dela, e não é a inversão do tema claro: em fundo escuro a tinta de
   15% de um badge é MAIS CLARA que o card, então os acentos precisam SUBIR de
   luminosidade, não descer. Os quatro assentaram em ~0.72, varridos até
   passarem o pior caso (texto do badge sobre a própria tinta).

   Superfícies ficam mais quentes e menos contrastadas que o azul-quase-preto
   anterior (0.13 → 0.210 de fundo), o que combina com "papel" melhor do que
   um preto profundo. */
.dark {
  --color-background:             oklch(0.210 0.018 55);
  --color-foreground:             oklch(0.940 0.012 80);
  --color-primary:                oklch(0.720 0.085 50);
  /* Os *-foreground dos acentos passam a ser ESCUROS. Antes eram claros, o
     que funcionava com acentos em L~0.55-0.58; com os acentos em 0.72 um
     rótulo claro por cima cairia para ~2.2:1. */
  --color-primary-foreground:     oklch(0.200 0.018 55);
  --color-secondary:              oklch(0.275 0.022 55);
  --color-secondary-foreground:   oklch(0.940 0.012 80);
  --color-accent:                 oklch(0.300 0.026 55);
  --color-accent-foreground:      oklch(0.940 0.012 80);
  --color-muted:                  oklch(0.250 0.020 55);
  --color-muted-foreground:       oklch(0.720 0.016 60);
  --color-border:                 oklch(0.320 0.020 55);
  /* No escuro a borda de controle SOBE, não desce: separar-se de um fundo
     escuro é clarear. 0.550 dá 3.64 contra o fundo e 3.29 contra o cartão. */
  --color-control-border:         oklch(0.550 0.020 55);
  --color-input:                  oklch(0.275 0.022 55);
  --color-ring:                   oklch(0.720 0.085 47);
  --color-card:                   oklch(0.250 0.020 55);
  --color-card-foreground:        oklch(0.940 0.012 80);
  --color-popover:                oklch(0.275 0.022 55);
  --color-popover-foreground:     oklch(0.940 0.012 80);
  --color-destructive:            oklch(0.720 0.150 28);
  --color-destructive-foreground: oklch(0.200 0.018 55);
  --color-success:                oklch(0.700 0.110 150);
  --color-success-foreground:     oklch(0.200 0.018 55);
  --color-warning:                oklch(0.720 0.120 75);
  --color-warning-foreground:     oklch(0.200 0.018 55);
  --color-info:                   oklch(0.720 0.085 50);
  --color-info-foreground:        oklch(0.200 0.018 55);

  /* Chart colors em dark mode — mesmas matizes do tema claro, clareadas para
     o fundo escuro, mantendo a separação entre séries. */
  --chart-1: oklch(0.680 0.090 47);
  --chart-2: oklch(0.700 0.095 150);
  --chart-3: oklch(0.760 0.130 80);
  --chart-4: oklch(0.620 0.110 20);
  --chart-5: oklch(0.700 0.055 215);
}

/* ─────────────────────────────────────────────
   High Contrast Mode
   ───────────────────────────────────────────── */
/* Estrutura preto/branco puro preservada; só as cores de acento saem do azul
   para o âmbar quente da família da marca. --color-primary aqui é
   oklch(0.800 0.110 55) = 10.93:1 sobre preto. */
.high-contrast {
  --color-background:             oklch(0.00 0.000 0);
  --color-foreground:             oklch(1.00 0.000 0);
  --color-primary:                oklch(0.800 0.110 55);
  --color-primary-foreground:     oklch(0.00 0.000 0);
  --color-secondary:              oklch(0.08 0.000 0);
  --color-secondary-foreground:   oklch(1.00 0.000 0);
  --color-accent:                 oklch(0.14 0.000 0);
  --color-accent-foreground:      oklch(1.00 0.000 0);
  --color-muted:                  oklch(0.08 0.000 0);
  --color-muted-foreground:       oklch(0.85 0.000 0);
  --color-border:                 oklch(0.70 0.000 0);
  /* O alto contraste JÁ passava: 7.86 contra o fundo. Herda o mesmo valor em
     vez de receber um próprio — mudança sem defeito ainda é mudança. */
  --color-control-border:         oklch(0.70 0.000 0);
  --color-input:                  oklch(0.14 0.000 0);
  --color-ring:                   oklch(1.00 0.000 0);
  --color-card:                   oklch(0.08 0.000 0);
  --color-card-foreground:        oklch(1.00 0.000 0);
  --color-popover:                oklch(0.14 0.000 0);
  --color-popover-foreground:     oklch(1.00 0.000 0);
  --color-destructive:            oklch(0.80 0.220 025);
  --color-destructive-foreground: oklch(0.00 0.000 0);
  --color-success:                oklch(0.80 0.180 145);
  --color-success-foreground:     oklch(0.00 0.000 0);
  --color-warning:                oklch(0.90 0.180 075);
  --color-warning-foreground:     oklch(0.00 0.000 0);
  --color-info:                   oklch(0.800 0.110 55);
  --color-info-foreground:        oklch(0.00 0.000 0);

  /* Sidebar em high contrast */
  --color-sidebar-background:     oklch(0.00 0.000 0);
  --color-sidebar-foreground:     oklch(1.00 0.000 0);
  --color-sidebar-primary:        oklch(0.800 0.110 55);
  --color-sidebar-border:         oklch(0.70 0.000 0);
  /* Precisa ser redeclarada: a de :root (0.310, marrom) sobre o fundo preto
     puro deste tema seria uma superfície de hover quase invisível. */
  --color-sidebar-accent:         oklch(0.14 0.000 0);
  --color-sidebar-muted:          oklch(0.85 0.000 0);
  --color-switch-knob:            oklch(1.00 0.000 0);
}

/* ─────────────────────────────────────────────
   Density Modifiers
   ───────────────────────────────────────────── */
[data-density="compact"]  { --density-scale: 0.75; }
[data-density="default"]  { --density-scale: 1; }
[data-density="spacious"] { --density-scale: 1.25; }

/* ─────────────────────────────────────────────
   Base Styles
   ───────────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
  border-color: var(--color-border);
}

html {
  font-family: var(--font-family-body);
  font-size: var(--font-size-root); /* MUST stay here, not body — see note above */
  background-color: var(--color-background);
  color: var(--color-foreground);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ─────────────────────────────────────────────
   Reduced Motion
   ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
