/* Shared IronClaw theme tokens */

:root {
  --bg: #09090b;
  --bg-secondary: #0f0f11;
  --bg-tertiary: #1a1a1e;
  --border: rgba(255, 255, 255, 0.08);
  --text: #fafafa;
  --text-secondary: #a1a1aa;
  --accent: #34d399;
  --accent-hover: #2fc48d;
  --accent-soft: rgba(52, 211, 153, 0.15);
  --success: #34d399;
  --info: #60a5fa;
  --warning: #F5A623;
  --danger: #E64C4C;
  --code-bg: #111113;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  --font-mono: 'IBM Plex Mono', 'SF Mono', 'Fira Code', Consolas, monospace;
  --bg-overlay: rgba(0, 0, 0, 0.5);
  --bg-modal: #1a1a1a;
  --border-modal: #333;
  --border-soft: #2a2a2a;
  --text-tertiary: #e0e0e0;
  --text-muted: #888;
  --text-dimmed: #666;
  --text-on-accent: #09090b;
  --accent-brand: #00D894;
  --accent-brand-hover: #00be82;
  --warning-bg: #1e1400;
  --warning-border: #3a2a00;
  --warning-text: #facc15;
  --tab-bg: rgba(9, 9, 11, 0.75);
  --popover-bg: rgba(15, 15, 17, 0.9);
  --badge-sandbox-bg: rgba(136, 132, 216, 0.15);
  --badge-sandbox-text: #b4b0e8;
  --hover-surface: rgba(255, 255, 255, 0.03);
  --focus-ring: rgba(52, 211, 153, 0.1);
  --accent-subtle: rgba(52, 211, 153, 0.15);
  --accent-border-subtle: rgba(52, 211, 153, 0.3);
  --danger-subtle: rgba(230, 76, 76, 0.15);
  --danger-border-subtle: rgba(230, 76, 76, 0.3);
  --warning-subtle: rgba(245, 166, 35, 0.15);
  --border-hover: rgba(255, 255, 255, 0.15);
  --user-msg-bg: rgba(52, 211, 153, 0.08);
  --user-msg-border: rgba(52, 211, 153, 0.2);
  --danger-error-bg: rgba(230, 76, 76, 0.1);
  --accent-tee-bg: rgba(52, 211, 153, 0.1);
  --accent-tee-border: rgba(52, 211, 153, 0.25);
  --accent-tee-hover: rgba(52, 211, 153, 0.18);
  --text-on-danger: #fff;
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.4);
  --shadow-toast: 0 4px 12px rgba(0, 0, 0, 0.4);
  --danger-error-border: rgba(230, 76, 76, 0.2);
  --note-bg: rgba(255, 255, 255, 0.04);
  --overlay-heavy: rgba(0, 0, 0, 0.6);
  --highlight-bg: rgba(52, 211, 153, 0.3);
  --hover-subtle: rgba(255, 255, 255, 0.06);
  --transition-fast: 150ms ease;
  --transition-base: 0.2s ease;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.3), 0 1px 3px rgba(0,0,0,0.15);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4), 0 2px 4px rgba(0,0,0,0.2);
  --shadow-lg: 0 12px 40px rgba(0,0,0,0.5), 0 4px 12px rgba(0,0,0,0.3);
  --glow-accent: 0 0 20px rgba(52,211,153,0.1);
  --glass-bg: rgba(9,9,11,0.72);
  --glass-blur: blur(16px) saturate(180%);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-spring-gentle: cubic-bezier(0.22, 1.2, 0.36, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --surface-highlight: inset 0 1px 0 rgba(255,255,255,0.05);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --text-xs: 11px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 36px;
  --transition-slow: 300ms ease;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-instant: 100ms;
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
  --accent-soft: var(--accent-subtle);
  --accent-dim: var(--accent-subtle);
  --bg-hover: var(--hover-surface);
  --danger-soft: var(--danger-subtle);
  --warning-soft: var(--warning-subtle);
}

[data-theme="light"] {
  --bg: #ffffff;
  --bg-secondary: #f5f5f7;
  --bg-tertiary: #ebebed;
  --border: rgba(0, 0, 0, 0.1);
  --text: #1a1a2e;
  --text-secondary: #555555;
  --accent: #059669;
  --accent-hover: #047857;
  --success: #059669;
  --info: #2563eb;
  --warning: #d97706;
  --danger: #dc2626;
  --code-bg: #f0f0f2;
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  --bg-overlay: rgba(0, 0, 0, 0.3);
  --bg-modal: #ffffff;
  --border-modal: #e0e0e0;
  --border-soft: #e5e5e5;
  --text-tertiary: #333333;
  --text-muted: #777777;
  --text-dimmed: #999999;
  --text-on-accent: #ffffff;
  --accent-brand: #059669;
  --accent-brand-hover: #047857;
  --warning-bg: #fffbeb;
  --warning-border: #fde68a;
  --warning-text: #92400e;
  --tab-bg: rgba(255, 255, 255, 0.9);
  --popover-bg: rgba(255, 255, 255, 0.95);
  --badge-sandbox-bg: rgba(136, 132, 216, 0.1);
  --badge-sandbox-text: #6b67b0;
  --hover-surface: rgba(0, 0, 0, 0.03);
  --focus-ring: rgba(5, 150, 105, 0.15);
  --accent-subtle: rgba(5, 150, 105, 0.1);
  --accent-border-subtle: rgba(5, 150, 105, 0.3);
  --danger-subtle: rgba(220, 38, 38, 0.1);
  --danger-border-subtle: rgba(220, 38, 38, 0.2);
  --warning-subtle: rgba(217, 119, 6, 0.1);
  --border-hover: rgba(0, 0, 0, 0.15);
  --user-msg-bg: rgba(5, 150, 105, 0.08);
  --user-msg-border: rgba(5, 150, 105, 0.2);
  --danger-error-bg: rgba(220, 38, 38, 0.06);
  --accent-tee-bg: rgba(5, 150, 105, 0.08);
  --accent-tee-border: rgba(5, 150, 105, 0.2);
  --accent-tee-hover: rgba(5, 150, 105, 0.15);
  --text-on-danger: #fff;
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.08);
  --shadow-toast: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
  --danger-error-border: rgba(220, 38, 38, 0.15);
  --note-bg: rgba(0, 0, 0, 0.02);
  --overlay-heavy: rgba(0, 0, 0, 0.4);
  --highlight-bg: rgba(5, 150, 105, 0.2);
  --hover-subtle: rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --glow-accent: 0 0 20px rgba(5,150,105,0.08);
  --glass-bg: rgba(255,255,255,0.85);
  --glass-blur: blur(16px) saturate(180%);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-spring-gentle: cubic-bezier(0.22, 1.2, 0.36, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --surface-highlight: inset 0 1px 0 rgba(255,255,255,0.8);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --text-xs: 11px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 36px;
  --transition-slow: 300ms ease;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-instant: 100ms;
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
  --accent-soft: var(--accent-subtle);
  --accent-dim: var(--accent-subtle);
  --bg-hover: var(--hover-surface);
  --danger-soft: var(--danger-subtle);
  --warning-soft: var(--warning-subtle);
}
