/* Runa Chat — shared light design tokens. */
:root,
[data-theme="light"],
[data-theme="dark"] {
  color-scheme: light;

  --bg-main: #F5F7FA;
  --bg-panel: #FFFFFF;
  --bg-secondary: #EEF2F6;
  --border: #D9E1EA;
  --text-primary: #1F2937;
  --text-secondary: #667085;
  --text-muted: #98A2B3;
  --accent: #F58220;
  --accent-hover: #DD6F10;
  --accent-active: #C45E08;
  --accent-soft: #FFF1E6;
  --success: #16A34A;
  --warning: #F59E0B;
  --error: #DC2626;

  /* Compatibility aliases consumed by the existing UI modules. */
  --bg-app: var(--bg-main);
  --bg-chat: var(--bg-main);
  --bg-sidebar: var(--bg-panel);
  --bg-header: rgba(255, 255, 255, 0.96);
  --bg-composer: rgba(255, 255, 255, 0.97);
  --bg-input: var(--bg-secondary);
  --bg-card: var(--bg-panel);
  --bg-modal: var(--bg-panel);
  --bg-overlay: rgba(31, 41, 55, 0.34);
  --bg-context: var(--bg-panel);
  --bg-msg-own: #FFF0E3;
  --bg-msg-own-hover: #FFE5CF;
  --bg-msg-other: #FFFFFF;
  --bg-msg-other-hover: #F9FAFB;
  --bg-msg-system: rgba(255, 255, 255, 0.88);

  --accent-violet: var(--accent);
  --accent-purple: var(--accent-active);
  --accent-blue: var(--accent);
  --accent-blue-hover: var(--accent-hover);
  --accent-cyan: var(--accent);
  --accent-button: var(--accent);
  --accent-gradient: linear-gradient(135deg, #F58220, #FFAA5E);

  --text-time: #98A2B3;
  --text-link: #D9650C;
  --text-danger: var(--error);
  --text-success: var(--success);
  --online: var(--success);
  --offline: #CBD5E1;
  --typing: var(--accent);
  --badge-bg: var(--accent);
  --badge-text: #FFFFFF;

  --border-input: #D9E1EA;
  --border-focus: var(--accent);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 12px 32px rgba(15, 23, 42, 0.12);
  --shadow-glow: 0 16px 48px rgba(245, 130, 32, 0.18);
  --blur-heavy: blur(20px);
  --blur-light: blur(12px);

  --header-height: 64px;
  --composer-height: 68px;
  --sidebar-width: 360px;
  --bottom-nav-height: 62px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;
  --radius-msg: 16px;
  --radius-msg-tail: 5px;

  --font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-size-xs: 11px;
  --font-size-sm: 13px;
  --font-size-base: 15px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 21px;
  --transition-fast: 120ms ease;
  --transition-normal: 200ms ease;
  --transition-slow: 300ms ease;
}