/* InFaktory design tokens — v1.0
   Light is the default. Apply data-theme="dark" on <html> or any container for dark.
   Fonts: Geist + Geist Mono, SIL Open Font License 1.1 (self-host for production). */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500&display=swap');

:root {
  /* Brand — fixed in both themes */
  --q-brand-ink: #0E1111;
  --q-brand-teal: #0E7C6B;
  --q-brand-teal-tint: #E6F3F0;
  --q-brand-teal-dark: #3FBFA8;
  --q-brand-teal-surface: #0E3530;
  --q-brand-deep-green: #1F4D47;

  /* Surfaces */
  --q-bg: #F4F6F5;
  --q-surface: #FFFFFF;
  --q-surface-raised: #FFFFFF;
  --q-surface-hover: #ECF0EF;
  --q-surface-sunken: #E9EDEC;
  --q-border: #D6DCDA;
  --q-border-strong: #848F8D;      /* 3.3:1 on white — form-control edges */

  /* Text */
  --q-text: #0E1111;               /* 17.5:1 on bg */
  --q-text-2: #56605E;             /* 6.0:1 on bg */
  --q-text-3: #6B7674;             /* 4.7:1 on white — placeholders, meta */
  --q-text-inverse: #FFFFFF;

  /* Actions */
  --q-primary: #0E7C6B;            /* white label 5.1:1 */
  --q-primary-hover: #0B6A5C;
  --q-primary-press: #095649;
  --q-primary-text: #FFFFFF;
  --q-secondary: #FFFFFF;
  --q-secondary-border: #848F8D;
  --q-secondary-hover: #ECF0EF;
  --q-secondary-text: #0E1111;
  --q-accent-text: #0B6A5C;        /* links, teal text on tint 5.7:1 */
  --q-selected: #E6F3F0;
  --q-selected-text: #0B6A5C;
  --q-focus: #0E7C6B;
  --q-focus-ring: 0 0 0 2px var(--q-bg), 0 0 0 4px var(--q-focus);
  --q-disabled-bg: #ECF0EF;
  --q-disabled-text: #8E9997;      /* disabled controls are exempt from WCAG contrast */

  /* AI processing — uses brand teal; never used for success */
  --q-ai: #0E7C6B;
  --q-ai-tint: #E6F3F0;
  --q-ai-unit-off: #D6DCDA;
  --q-ai-unit-on: #0E1111;
  --q-ai-unit-final: #0E7C6B;

  /* Semantic */
  --q-success: #2F7A1F;  --q-success-tint: #EAF4E4;
  --q-warning: #9A5B00;  --q-warning-tint: #FBF1DE;
  --q-error: #B42A22;    --q-error-tint: #FBEAE8;
  --q-info: #2B5F9E;     --q-info-tint: #E8EFF8;

  /* Typography */
  --q-font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --q-font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --q-weight-regular: 400; --q-weight-medium: 500; --q-weight-semibold: 600;

  --q-fs-display: clamp(44px, 5vw, 72px);  --q-lh-display: 1.0;  --q-ls-display: -0.035em;
  --q-fs-h1: clamp(34px, 3.4vw, 48px);     --q-lh-h1: 1.08;      --q-ls-h1: -0.03em;
  --q-fs-h2: clamp(26px, 2.4vw, 32px);     --q-lh-h2: 1.15;      --q-ls-h2: -0.02em;
  --q-fs-h3: 22px; --q-lh-h3: 1.25; --q-ls-h3: -0.015em;
  --q-fs-h4: 18px; --q-lh-h4: 1.3;  --q-ls-h4: -0.01em;
  --q-fs-h5: 15px; --q-lh-h5: 1.35; --q-ls-h5: -0.005em;
  --q-fs-h6: 13px; --q-lh-h6: 1.35; --q-ls-h6: 0;
  --q-fs-body-lg: 17px; --q-lh-body-lg: 1.55;
  --q-fs-body: 15px;    --q-lh-body: 1.55;
  --q-fs-body-sm: 13px; --q-lh-body-sm: 1.5;
  --q-fs-label: 13px;   --q-lh-label: 1.3;      /* weight 500 */
  --q-fs-caption: 12px; --q-lh-caption: 1.4;
  --q-fs-th: 11px;      --q-ls-th: 0.06em;      /* uppercase, weight 500 */
  --q-fs-data: 13px;    --q-lh-data: 1.4;       /* Geist Mono, tabular */
  --q-fs-data-sm: 12px;

  /* Space — 4px base */
  --q-space-0: 0; --q-space-1: 4px; --q-space-2: 8px; --q-space-3: 12px; --q-space-4: 16px;
  --q-space-5: 20px; --q-space-6: 24px; --q-space-8: 32px; --q-space-10: 40px;
  --q-space-12: 48px; --q-space-16: 64px; --q-space-20: 80px; --q-space-24: 96px;

  /* Shape — the system is square. Only OS-masked app icons and avatars round. */
  --q-radius-none: 0px;
  --q-radius-avatar: 50%;
  --q-unit-xs: 4px; --q-unit-sm: 6px; --q-unit-md: 8px; --q-unit-lg: 12px;

  /* Elevation */
  --q-shadow-0: none;
  --q-shadow-1: 0 1px 2px rgba(14, 17, 17, 0.08);
  --q-shadow-2: 0 4px 12px rgba(14, 17, 17, 0.10);
  --q-shadow-3: 0 12px 32px rgba(14, 17, 17, 0.16);   /* dialogs */

  /* Motion */
  --q-step: 120ms;            /* Tally unit step */
  --q-duration-fast: 120ms;   /* hover, press */
  --q-duration: 200ms;        /* menus, tabs */
  --q-duration-slow: 320ms;   /* dialogs, panels */
  --q-ease: cubic-bezier(0.2, 0, 0, 1);
  --q-ease-in: cubic-bezier(0.4, 0, 1, 1);

  /* Layout */
  --q-header-h: 52px;
  --q-subheader-h: 44px;
  --q-sidebar-w: 232px;
  --q-sidebar-w-collapsed: 56px;
  --q-row-h: 36px;
  --q-row-h-compact: 30px;
  --q-control-h: 32px;
  --q-control-h-sm: 28px;
  --q-control-h-lg: 40px;
  --q-content-max: 1440px;
  /* Breakpoints (reference — CSS vars can't drive media queries) */
  --q-bp-sm: 640px; --q-bp-md: 768px; --q-bp-lg: 1024px; --q-bp-xl: 1280px; --q-bp-2xl: 1536px;
}

