/* Salon Control OS — one token set, two themes.
 *
 * Operator (default --os-*): warm paper app.
 * Marketing (--mk-*, aliased as --lp-*): dark canvas for website + auth.
 * Product mocks on the marketing site keep --os-* so they match the app.
 *
 * Radius spine: inputs/buttons 8px, cards 11px, pills 999px.
 * Tailwind `rounded-os-*` must use these variables — do not hardcode a
 * second radius in tailwind.config.ts.
 *
 * public/os-tokens.css is a byte-identical copy for static landing/SEO
 * (they never load src/index.css). Keep the two files in sync.
 */

:root {
  --os-ink: #15140F;
  --os-ink-2: #3D3934;
  --os-muted: #A29D93;
  --os-muted-2: #8C877D;
  --os-line: #EAE7E1;
  --os-line-2: #EFEDE7;
  --os-soft: #F2F0EA;
  --os-bg: #EEECE7;
  --os-panel: #F7F6F3;
  --os-error: #B4574A;
  --os-positive: #4A6B4E;
  --os-warning-ink: #8A5D22;
  --os-warning-accent: #C98A3E;
  --os-chip: #57534A;
  --os-empty: #C4BFB5;
  --os-subtle: #FAF9F6;
  --os-track: #F3F1EC;
  --os-cal-sand: #f4ebdf;
  --os-cal-sage: #e7eee7;
  --os-cal-slate: #e6ecf0;
  --os-cal-blush: #f4e7ea;
  --os-cal-mint: #e6f5ef;

  --os-radius-input: 8px;
  --os-radius-button: 8px;
  --os-radius-card: 11px;
  --os-radius-pill: 999px;
  --os-shadow-card: 0 1px 2px rgba(21, 20, 15, 0.04), 0 4px 12px rgba(21, 20, 15, 0.03);
  --os-shadow-modal: 0 24px 60px rgba(21, 20, 15, 0.22);

  --motion-duration: 180ms;
  --motion-ease: cubic-bezier(0, 0, 0.2, 1);

  --mk-ink: #12151a;
  --mk-ink-soft: #4a5058;
  --mk-mist: #e4e6ea;
  --mk-paper: #f3f4f6;
  --mk-panel: #ffffff;
  --mk-sage: #5c6b5f;
  --mk-line: rgba(18, 21, 26, 0.1);

  --lp-ink: var(--mk-ink);
  --lp-ink-soft: var(--mk-ink-soft);
  --lp-mist: var(--mk-mist);
  --lp-paper: var(--mk-paper);
  --lp-panel: var(--mk-panel);
  --lp-sage: var(--mk-sage);
  --lp-line: var(--mk-line);
}