/* Kukki Ops UI Design Tokens — Fase 1
   Import this file once at app/root level, then consume var(--kui-*) in components. */

:root {
  color-scheme: light;

  /* Brand and semantic colors */
  --kui-primary: #5b5cf6;
  --kui-primary-hover: #4849df;
  --kui-primary-soft: #ececff;
  --kui-primary-contrast: #ffffff;

  --kui-success: #14804a;
  --kui-success-soft: #e8f7ef;
  --kui-warning: #b7791f;
  --kui-warning-soft: #fff7df;
  --kui-danger: #c2413b;
  --kui-danger-soft: #ffefed;
  --kui-info: #2563eb;
  --kui-info-soft: #eaf2ff;

  /* Surfaces */
  --kui-bg: #f7f8fb;
  --kui-surface: #ffffff;
  --kui-surface-muted: #f1f3f7;
  --kui-surface-raised: #ffffff;
  --kui-border: #dfe3ea;
  --kui-border-strong: #c7ceda;

  /* Text */
  --kui-text: #182033;
  --kui-text-muted: #5f6b7a;
  --kui-text-subtle: #7a8594;
  --kui-text-inverse: #ffffff;

  /* Focus */
  --kui-ring: #8b8cf8;
  --kui-ring-offset: #ffffff;

  /* Typography */
  --kui-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --kui-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --kui-text-xs: 0.75rem;
  --kui-text-sm: 0.875rem;
  --kui-text-md: 1rem;
  --kui-text-lg: 1.125rem;
  --kui-text-xl: 1.25rem;
  --kui-text-2xl: 1.5rem;
  --kui-leading-tight: 1.2;
  --kui-leading-normal: 1.5;

  /* Spacing */
  --kui-space-1: 0.25rem;
  --kui-space-2: 0.5rem;
  --kui-space-3: 0.75rem;
  --kui-space-4: 1rem;
  --kui-space-5: 1.25rem;
  --kui-space-6: 1.5rem;
  --kui-space-8: 2rem;
  --kui-space-10: 2.5rem;
  --kui-space-12: 3rem;

  /* Shape and elevation */
  --kui-radius-sm: 0.375rem;
  --kui-radius-md: 0.5rem;
  --kui-radius-lg: 0.75rem;
  --kui-radius-xl: 1rem;
  --kui-radius-full: 9999px;
  --kui-shadow-sm: 0 1px 2px rgb(24 32 51 / 0.06), 0 1px 1px rgb(24 32 51 / 0.04);
  --kui-shadow-md: 0 8px 24px rgb(24 32 51 / 0.10);

  /* Layout */
  --kui-sidebar-width: 16.5rem;
  --kui-topbar-height: 4rem;
  --kui-content-max: 90rem;

  /* Motion */
  --kui-duration-fast: 120ms;
  --kui-duration-normal: 180ms;
  --kui-ease-standard: cubic-bezier(0.2, 0, 0, 1);
}

[data-theme="dark"] {
  color-scheme: dark;
  --kui-primary: #9b9cff;
  --kui-primary-hover: #b5b6ff;
  --kui-primary-soft: #252652;
  --kui-primary-contrast: #111427;

  --kui-success: #55d58f;
  --kui-success-soft: #123423;
  --kui-warning: #f4c152;
  --kui-warning-soft: #3a2b0c;
  --kui-danger: #ff817a;
  --kui-danger-soft: #3d1715;
  --kui-info: #89b4ff;
  --kui-info-soft: #132a4f;

  --kui-bg: #0d1020;
  --kui-surface: #15192b;
  --kui-surface-muted: #1c2135;
  --kui-surface-raised: #1a1f33;
  --kui-border: #2b334a;
  --kui-border-strong: #3a4560;

  --kui-text: #f4f7fb;
  --kui-text-muted: #b8c1d1;
  --kui-text-subtle: #8d98aa;
  --kui-text-inverse: #0d1020;
  --kui-ring: #b5b6ff;
  --kui-ring-offset: #0d1020;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --kui-duration-fast: 1ms;
    --kui-duration-normal: 1ms;
  }
}