/*
 * Design tokens — gerado por packages/ui/tokens/build-tokens.mjs
 * NAO EDITAR A MAO. Altere os JSON em packages/ui/tokens/ e rode: npm run tokens:build
 *
 * Este arquivo e ADITIVO: define apenas custom properties (--ds-*). Nenhuma regra aqui
 * altera estilo existente, entao carrega-lo nao regride nada. O tema escuro so redefine
 * variaveis dentro de um bloco de preferencia/atributo — sem efeito ate um componente usar.
 *
 * Camadas: primitivo (valor cru) -> semantico (uso). Componentes usam SEMPRE o semantico.
 * A marca de cada tenant sobrescreve --ds-semantic-* em runtime.
 */

/* Camada 1 — primitivos */
:root {
  --ds-color-white: #ffffff;
  --ds-color-gray-50: #f8fafc;
  --ds-color-gray-100: #f1f5f9;
  --ds-color-gray-200: #e2e8f0;
  --ds-color-gray-300: #cbd5e1;
  --ds-color-gray-400: #94a3b8;
  --ds-color-gray-500: #64748b;
  --ds-color-gray-600: #475569;
  --ds-color-gray-700: #334155;
  --ds-color-gray-800: #1e293b;
  --ds-color-gray-900: #0f172a;
  --ds-color-gray-950: #020617;
  --ds-color-brand-50: #eef4ff;
  --ds-color-brand-100: #dbe7ff;
  --ds-color-brand-200: #bcd2ff;
  --ds-color-brand-300: #8fb3ff;
  --ds-color-brand-400: #5b8cff;
  --ds-color-brand-500: #2f6bf0;
  --ds-color-brand-600: #1f52c9;
  --ds-color-brand-700: #1a419e;
  --ds-color-brand-800: #17367e;
  --ds-color-brand-900: #122a61;
  --ds-color-success-50: #ecfdf3;
  --ds-color-success-500: #12874a;
  --ds-color-success-700: #0b5f34;
  --ds-color-warning-50: #fff8e6;
  --ds-color-warning-500: #9a6100;
  --ds-color-warning-700: #7a4c00;
  --ds-color-danger-50: #fef2f2;
  --ds-color-danger-500: #c0281f;
  --ds-color-danger-700: #941f18;
  --ds-color-info-50: #eef6ff;
  --ds-color-info-500: #1f5fb0;
  --ds-color-info-700: #174a8a;
  --ds-space-0: 0px;
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 24px;
  --ds-space-6: 32px;
  --ds-space-7: 48px;
  --ds-space-8: 64px;
  --ds-radius-sm: 4px;
  --ds-radius-md: 8px;
  --ds-radius-lg: 12px;
  --ds-radius-pill: 999px;
  --ds-font-family-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ds-font-size-xs: 12px;
  --ds-font-size-sm: 13px;
  --ds-font-size-md: 14px;
  --ds-font-size-base: 16px;
  --ds-font-size-lg: 18px;
  --ds-font-size-xl: 22px;
  --ds-font-size-2xl: 28px;
  --ds-font-size-3xl: 36px;
  --ds-font-weight-regular: 400;
  --ds-font-weight-medium: 500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-bold: 700;
  --ds-font-line-height-tight: 1.2;
  --ds-font-line-height-snug: 1.35;
  --ds-font-line-height-normal: 1.5;
  --ds-font-line-height-relaxed: 1.65;
  --ds-shadow-xs: 0px 1px 2px 0px #0f172a14;
  --ds-shadow-sm: 0px 1px 3px 0px #0f172a1f;
  --ds-shadow-md: 0px 4px 12px -2px #0f172a24;
  --ds-shadow-lg: 0px 12px 28px -6px #0f172a2e;
  --ds-motion-duration-instant: 90ms;
  --ds-motion-duration-fast: 140ms;
  --ds-motion-duration-normal: 200ms;
  --ds-motion-duration-slow: 320ms;
  --ds-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --ds-motion-easing-enter: cubic-bezier(0, 0, 0.2, 1);
  --ds-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
  --ds-size-touch-target: 44px;
  --ds-size-control-height: 40px;
  --ds-size-control-height-compact: 32px;
  --ds-size-bottom-nav-height: 60px;
  --ds-size-sidebar-width: 248px;
  --ds-size-content-max: 1280px;
  --ds-z-base: 0;
  --ds-z-sticky: 10;
  --ds-z-dropdown: 100;
  --ds-z-overlay: 200;
  --ds-z-modal: 300;
  --ds-z-toast: 400;
  --ds-z-tooltip: 500;
}

