/* ==========================================================================
   Hospital Seara do Bem — Design Tokens
   Fonte: wireframe aprovado (T0 Shell + T4 Serviço), Sistema B.
   Extraído por medição direta do arquivo .dc.html aprovado — não são
   valores inventados. Nenhum componente deve usar hex literal: sempre var().
   ========================================================================== */

:root{

  /* --- Teal institucional (Sistema B — extraído de material real da marca) --- */
  --teal-50:#EAF4F3;
  --teal-100:#CFE6E4;
  --teal-200:#A5CFCC;
  --teal-300:#6FB0AC;
  --teal-400:#419490;
  --teal-500:#2D7A7B;   /* passa AA com texto branco: 5.02:1 */
  --teal-600:#25696A;
  --teal-700:#1B5A58;   /* navbar, botões, cards do Roteiro — 7.92:1 */
  --teal-800:#157067;
  --teal-900:#123F3D;   /* topbar, rodapé */

  /* --- Menta (só decorativo, nunca texto corrido sobre laranja) --- */
  --mint-100:#DFFCF8;
  --mint-300:#BDFAF3;
  --mint-500:#9EF8EE;
  --mint-700:#6FE0D2;

  /* --- Laranja institucional --- */
  --orange-100:#FDEBD9;
  --orange-300:#F7B36B;
  --orange-500:#F97316;  /* laranja vívido — NUNCA com texto branco: 2.80:1, falha AA. Com ink-900: 5.77:1 ✅ */
  --orange-600:#D06A05;
  --orange-700:#A85403;  /* botão Doe agora, badges — 5.34:1 */

  /* --- Semânticas --- */
  --danger:#C0392B;      /* card/faixa de emergência — 5.44:1 */
  --success:#2D7A7B;
  --warning:#E77708;
  --info:#419490;
  --whatsapp:#25D366;    /* padrão da plataforma, não é cor de marca */
  --blue-700:#1D5C99;    /* Roteiro — card Marcar/Consultar — 6.89:1 com branco */

  /* --- Neutros --- */
  --ink-900:#232020;
  --ink-700:#3A3838;
  --ink-500:#5A6363;
  --ink-300:#8D9797;
  --gray-100:#E6EAEA;
  --gray-50:#F1F4F4;
  --gray-25:#F8FAFA;
  --white:#FFFFFF;

  /* --- Exceção deliberada de acessibilidade ---
     O anel de foco e o indicador de página ativa usam o laranja do
     Sistema A (#F07C1A), não o --orange-700 nem o anel verde-água que o
     design system original sugeria. Motivo: foco precisa destacar contra
     uma interface dominada por verde — um anel verde-sobre-verde
     praticamente não aparece. Decisão registrada, não usar outra cor aqui. */
  --focus-color:#F07C1A;

  /* --- Tipografia --- */
  --font-display:'Red Hat Display', sans-serif;
  --font-body:'Red Hat Text', sans-serif;
  --font-mono:'Red Hat Mono', monospace;

  /* --- Espaçamento (base 4px) --- */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
  --space-9:96px; --space-10:128px;
  --container-max:1200px;
  --container-wide:1440px;
  --gutter:24px;
  --section-y:96px;
  --section-y-tight:64px;

  /* --- Raios — só estes valores no site inteiro ---
     8  = badge/chip pequeno
     12 = botão
     16 = card
     24 = mídia (reservado — nenhum template usa ainda)
     64 = painel de campanha — EXCLUSIVO de blocos de doação/filantropia,
          nunca em página de serviço ou institucional comum
     999 = pill / FAB circular */
  --radius-badge:8px;
  --radius-btn:12px;
  --radius-card:16px;
  --radius-media:24px;
  --radius-panel:64px;
  --radius-pill:999px;

  /* --- Sombra (esverdeada, nunca preto puro; card em repouso não tem sombra) --- */
  --shadow-xs:0 1px 2px rgba(18,63,61,.06);
  --shadow-sm:0 2px 8px rgba(18,63,61,.08);
  --shadow-md:0 8px 24px rgba(18,63,61,.10);
  --shadow-lg:0 18px 48px rgba(18,63,61,.14);

  /* --- Movimento --- */
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --dur-fast:140ms;
  --dur-base:240ms;
  --dur-slow:420ms;

  /* --- Camadas --- */
  --z-dropdown:100;
  --z-navbar:200;
  --z-fab:250;
  --z-drawer:300;
  --z-modal:500;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}
