/* TOMETIS design tokens.
   Brand colours: ~/TOMARTEC/tometis/output/brand-kit-v1/brand-tokens.css (v1.1).
   Console UI tokens: copied verbatim from the TOMETIS web app (apps/web/app/globals.css, @theme + dark theme).
   Only the "App extensions" block is local, and it derives from the tokens above with color-mix. */
:root {
  /* Brand (logo assets carry these colours; do not recolour logos with UI tokens) */
  --tom-ink: #111318;
  --tom-primary: #087F46;
  --tom-coral: #D95D56;
  --tom-white: #FFFFFF;

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --console-canvas: #f6f8f7;
  --console-surface: #ffffff;
  --console-subtle: #eff3f1;
  --console-sidebar: #fbfcfb;
  --console-border: #dfe3e8;
  --console-divider: #eceef1;
  --console-ink: #111318;
  --console-ink-secondary: #4f5968;
  --console-ink-muted: #636d80;
  --console-accent: #087f46;
  --console-accent-hover: #076f3e;
  --console-accent-soft: #eaf7f0;
  --console-danger: #c62a1e;
  --console-warning: #b26a00;
  --console-success: #087f46;

  --console-space-1: 4px;
  --console-space-2: 8px;
  --console-space-3: 12px;
  --console-space-4: 16px;
  --console-space-6: 24px;
  --console-space-8: 32px;
  --console-space-12: 48px;

  --console-font-size-page-title: 20px;
  --console-font-size-section-title: 14px;
  --console-font-size-body: 13px;
  --console-font-size-table-header: 11px;
  --console-font-size-metric: 22px;
  --console-font-weight-page-title: 700;
  --console-font-weight-section-title: 650;
  --console-font-weight-control: 600;
  --console-font-weight-table-header: 650;
  --console-font-weight-metric: 700;
  --console-line-height-page-title: 1.3;
  --console-line-height-body: 1.5;
  --console-letter-spacing-page-title: -0.025em;

  --console-radius-panel: 8px;
  --console-radius-control: 6px;
  --console-radius-pill: 999px;
  --console-topbar-height: 52px;
  --console-main-padding: 24px;
  --console-control-height: 36px;
  --console-control-touch-height: 44px;
  --console-row-height: 40px;
  --console-cell-padding-inline: 12px;
  --console-section-gap: 24px;

  --console-focus-color: color-mix(in srgb, var(--console-accent) 32%, transparent);
  --console-focus-width: 3px;
  --console-focus-ring: 0 0 0 3px var(--console-focus-color);
  --console-focus-offset: 2px;
  --console-motion-duration-fast: 150ms;
  --console-motion-duration: 180ms;
  --console-motion-duration-slow: 200ms;
  --console-motion-ease: cubic-bezier(.22, 1, .36, 1);

  --color-brand: var(--console-accent);
  --color-brand-hover: var(--console-accent-hover);
  --color-brand-tint: var(--console-accent-soft);
  --color-brand-tint-border: color-mix(in srgb, var(--console-accent) 32%, var(--console-border));
  --color-on-brand-solid: #ffffff;

  --color-page: var(--console-canvas);
  --color-sheet: var(--console-surface);
  --color-subtle: var(--console-subtle);
  --color-border: var(--console-border);
  --color-divider: var(--console-divider);
  --color-divider-strong: var(--console-border);
  --color-ink: var(--console-ink);
  --color-ink-2: var(--console-ink-secondary);
  --color-ink-3: var(--console-ink-muted);
  --color-input-border: var(--console-border);
  --color-code: var(--console-subtle);

  --color-danger: var(--console-danger);
  --color-danger-tint: #fdecec;
  --color-success: var(--console-success);
  --color-success-tint: var(--console-accent-soft);
  --color-warn: var(--console-warning);
  --color-warn-tint: #fdf3d7;

  /* App extensions (derived, not new brand colours) */
  --color-border-strong: color-mix(in srgb, var(--color-ink) 18%, var(--color-border));
  --color-success-border: color-mix(in srgb, var(--color-success) 32%, var(--color-border));
  --color-warn-border: color-mix(in srgb, var(--color-warn) 32%, var(--color-border));
  --color-danger-border: color-mix(in srgb, var(--color-danger) 32%, var(--color-border));
  --shadow-menu: 0 6px 8px color-mix(in srgb, var(--color-ink) 10%, transparent);
  --shadow-modal: 0 16px 40px color-mix(in srgb, var(--color-ink) 18%, transparent);
  --overlay: rgb(0 0 0 / 55%);
}

/* Motion: TOM guideline v1.1 (brand-kit-v1/brand-motion.css), exposed under the transitions.dev
   token names so recipes can be pasted unchanged. */
:root {
  --tom-motion-stagger: 40ms;
  --tom-motion-micro: 80ms;
  --tom-motion-quick: 150ms;
  --tom-motion-fast: 250ms;
  --tom-motion-medium: 350ms;
  --tom-motion-slow: 400ms;
  --tom-motion-very-slow: 500ms;
  --tom-motion-ease-surface: cubic-bezier(0.22, 1, 0.36, 1);

  --duration-stagger: var(--tom-motion-stagger);
  --duration-micro: var(--tom-motion-micro);
  --duration-quick: var(--tom-motion-quick);
  --duration-fast: var(--tom-motion-fast);
  --duration-medium: var(--tom-motion-medium);
  --duration-slow: var(--tom-motion-slow);
  --duration-very-slow: var(--tom-motion-very-slow);
  --ease-smooth-out: var(--tom-motion-ease-surface);
  --ease-in-out: ease-in-out;
  --ease-out: ease-out;
  --ease-linear: linear;

  /* Recipe variables (transitions.dev 02, 05, 06, 09, 22) */
  --icon-swap-dur: var(--duration-fast);
  --icon-swap-blur: 2px;
  --icon-swap-start-scale: 0.25;
  --icon-swap-ease: var(--ease-in-out);
  --digit-dur: var(--duration-very-slow);
  --digit-distance: 8px;
  --digit-stagger: 70ms;
  --digit-blur: 2px;
  --digit-ease: cubic-bezier(0.34, 1.45, 0.64, 1);
  --modal-open-dur: var(--duration-fast);
  --modal-close-dur: var(--duration-quick);
  --modal-scale: 0.96;
  --modal-ease: var(--ease-smooth-out);
  --dropdown-open-dur: var(--duration-fast);
  --dropdown-close-dur: var(--duration-quick);
  --dropdown-pre-scale: 0.97;
  --dropdown-closing-scale: 0.99;
  --dropdown-ease: var(--ease-smooth-out);
  --toast-open: var(--duration-medium);
  --toast-close: var(--duration-fast);
  --toast-distance: 16px;
  --toast-blur: 2px;
  --toast-scale: 0.97;
  --toast-ease: var(--ease-smooth-out);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --tom-motion-stagger: 0ms;
    --tom-motion-micro: 0ms;
    --tom-motion-quick: 0ms;
    --tom-motion-fast: 0ms;
    --tom-motion-medium: 0ms;
    --tom-motion-slow: 0ms;
    --tom-motion-very-slow: 0ms;
  }
}