/* Geist (Vercel/basement.studio) — SIL Open Font License 1.1, ver fonts/GEIST-OFL-LICENSE.txt.
   Arquivo local: funciona sem internet. A fonte exata das referências não é verificável
   pela captura; Geist é a aproximação adotada (docs/07 §3). */
@font-face { font-family: "Geist"; src: url("../fonts/Geist-Variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/GeistMono-Variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

/* =========================================================================
   Clínica 360 — Design tokens v0.3 (direção Netflow + menu expansível)
   Amostras extraídas de referencias/01-netflow-painel.png e 02-menu-expansivel.png
   (valores aproximados; ver docs/07 §3). Camadas:
     1. Escala e semântica fixa (estados, foco) — não muda com white label
     2. Ação (preto), acento do painel (laranja) e acento do menu (azul)
     3. Tema claro (observado) e escuro (menu observado; painel = adaptação)
   ========================================================================= */

:root, [data-theme="light"] {
  color-scheme: light;
  /* ---- Tipografia ---- */
  --font-sans: "Geist", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --font-mono: "Geist Mono", "Cascadia Mono", Consolas, monospace;
  --fs-xs: 0.8125rem; --fs-sm: 0.875rem; --fs-md: 1rem; --fs-lg: 1.125rem; --fs-xl: 1.5rem; --fs-2xl: 1.75rem; --fs-hero: 2rem;
  --lh-tight: 1.2; --lh-normal: 1.5;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;

  /* ---- Espaço / raio ---- */
  --s-0: 0; --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 0.75rem; --s-4: 1rem; --s-5: 1.25rem; --s-6: 1.5rem; --s-8: 2rem; --s-10: 2.5rem; --s-12: 3rem;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 22px; --r-shell: 28px; --r-pill: 999px;

  /* ---- Controles ---- */
  --control-h: 2.5rem; --control-h-sm: 2rem; --touch-min: 2.75rem;

  /* ---- Movimento (centralizado; valores propostos, a validar — docs/10) ---- */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --ease-inout: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-hover: 120ms;     /* cor/borda/sombra */
  --dur-fast: 120ms;
  --dur-route: 160ms;     /* troca de área: fade + 6px */
  --dur-toast: 160ms;
  --dur-dialog: 160ms;    /* fade + scale .98→1 */
  --dur-overlay: 150ms;
  --dur-drawer: 210ms;    /* entrada lateral */
  --dur-menu: 240ms;      /* expandir/recolher menu */
  --dur-theme: 150ms;
  --dur-base: 200ms;
  --move-route: 6px;
  --move-toast: 8px;
  --scale-dialog: 0.98;

  /* ---- Neutros (claro) ---- */
  --n-0: #ffffff; --n-25: #fafafa; --n-50: #f5f5f5; --n-100: #efefef; --n-200: #e7e7e7; --n-300: #d4d4d4;
  --n-500: #6b6b6b; --n-600: #545454; --n-800: #262626; --n-900: #111111;

  /* ---- Fundo externo e shell flutuante ---- */
  --backdrop: linear-gradient(180deg, #bcd9f5 0%, #d9e9f8 46%, #e4efe0 78%, #cfe3c4 100%); /* fallback provisório: céu/gramado sem imagem */
  --backdrop-image: none;          /* asset paisagístico licenciado (pendente) */
  --shell-bg: #f5f5f5;
  --shell-border: rgba(255, 255, 255, 0.75);
  --shell-ring: rgba(255, 255, 255, 0.55);
  --shell-shadow: 0 24px 60px rgba(20, 40, 70, 0.16);

  /* ---- Semânticos de superfície e texto ---- */
  --c-bg: var(--shell-bg);
  --c-surface: #ffffff;
  --c-surface-2: #fafafa;
  --c-surface-sunken: #f2f2f2;
  --c-border: #ebebeb;
  --c-border-strong: #8a8a8a;      /* ≥3:1 para limites de campos */
  --c-text: #111111;
  --c-text-muted: #545454;
  --c-text-subtle: #6b6b6b;        /* 4.9:1 sobre #f5f5f5 */
  --c-text-inverse: #ffffff;
  --c-overlay: rgba(17, 17, 17, 0.38);
  --c-focus: #1d4ed8;
  --focus-ring: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-focus);

  /* ---- Elevação (painel usa sombras quase nulas) ---- */
  --e-0: none;
  --e-1: 0 1px 2px rgba(0, 0, 0, 0.03);
  --e-2: 0 8px 24px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
  --e-3: 0 24px 56px rgba(0, 0, 0, 0.18), 0 6px 14px rgba(0, 0, 0, 0.08);
  --e-lift: 0 14px 30px rgba(0, 0, 0, 0.14);

  /* ---- Ação principal (preto do painel) ---- */
  --brand: #111111;
  --brand-strong: #2b2b2b;
  --brand-contrast: #ffffff;
  --brand-soft: #efefef;
  --brand-soft-text: #111111;
  --brand-gradient: linear-gradient(135deg, #1b1b1b 0%, #000 100%);

  /* ---- Acento do painel (laranja) — white label "cor de destaque" ---- */
  --accent-vivid: #ec681e;        /* decorativo: logo, barras, ícones (3.2:1, só gráfico) */
  --accent: #c94510;              /* fundo de botão com texto branco (≥4.5:1) */
  --accent-strong: #a8390d;
  --accent-contrast: #ffffff;
  --accent-soft: #fff1e8;
  --accent-soft-text: #a8390d;
  --accent-gradient: linear-gradient(90deg, #c94510 0%, #c22f5c 100%);

  /* ---- Acento do menu (azul) — white label "cor do menu" ---- */
  --nav-vivid: #1d77ff;           /* botão circular, ícone ativo (gráfico) */
  --nav: #1668e3;                 /* fundo de badge/tooltip com texto branco */
  --nav-contrast: #ffffff;
  --nav-soft: #e4efff;            /* item ativo */
  --nav-soft-text: #1a5fd0;       /* 5.0:1 sobre --nav-soft */
  --nav-profile-bg: #e6eeff;
  --nav-icon: #848791;
  --nav-text: #4b4e57;
  --nav-surface: #ffffff;
  --nav-divider: #ececec;

  /* ---- Estados (fixos) ---- */
  --c-success: #15803d; --c-success-bg: #e8f8ee; --c-success-border: #b6e6c6; --c-success-vivid: #0cb833;
  --c-warning: #a14a00; --c-warning-bg: #fff4e0; --c-warning-border: #f6d29a;
  --c-danger: #b42318;  --c-danger-bg: #fdecea;  --c-danger-border: #f4b4ad; --c-danger-strong: #912018;
  --c-info: #1d5fbf;    --c-info-bg: #e8f2ff;    --c-info-border: #b7d3fb;  --c-info-vivid: #2c8af5;
  --c-neutral: #545454; --c-neutral-bg: #f2f2f2; --c-neutral-border: #e3e3e3;

  /* ---- Situações da agenda (mapeadas do quadro: cinza / laranja / azul / verde) ---- */
  --st-agendado-bg: #ffffff;   --st-agendado-bar: #a3a3a3;
  --st-chegou-bg: #eef5ff;     --st-chegou-bar: #2c8af5;
  --st-atend-bg: #fff3ea;      --st-atend-bar: #e65224;
  --st-encerrado-bg: #edfaf1;  --st-encerrado-bar: #0cb833;
  --st-saida-bg: #f5f5f5;      --st-saida-bar: #6b6b6b;
  --st-falta-bg: #fdecea;      --st-falta-bar: #b42318;
  --st-cancelado-bg: #f5f5f5;  --st-cancelado-bar: #d4d4d4;
  --block-bg: repeating-linear-gradient(135deg, #f0f0f0 0 8px, #e8e8e8 8px 16px);

  --tooth-fill: #ffffff;
}

/* ---- Tema escuro: menu conforme captura; painel = adaptação coerente (não observada) ---- */
:root[data-theme="dark"], [data-theme="dark"] {
  color-scheme: dark;
  --backdrop: linear-gradient(180deg, #1c2333 0%, #283042 60%, #222a38 100%);
  --shell-bg: #17161f;
  --shell-border: rgba(255, 255, 255, 0.08);
  --shell-ring: rgba(255, 255, 255, 0.05);
  --shell-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
  --c-surface: #211f2b;
  --c-surface-2: #1c1b25;
  --c-surface-sunken: #2a2836;
  --c-border: #33313f;
  --c-border-strong: #7c7a8a;
  --c-text: #f2f2f5;
  --c-text-muted: #c4c4cc;
  --c-text-subtle: #a1a1aa;
  --c-overlay: rgba(0, 0, 0, 0.55);
  --c-focus: #7aaeff;
  --e-1: none;
  --e-2: 0 8px 24px rgba(0, 0, 0, 0.45);
  --e-3: 0 24px 56px rgba(0, 0, 0, 0.6);
  --e-lift: 0 14px 30px rgba(0, 0, 0, 0.55);
  --brand: #f2f2f5; --brand-strong: #ffffff; --brand-contrast: #111111; --brand-soft: #2f2d3b; --brand-soft-text: #f2f2f5;
  --accent-soft: #3a2418; --accent-soft-text: #ffad7f;
  --nav-soft: #1e2c49; --nav-soft-text: #7aaeff; --nav-profile-bg: #15141b; --nav-icon: #b7b8c2; --nav-text: #c7c8d0;
  --nav-surface: #1f1d2a; --nav-divider: #3d3b45;
  --c-success: #6fdc92; --c-success-bg: #163222; --c-success-border: #245a38;
  --c-warning: #ffc169; --c-warning-bg: #3a2a12; --c-warning-border: #6b4a1a;
  --c-danger: #ff9b91;  --c-danger-bg: #3d1a17;  --c-danger-border: #6d2a24; --c-danger-strong: #ffb4ab;
  --c-info: #8fbfff;    --c-info-bg: #172741;    --c-info-border: #2a4a7a;
  --c-neutral: #c4c4cc; --c-neutral-bg: #2a2836; --c-neutral-border: #3a3846;
  --st-agendado-bg: #262431;  --st-chegou-bg: #19263d; --st-atend-bg: #33221a; --st-encerrado-bg: #172b20;
  --st-saida-bg: #22212b;     --st-falta-bg: #3a1c19;  --st-cancelado-bg: #22212b; --st-cancelado-bar: #55535f;
  --block-bg: repeating-linear-gradient(135deg, #24222e 0 8px, #2b2937 8px 16px);
  --tooth-fill: #2a2836;
}

[data-density="compacta"] { --control-h: var(--control-h-sm); }
@media (pointer: coarse) { :root { --control-h: var(--touch-min); } }

/* Movimento reduzido: sem deslocamento/escala, durações mínimas; estados continuam visíveis */
@media (prefers-reduced-motion: reduce) {
  :root { --move-route: 0px; --move-toast: 0px; --scale-dialog: 1; --dur-route: 1ms; --dur-drawer: 1ms; --dur-dialog: 1ms; --dur-menu: 1ms; --dur-toast: 1ms; --dur-overlay: 1ms; --dur-theme: 1ms; }
}
:root[data-motion="reduzido"] { --move-route: 0px; --move-toast: 0px; --scale-dialog: 1; --dur-route: 1ms; --dur-drawer: 1ms; --dur-dialog: 1ms; --dur-menu: 1ms; --dur-toast: 1ms; --dur-overlay: 1ms; --dur-theme: 1ms; }
@media (forced-colors: active) { :root { --focus-ring: 0 0 0 3px Highlight; } }

[data-theme] { color: var(--c-text); }
