/* ============================================================
 * Dietcon Design System — Tokens
 *
 * Fonte única de design tokens. Prefixo `--ds-*` evita colisão
 * com variáveis do tema Hyper (--ct-*) e com variáveis legadas
 * (--brand-*, --isa-*, --mentor-*, --primary, etc.).
 *
 * Não importar no base.html global durante a fase de fundação.
 * Importado apenas pelo app design_system (prototype preview).
 * ============================================================ */

:root {
  /* ---------- Color · Primary (indigo Dietcon #5865F2) ---------- */
  --ds-color-primary-50:  #EEF0FE;
  --ds-color-primary-100: #DCE1FD;
  --ds-color-primary-200: #BAC3FB;
  --ds-color-primary-300: #97A5F9;
  --ds-color-primary-400: #7887F6;
  --ds-color-primary-500: #5865F2;
  --ds-color-primary-600: #4752C4;
  --ds-color-primary-700: #374099;
  --ds-color-primary-800: #2A3174;
  --ds-color-primary-900: #1C2150;

  /* ---------- Color · Neutral (slate frio, tom clínico) ---------- */
  --ds-color-neutral-0:   #FFFFFF;
  --ds-color-neutral-50:  #F8FAFC;
  --ds-color-neutral-100: #F1F5F9;
  --ds-color-neutral-200: #E2E8F0;
  --ds-color-neutral-300: #CBD5E1;
  --ds-color-neutral-400: #94A3B8;
  --ds-color-neutral-500: #64748B;
  --ds-color-neutral-600: #475569;
  --ds-color-neutral-700: #334155;
  --ds-color-neutral-800: #1E293B;
  --ds-color-neutral-900: #0F172A;

  /* ---------- Color · Semantic ---------- */
  --ds-color-success-50:  #ECFDF5;
  --ds-color-success-100: #D1FAE5;
  --ds-color-success-500: #10B981;
  --ds-color-success-600: #059669;
  --ds-color-success-700: #047857;

  --ds-color-warning-50:  #FFFBEB;
  --ds-color-warning-100: #FEF3C7;
  --ds-color-warning-500: #F59E0B;
  --ds-color-warning-600: #D97706;
  --ds-color-warning-700: #B45309;

  --ds-color-danger-50:   #FEF2F2;
  --ds-color-danger-100:  #FEE2E2;
  --ds-color-danger-500:  #EF4444;
  --ds-color-danger-600:  #DC2626;
  --ds-color-danger-700:  #B91C1C;

  --ds-color-info-50:     #EFF6FF;
  --ds-color-info-100:    #DBEAFE;
  --ds-color-info-500:    #3B82F6;
  --ds-color-info-600:    #2563EB;
  --ds-color-info-700:    #1D4ED8;

  /* ---------- Color · Nutritional macros ---------- */
  /* Padrão nutricional convencional para chips P / C / G em planos alimentares */
  --ds-color-macro-protein: #E8833A;   /* laranja */
  --ds-color-macro-carb:    #D6A41C;   /* âmbar */
  --ds-color-macro-fat:     #6B8E23;   /* verde-oliva */

  /* ---------- Surface aliases ---------- */
  --ds-bg-app:        var(--ds-color-neutral-50);
  --ds-bg-surface:    var(--ds-color-neutral-0);
  --ds-bg-muted:      var(--ds-color-neutral-100);
  --ds-border-subtle: var(--ds-color-neutral-200);
  --ds-border-strong: var(--ds-color-neutral-300);

  /* ---------- Text aliases ---------- */
  --ds-text-primary:   var(--ds-color-neutral-900);
  --ds-text-secondary: var(--ds-color-neutral-600);
  --ds-text-muted:     var(--ds-color-neutral-500);
  --ds-text-inverse:   var(--ds-color-neutral-0);
  --ds-text-link:      var(--ds-color-primary-600);

  /* ---------- Typography — stack atual (Nunito via Hyper theme) ---------- */
  --ds-font-family-sans: var(--ct-font-sans-serif, "Nunito", sans-serif);
  --ds-font-family-mono: "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;

  --ds-font-size-xs:   12px;
  --ds-font-size-sm:   13px;
  --ds-font-size-md:   14px;  /* base */
  --ds-font-size-lg:   16px;
  --ds-font-size-xl:   18px;
  --ds-font-size-2xl:  22px;
  --ds-font-size-3xl:  28px;
  --ds-font-size-4xl:  34px;

  --ds-font-weight-regular:  400;
  --ds-font-weight-medium:   500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-bold:     700;

  --ds-line-height-tight: 1.25;
  --ds-line-height-base:  1.5;

  /* ---------- Spacing (base 4px) ---------- */
  --ds-space-0:  0;
  --ds-space-1:  4px;
  --ds-space-2:  8px;
  --ds-space-3:  12px;
  --ds-space-4:  16px;
  --ds-space-5:  20px;
  --ds-space-6:  24px;
  --ds-space-8:  32px;
  --ds-space-10: 40px;
  --ds-space-12: 48px;
  --ds-space-16: 64px;

  /* ---------- Radius ---------- */
  --ds-radius-sm:   6px;
  --ds-radius-md:   8px;
  --ds-radius-lg:   12px;
  --ds-radius-xl:   16px;
  --ds-radius-pill: 9999px;

  /* ---------- Shadow (sutis, clínico) ---------- */
  --ds-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --ds-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --ds-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
  --ds-shadow-lg: 0 12px 28px rgba(15, 23, 42, 0.10), 0 4px 10px rgba(15, 23, 42, 0.06);

  /* ---------- Focus ring ---------- */
  --ds-focus-ring: 0 0 0 3px rgba(88, 101, 242, 0.25);

  /* ---------- Motion ---------- */
  --ds-transition-fast: 120ms ease-out;
  --ds-transition-base: 180ms ease-out;

  /* ---------- Z-index ---------- */
  --ds-z-dropdown: 100;
  --ds-z-sticky:   200;
  --ds-z-modal:    900;
  --ds-z-toast:    950;
}