/* tokens.css — SeeYouSoon Global Enterprise Design System Tokens
 * Crisp Executive Light (#F4F5F8 / #FFFFFF) + the website's deep obsidian dark mode (Wave 10 contract C3, the same
 * staircase as the app: canvas #050510, cards #090B10, raised #0C0E14, inset #12141C). Never pitch black.
 */
:root,
[data-theme="light"] {
  /* «only»: a phone browser that darkens light pages by itself (Chrome's auto-darken, Samsung Internet's night mode) leaves
     the panel as drawn, as the app does since round 46 (its css/tokens.css) */
  color-scheme: only light;
  /* Brand Palette — Executive Neutral + SeeYouSoon Royal Violet Accent */
  --ink: #0F172A;
  --ink-2: #334155;
  --paper: #F4F5F8;
  --purple: #7C3AED;
  --blue: #0071E3;
  --kr-green: #16A34A;
  /* State colours and the card shadow, the same values as admin.css, for the partner pages that load tokens.css without it */
  --accent: #16A34A;
  --orange: #D97706;
  --red: #DC2626;
  --shadow: 0 2px 12px rgba(15, 23, 42, 0.04), 0 1px 2px rgba(15, 23, 42, 0.03);
  --primary: #7C3AED;
  --primary-hover: #6D28D9;
  --primary-hi: #8B5CF6;
  --primary-glow: rgba(124, 58, 237, 0.22);

  /* Surface Elevation Staircase (Light Mode Default) */
  --bg: #F4F5F8;
  --bg-main: #F4F5F8;
  --bg-deep: #F4F5F8;
  --bg-2: rgba(255, 255, 255, 0.88);
  --bg-3: #E8EBF2;
  --card: #FFFFFF;
  --card-hi: #EEF0F6;
  --surface: #FFFFFF;
  --box-inner-bg: #F2F4F8;
  --modal-bg: #FFFFFF;

  /* Semantic Text Hierarchy (WCAG AA+) */
  --text: #0F172A;
  --text-1: #0F172A;
  --text-main: #0F172A;
  --text-2: #334155;
  --text-3: #64748B;
  --text-muted: #64748B;
  --muted: #64748B;
  --text-4: #7C8798;
  --text-dim: #7C8798;

  /* Hairline Separators & Liquid Glass Chrome */
  --border: rgba(15, 23, 42, 0.085);
  --border-hi: rgba(15, 23, 42, 0.16);
  --glass-bg: rgba(255, 255, 255, 0.86);
  --glass-surface: rgba(255, 255, 255, 0.94);
  --glass-border: rgba(15, 23, 42, 0.09);
  --glass-border-hi: rgba(124, 58, 237, 0.34);
  --glass-shadow: 0 12px 32px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
  --card-gradient: linear-gradient(180deg, #FFFFFF 0%, #FAFBFD 100%);
  --glass-card-bg: #FFFFFF;
  --glass-header-bg: rgba(255, 255, 255, 0.88);
  --glass-input-bg: #FFFFFF;
  --shadow-luxe: 0 6px 22px rgba(15, 23, 42, 0.05), 0 1px 3px rgba(15, 23, 42, 0.03);

  /* Interactive Fill Roles */
  --btn-glass-bg: rgba(15, 23, 42, 0.045);
  --btn-glass-hover: rgba(15, 23, 42, 0.085);
  --btn-glass-text: #0F172A;
  --hover: rgba(15, 23, 42, 0.045);

  /* Typography */
  --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', SFMono-Regular, 'JetBrains Mono', Menlo, Monaco, Consolas, monospace;
  --font-arabic: 'Tajawal', -apple-system, BlinkMacSystemFont, 'Plus Jakarta Sans', sans-serif;

  /* Concentric Radii & Spring Physics */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;
  --ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
}

[data-theme="dark"] {
  color-scheme: dark;
  --ink: #050510;
  --ink-2: #090B10;
  --purple: #A855F7;
  --blue: #38BDF8;
  --kr-green: #34D399;
  --accent: #30D158;
  --orange: #FF9F0A;
  --red: #FF453A;
  --shadow: 0 12px 32px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --primary: #A855F7;
  --primary-hover: #9333EA;
  --primary-hi: #C084FC;
  --primary-glow: rgba(168, 85, 247, 0.34);

  /* Surface Elevation Staircase (C3 obsidian: the website's ink, then one step up per layer) */
  --bg: #050510;
  --bg-main: #050510;
  --bg-deep: #050510;
  --bg-2: rgba(9, 11, 16, 0.88);
  --bg-3: #12141C;
  --card: #090B10;
  --card-hi: #0C0E14;
  --surface: #090B10;
  --box-inner-bg: #0C0E14;
  --modal-bg: #0C0E14;

  /* Semantic Text Hierarchy */
  --text: #FAFAFC;
  --text-1: #FAFAFC;
  --text-main: #FAFAFC;
  --text-2: #E4E4ED;
  --text-3: #9494A3;
  --text-muted: #9494A3;
  --muted: #9494A3;
  --text-4: #686878;
  --text-dim: #686878;

  /* Hairline Luminous Separators & Smoked Obsidian Chrome */
  --border: rgba(255, 255, 255, 0.08);
  --border-hi: rgba(255, 255, 255, 0.16);
  --glass-bg: rgba(9, 11, 16, 0.88);
  --glass-surface: rgba(12, 14, 20, 0.92);
  --glass-border: rgba(255, 255, 255, 0.085);
  --glass-border-hi: rgba(168, 85, 247, 0.48);
  --glass-shadow: 0 22px 54px rgba(0, 0, 0, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --card-gradient: linear-gradient(165deg, #0C0E14 0%, #090B10 100%);
  --glass-card-bg: #090B10;
  --glass-header-bg: rgba(9, 11, 16, 0.88);
  --glass-input-bg: #12141C;
  --shadow-luxe: 0 14px 36px rgba(0, 0, 0, 0.76), inset 0 1px 0 rgba(255, 255, 255, 0.065);

  /* Interactive Fill Roles */
  --btn-glass-bg: rgba(255, 255, 255, 0.055);
  --btn-glass-hover: rgba(255, 255, 255, 0.105);
  --btn-glass-text: #FAFAFC;
  --hover: rgba(255, 255, 255, 0.055);
}
