/**
 * KADOSH — Design Tokens
 * Foundation layer. Tokens são valores brutos; componentes consomem-nos.
 * Portável: estes nomes mapeiam directamente para tokens de RN (StyleSheet)
 * ou para um theme provider (ex: styled-components/tamagui) sem reescrita.
 *
 * Convenção: --kds-{categoria}-{papel}-{intensidade?}
 */

:root {
  /* ── Brand ─────────────────────────────────────────────────── */
  --kds-brand-primary:       #2563EB;   /* azul Kadosh */
  --kds-brand-primary-fg:    #FFFFFF;
  --kds-brand-primary-hover: #1D4ED8;
  --kds-brand-primary-soft:  rgba(37,99,235,.12);
  --kds-brand-accent:        #06B6D4;   /* cyan */
  --kds-brand-accent-soft:   rgba(6,182,212,.14);

  /* ── Neutros (tema escuro como default — alinha c/ branding actual) */
  --kds-bg-app:        #0A0A0F;
  --kds-bg-surface:    #14141C;
  --kds-bg-surface-2:  #1C1C26;
  --kds-bg-surface-3:  #242432;
  --kds-bg-overlay:    rgba(0,0,0,.65);

  --kds-fg-primary:    #F5F5F7;
  --kds-fg-secondary:  rgba(245,245,247,.72);
  --kds-fg-tertiary:   rgba(245,245,247,.52);
  --kds-fg-muted:      rgba(245,245,247,.32);
  --kds-fg-inverse:    #0A0A0F;

  --kds-border-subtle:  rgba(255,255,255,.06);
  --kds-border-default: rgba(255,255,255,.10);
  --kds-border-strong:  rgba(255,255,255,.18);
  --kds-border-focus:   var(--kds-brand-primary);

  /* ── Semânticos ────────────────────────────────────────────── */
  --kds-success:       #22C55E;
  --kds-success-soft:  rgba(34,197,94,.14);
  --kds-warning:       #F59E0B;
  --kds-warning-soft:  rgba(245,158,11,.14);
  --kds-danger:        #EF4444;
  --kds-danger-soft:   rgba(239,68,68,.14);
  --kds-info:          #06B6D4;
  --kds-info-soft:     rgba(6,182,212,.14);

  /* ── Tipografia ────────────────────────────────────────────── */
  --kds-font-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --kds-font-display: 'Bebas Neue', 'Inter', sans-serif;
  --kds-font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Escala tipográfica (rem-based, base 16px) */
  --kds-text-2xs:  10px;
  --kds-text-xs:   12px;
  --kds-text-sm:   13px;
  --kds-text-md:   14px;
  --kds-text-base: 16px;
  --kds-text-lg:   18px;
  --kds-text-xl:   20px;
  --kds-text-2xl:  24px;
  --kds-text-3xl:  30px;
  --kds-text-4xl:  36px;
  --kds-text-5xl:  48px;

  --kds-weight-regular:  400;
  --kds-weight-medium:   500;
  --kds-weight-semibold: 600;
  --kds-weight-bold:     700;
  --kds-weight-black:    900;

  --kds-leading-tight: 1.2;
  --kds-leading-snug:  1.35;
  --kds-leading-base:  1.5;
  --kds-leading-loose: 1.7;

  --kds-tracking-tight:  -0.02em;
  --kds-tracking-normal: 0;
  --kds-tracking-wide:   0.04em;
  --kds-tracking-wider:  0.08em;

  /* ── Espaçamento (4px grid) ────────────────────────────────── */
  --kds-space-0:  0;
  --kds-space-1:  4px;
  --kds-space-2:  8px;
  --kds-space-3:  12px;
  --kds-space-4:  16px;
  --kds-space-5:  20px;
  --kds-space-6:  24px;
  --kds-space-8:  32px;
  --kds-space-10: 40px;
  --kds-space-12: 48px;
  --kds-space-16: 64px;
  --kds-space-20: 80px;

  /* ── Raios ─────────────────────────────────────────────────── */
  --kds-radius-xs:   4px;
  --kds-radius-sm:   6px;
  --kds-radius-md:   8px;
  --kds-radius-lg:   12px;
  --kds-radius-xl:   16px;
  --kds-radius-2xl:  20px;
  --kds-radius-full: 9999px;

  /* ── Sombras (escuras — alpha sobre fundo) ─────────────────── */
  --kds-shadow-xs: 0 1px 2px rgba(0,0,0,.32);
  --kds-shadow-sm: 0 2px 6px rgba(0,0,0,.36);
  --kds-shadow-md: 0 6px 18px rgba(0,0,0,.44);
  --kds-shadow-lg: 0 14px 40px rgba(0,0,0,.52);
  --kds-shadow-xl: 0 24px 60px rgba(0,0,0,.62);
  --kds-shadow-glow-primary: 0 0 0 3px rgba(37,99,235,.28);
  --kds-shadow-glow-danger:  0 0 0 3px rgba(239,68,68,.28);

  /* ── Transições ────────────────────────────────────────────── */
  --kds-ease-out:   cubic-bezier(.2,.7,.2,1);
  --kds-ease-in:    cubic-bezier(.6,0,.8,.3);
  --kds-ease-spring:cubic-bezier(.34,1.56,.64,1);

  --kds-dur-instant: 80ms;
  --kds-dur-fast:    140ms;
  --kds-dur-base:    220ms;
  --kds-dur-slow:    360ms;

  /* ── Z-Index escala ────────────────────────────────────────── */
  --kds-z-base:     0;
  --kds-z-sticky:   100;
  --kds-z-overlay:  500;
  --kds-z-modal:    1000;
  --kds-z-toast:    1500;
  --kds-z-tooltip:  2000;

  /* ── Layout ────────────────────────────────────────────────── */
  --kds-container-sm: 640px;
  --kds-container-md: 768px;
  --kds-container-lg: 1024px;
  --kds-container-xl: 1280px;

  --kds-header-h:    64px;
  --kds-bottomnav-h: 72px;
  --kds-sidebar-w:   280px;

  /* ── Touch targets (mobile-first) ──────────────────────────── */
  --kds-touch-min: 44px;
}