/* Camada 2 — semanticos (tema claro, padrao) */
:root {
  --ds-semantic-surface: var(--ds-color-white);
  --ds-semantic-surface-raised: var(--ds-color-white);
  --ds-semantic-surface-sunken: var(--ds-color-gray-50);
  --ds-semantic-surface-muted: var(--ds-color-gray-100);
  --ds-semantic-border: var(--ds-color-gray-200);
  --ds-semantic-border-strong: var(--ds-color-gray-500);
  --ds-semantic-text: var(--ds-color-gray-900);
  --ds-semantic-text-muted: var(--ds-color-gray-600);
  --ds-semantic-text-subtle: var(--ds-color-gray-500);
  --ds-semantic-text-inverted: var(--ds-color-white);
  --ds-semantic-action: var(--ds-color-brand-600);
  --ds-semantic-action-hover: var(--ds-color-brand-700);
  --ds-semantic-action-subtle: var(--ds-color-brand-50);
  --ds-semantic-focus-ring: var(--ds-color-brand-600);
  --ds-semantic-success: var(--ds-color-success-500);
  --ds-semantic-success-subtle: var(--ds-color-success-50);
  --ds-semantic-success-text: var(--ds-color-success-700);
  --ds-semantic-warning: var(--ds-color-warning-500);
  --ds-semantic-warning-subtle: var(--ds-color-warning-50);
  --ds-semantic-warning-text: var(--ds-color-warning-700);
  --ds-semantic-danger: var(--ds-color-danger-500);
  --ds-semantic-danger-subtle: var(--ds-color-danger-50);
  --ds-semantic-danger-text: var(--ds-color-danger-700);
  --ds-semantic-info: var(--ds-color-info-500);
  --ds-semantic-info-subtle: var(--ds-color-info-50);
  --ds-semantic-info-text: var(--ds-color-info-700);
  --ds-semantic-overlay: #0f172a99;
  --ds-semantic-skeleton: var(--ds-color-gray-200);
  --ds-semantic-text-on-action: var(--ds-color-white);
  --ds-semantic-text-action: var(--ds-color-brand-600);
}

/* Camada 2 — semanticos (tema escuro por preferencia do sistema) */
@media (prefers-color-scheme: dark) {
  :root:not([data-ds-theme="light"]) {
    --ds-semantic-surface: var(--ds-color-gray-900);
    --ds-semantic-surface-raised: var(--ds-color-gray-800);
    --ds-semantic-surface-sunken: var(--ds-color-gray-950);
    --ds-semantic-surface-muted: var(--ds-color-gray-800);
    --ds-semantic-border: var(--ds-color-gray-800);
    --ds-semantic-border-strong: var(--ds-color-gray-400);
    --ds-semantic-text: var(--ds-color-gray-50);
    --ds-semantic-text-muted: var(--ds-color-gray-300);
    --ds-semantic-text-subtle: var(--ds-color-gray-400);
    --ds-semantic-text-inverted: var(--ds-color-white);
    --ds-semantic-action: var(--ds-color-brand-300);
    --ds-semantic-action-hover: var(--ds-color-brand-200);
    --ds-semantic-action-subtle: var(--ds-color-brand-900);
    --ds-semantic-focus-ring: var(--ds-color-brand-300);
    --ds-semantic-success: var(--ds-color-success-500);
    --ds-semantic-success-subtle: #0b2e1c;
    --ds-semantic-success-text: #7ee2a8;
    --ds-semantic-warning: var(--ds-color-warning-500);
    --ds-semantic-warning-subtle: #3a2a05;
    --ds-semantic-warning-text: #f0c76a;
    --ds-semantic-danger: var(--ds-color-danger-500);
    --ds-semantic-danger-subtle: #3d1210;
    --ds-semantic-danger-text: #f4a49e;
    --ds-semantic-info: var(--ds-color-info-500);
    --ds-semantic-info-subtle: #0d2a44;
    --ds-semantic-info-text: #8ec2f0;
    --ds-semantic-overlay: #020617cc;
    --ds-semantic-skeleton: var(--ds-color-gray-800);
    --ds-semantic-text-on-action: var(--ds-color-gray-900);
    --ds-semantic-text-action: var(--ds-color-brand-300);
  }
}

/* Camada 2 — semanticos (tema escuro explicito, vence a preferencia) */
[data-ds-theme="dark"] {
  --ds-semantic-surface: var(--ds-color-gray-900);
  --ds-semantic-surface-raised: var(--ds-color-gray-800);
  --ds-semantic-surface-sunken: var(--ds-color-gray-950);
  --ds-semantic-surface-muted: var(--ds-color-gray-800);
  --ds-semantic-border: var(--ds-color-gray-800);
  --ds-semantic-border-strong: var(--ds-color-gray-400);
  --ds-semantic-text: var(--ds-color-gray-50);
  --ds-semantic-text-muted: var(--ds-color-gray-300);
  --ds-semantic-text-subtle: var(--ds-color-gray-400);
  --ds-semantic-text-inverted: var(--ds-color-white);
  --ds-semantic-action: var(--ds-color-brand-300);
  --ds-semantic-action-hover: var(--ds-color-brand-200);
  --ds-semantic-action-subtle: var(--ds-color-brand-900);
  --ds-semantic-focus-ring: var(--ds-color-brand-300);
  --ds-semantic-success: var(--ds-color-success-500);
  --ds-semantic-success-subtle: #0b2e1c;
  --ds-semantic-success-text: #7ee2a8;
  --ds-semantic-warning: var(--ds-color-warning-500);
  --ds-semantic-warning-subtle: #3a2a05;
  --ds-semantic-warning-text: #f0c76a;
  --ds-semantic-danger: var(--ds-color-danger-500);
  --ds-semantic-danger-subtle: #3d1210;
  --ds-semantic-danger-text: #f4a49e;
  --ds-semantic-info: var(--ds-color-info-500);
  --ds-semantic-info-subtle: #0d2a44;
  --ds-semantic-info-text: #8ec2f0;
  --ds-semantic-overlay: #020617cc;
  --ds-semantic-skeleton: var(--ds-color-gray-800);
  --ds-semantic-text-on-action: var(--ds-color-gray-900);
  --ds-semantic-text-action: var(--ds-color-brand-300);
}

/* Acessibilidade: respeita quem pediu menos movimento. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --ds-motion-duration-instant: 1ms;
    --ds-motion-duration-fast: 1ms;
    --ds-motion-duration-normal: 1ms;
    --ds-motion-duration-slow: 1ms;
  }
}