/* ==========================================================================
   CLINIX DESIGN TOKENS — v1
   2026-06-23 · território Confiança Calorosa
   fonte: products/clinix/branding/clinix_brand_guide_v1.html
   Importe em global.css ou aplique diretamente em :root.
   Namespace --cx-* (não confundir com --xt-* da Xtory).
   ========================================================================== */

:root {
  /* ---------- Cores ---------- */
  /* Teal: marca, confiança, acento primário. Vai em quase tudo. */
  --cx-teal:        #0e7c6c;
  --cx-teal-700:    #0a5d50;   /* texto sobre teal, hover, ênfase */
  --cx-teal-100:    #e4f3ef;   /* fundos de card, chips, destaques calmos */

  /* Coral: AÇÃO apenas. Botão principal, ponto do símbolo, CTA. Nunca espalhado. */
  --cx-coral:       #ff6f5e;
  --cx-coral-700:   #e85544;   /* hover de ação */
  --cx-coral-100:   #ffe9e5;   /* fundo suave de ação, raríssimo */

  --cx-ink:         #13211d;   /* texto principal, seções invertidas */
  --cx-ink-soft:    #4a5752;   /* parágrafo corrido */
  --cx-ink-faint:   #8a938e;   /* labels, meta-text, legendas */
  --cx-ink-mute:    #a7afaa;

  --cx-paper:       #fbfaf7;   /* fundo principal, off-white morno. Nunca branco puro. */
  --cx-card:        #ffffff;   /* cards sobre paper */
  --cx-rule:        #ece8e0;   /* linhas divisórias, contornos */
  --cx-rule-soft:   #f1eee8;

  /* Semânticos (UI). --cx-danger é estado de erro, NÃO cor de marca. */
  --cx-success:     #1f8a4c;
  --cx-success-bg:  #e9f6ee;
  --cx-danger:      #c4302b;
  --cx-danger-bg:   #fdecea;
  --cx-warn:        #b8841a;
  --cx-warn-bg:     #fdf3dd;

  /* ---------- Tipografia ---------- */
  /* Uma família só, do título ao corpo. O contraste vem do peso e da caixa. */
  --cx-font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --cx-text-xs:   0.72rem;
  --cx-text-sm:   0.85rem;
  --cx-text-base: 1rem;
  --cx-text-lg:   1.2rem;
  --cx-text-xl:   1.7rem;
  --cx-text-2xl:  2.2rem;
  --cx-text-hero: 3rem;

  --cx-tracking-tight:  -0.04em;   /* display, wordmark */
  --cx-tracking-snug:   -0.02em;   /* títulos */
  --cx-tracking-normal: 0;
  --cx-tracking-caps:   0.18em;    /* labels uppercase */

  --cx-weight-regular:  400;
  --cx-weight-medium:   500;
  --cx-weight-semibold: 600;
  --cx-weight-bold:     700;
  --cx-weight-black:    800;       /* display, wordmark */

  /* ---------- Espaçamento (escala 4px) ---------- */
  --cx-space-1:  0.25rem;
  --cx-space-2:  0.5rem;
  --cx-space-3:  0.75rem;
  --cx-space-4:  1rem;
  --cx-space-6:  1.5rem;
  --cx-space-8:  2rem;
  --cx-space-12: 3rem;
  --cx-space-16: 4rem;

  /* ---------- Radii (cliniX é arredondado) ---------- */
  --cx-radius-sm:   8px;
  --cx-radius-md:   12px;    /* botão, input */
  --cx-radius-lg:   16px;    /* card */
  --cx-radius-full: 999px;   /* chip, pill, selo */

  /* ---------- Motion ---------- */
  --cx-ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --cx-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --cx-dur-fast:    150ms;
  --cx-dur-base:    280ms;
  --cx-dur-slow:    600ms;

  /* ---------- Shadows (suaves) ---------- */
  --cx-shadow-card:  0 4px 14px rgba(19,33,29,0.06);
  --cx-shadow-float: 0 12px 34px rgba(19,33,29,0.09);
  --cx-shadow-coral: 0 6px 16px rgba(255,111,94,0.30);   /* só no botão de ação */
}

/* Fonte. Para web rápida; em produto/PDF, embuta o woff2 com @font-face em vez deste @import. */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