/* ── Dark mode é default. ──────────────────────────────────── */
/* ── Light mode: tokens com WCAG AA mínimo (4.5:1 texto/fundo) */
@media (prefers-color-scheme: light) {
  :root {
    /* Backgrounds */
    --kds-bg-app:        #F1F5F9;
    --kds-bg-surface:    #FFFFFF;
    --kds-bg-surface-2:  #F8FAFC;
    --kds-bg-surface-3:  #EEF2F8;
    --kds-bg-overlay:    rgba(0,0,0,.45);

    /* Foregrounds — contraste ≥ 4.5:1 sobre superfícies claras */
    --kds-fg-primary:    #0F172A;
    --kds-fg-secondary:  rgba(15,23,42,.72);
    --kds-fg-tertiary:   rgba(15,23,42,.55);
    --kds-fg-muted:      rgba(15,23,42,.38);
    --kds-fg-inverse:    #F1F5F9;

    /* Borders */
    --kds-border-subtle:  rgba(15,23,42,.07);
    --kds-border-default: rgba(15,23,42,.12);
    --kds-border-strong:  rgba(15,23,42,.22);
    --kds-border-focus:   var(--kds-brand-primary);

    /* Sombras — mais suaves em fundo claro */
    --kds-shadow-xs: 0 1px 3px rgba(0,0,0,.07);
    --kds-shadow-sm: 0 2px 8px rgba(0,0,0,.09);
    --kds-shadow-md: 0 6px 18px rgba(0,0,0,.11);
    --kds-shadow-lg: 0 14px 40px rgba(0,0,0,.13);
    --kds-shadow-xl: 0 24px 60px rgba(0,0,0,.16);
    --kds-shadow-glow-primary: 0 0 0 3px rgba(37,99,235,.20);
    --kds-shadow-glow-danger:  0 0 0 3px rgba(220,38,38,.20);

    /* Semânticos — ligeiramente mais escuros para contraste no claro */
    --kds-success:       #15803D;
    --kds-success-soft:  rgba(21,128,61,.10);
    --kds-warning:       #B45309;
    --kds-warning-soft:  rgba(180,83,9,.10);
    --kds-danger:        #DC2626;
    --kds-danger-soft:   rgba(220,38,38,.10);
    --kds-info:          #0369A1;
    --kds-info-soft:     rgba(3,105,161,.10);

    /* Brand soft — opacidade reduzida sobre branco */
    --kds-brand-primary-soft: rgba(37,99,235,.09);
    --kds-brand-accent-soft:  rgba(6,182,212,.10);
  }
}

/* ── Reduced motion ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  :root {
    --kds-dur-instant: 0ms;
    --kds-dur-fast:    0ms;
    --kds-dur-base:    0ms;
    --kds-dur-slow:    0ms;
  }
}