/* Bete design tokens — slice 1. Do not hard-code accents in components. */
:root,
[data-theme="light"] {
  --bete-bg: #f5f9fa;
  --bete-surface: #FFFFFF;
  --bete-border: #e1ebee;
  --bete-text: #143b4b;
  --bete-text-muted: #718995;
  --bete-success: #2E9E6B;
  --bete-warning: #C98A12;
  --bete-danger: #E5484D;
  --bete-premium-bg: #FFF4E5;
  --bete-logo-placeholder: #C9D3D6;
  --bete-shadow: 0 12px 34px rgba(23,64,79,.08);
  --bete-on-accent: #FFFFFF;
}
[data-theme="dark"] {
  --bete-bg: #0F1A1D;
  --bete-surface: #172428;
  --bete-border: #26363B;
  --bete-text: #E8F0F2;
  --bete-text-muted: #9AAEB4;
  --bete-success: #4CC38A;
  --bete-warning: #E0A93A;
  --bete-danger: #FF6369;
  --bete-premium-bg: #2A2214;
  --bete-logo-placeholder: #26363B;
  --bete-shadow: none;
}
[data-accent="teal"] {
  --bete-accent: #087f8c;
  --bete-accent-strong: #075c68;
  --bete-accent-soft: #dff4f3;
}
[data-accent="blue"] {
  --bete-accent: #2563EB;
  --bete-accent-strong: #1D4ED8;
  --bete-accent-soft: #E6EEFD;
}
/* Green/Orange: use strong as button accent for contrast (T-APP-05) */
[data-accent="green"] {
  --bete-accent: #15803D;
  --bete-accent-strong: #166534;
  --bete-accent-soft: #E7F6EC;
}
[data-accent="purple"] {
  --bete-accent: #7C3AED;
  --bete-accent-strong: #6D28D9;
  --bete-accent-soft: #EFE8FD;
}
[data-accent="orange"] {
  --bete-accent: #C2410C;
  --bete-accent-strong: #9A3412;
  --bete-accent-soft: #FDEDE4;
}
[data-accent="rose"] {
  --bete-accent: #E11D48;
  --bete-accent-strong: #BE123C;
  --bete-accent-soft: #FDE7EC;
}
[data-theme="dark"][data-accent="teal"] { --bete-accent-soft: rgba(31, 122, 140, 0.18); }
[data-theme="dark"][data-accent="blue"] { --bete-accent-soft: rgba(37, 99, 235, 0.18); }
[data-theme="dark"][data-accent="green"] { --bete-accent-soft: rgba(21, 128, 61, 0.18); }
[data-theme="dark"][data-accent="purple"] { --bete-accent-soft: rgba(124, 58, 237, 0.18); }
[data-theme="dark"][data-accent="orange"] { --bete-accent-soft: rgba(194, 65, 12, 0.18); }
[data-theme="dark"][data-accent="rose"] { --bete-accent-soft: rgba(225, 29, 72, 0.18); }

:root {
  --bete-accent-ring: color-mix(in srgb, var(--bete-accent) 40%, transparent);
  --radius-card: 17px;
  --radius-input: 11px;
  --radius-btn: 12px;
  --nav-h: 73px;
  --safe-b: env(safe-area-inset-bottom, 0px);
}
/* Swatch faces (token file only — T-APP-03) */
.swatch.accent-teal { background: #087f8c; }
.swatch.accent-blue { background: #2563EB; }
.swatch.accent-green { background: #15803D; }
.swatch.accent-purple { background: #7C3AED; }
.swatch.accent-orange { background: #C2410C; }
.swatch.accent-rose { background: #E11D48; }