[data-theme="dark"] {
  --q-bg: #0A0C0C;
  --q-surface: #131717;
  --q-surface-raised: #1A2020;
  --q-surface-hover: #1A2020;
  --q-surface-sunken: #0E1212;
  --q-border: #263030;
  --q-border-strong: #5F6C6A;
  --q-text: #E9EEED;
  --q-text-2: #94A09E;
  --q-text-3: #7F8B89;
  --q-text-inverse: #0A0C0C;
  --q-primary: #3FBFA8;
  --q-primary-hover: #5FD0BC;
  --q-primary-press: #2FA892;
  --q-primary-text: #0A0C0C;
  --q-secondary: #131717;
  --q-secondary-border: #5F6C6A;
  --q-secondary-hover: #1A2020;
  --q-secondary-text: #E9EEED;
  --q-accent-text: #3FBFA8;
  --q-selected: #0E3530;
  --q-selected-text: #3FBFA8;
  --q-focus: #3FBFA8;
  --q-disabled-bg: #1A2020;
  --q-disabled-text: #4A5655;
  --q-ai: #3FBFA8;
  --q-ai-tint: #0E3530;
  --q-ai-unit-off: #263030;
  --q-ai-unit-on: #E9EEED;
  --q-ai-unit-final: #3FBFA8;
  --q-success: #7CC46A;  --q-success-tint: #16301A;
  --q-warning: #E9B04F;  --q-warning-tint: #33270F;
  --q-error: #F07A6E;    --q-error-tint: #3A1A17;
  --q-info: #86ADE3;     --q-info-tint: #18263A;
  --q-shadow-1: 0 0 0 1px #263030;
  --q-shadow-2: 0 0 0 1px #263030, 0 4px 12px rgba(0, 0, 0, 0.4);
  --q-shadow-3: 0 0 0 1px #263030, 0 12px 32px rgba(0, 0, 0, 0.55);
}

html { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }
body { margin: 0; background: var(--q-bg); color: var(--q-text); font-family: var(--q-font-sans); font-size: var(--q-fs-body); line-height: var(--q-lh-body); -webkit-font-smoothing: antialiased; }
.q-num, td, th { font-variant-numeric: tabular-nums; }
.q-mono { font-family: var(--q-font-mono); font-variant-numeric: tabular-nums slashed-zero; }
:focus-visible { outline: none; box-shadow: var(--q-focus-ring); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } }
