/* BookmarkVault Pro Design System Tokens & Themes */
:root {
  /* Default Obsidian Dark Theme */
  --bg-primary: #0a0a0f;
  --bg-secondary: #12121a;
  --bg-tertiary: #181824;
  --bg-card: #151520;
  --bg-card-hover: #1e1e2d;
  --bg-glass: rgba(18, 18, 26, 0.75);
  --bg-glass-card: rgba(21, 21, 32, 0.65);
  
  --border: rgba(255, 255, 255, 0.07);
  --border-hover: rgba(255, 255, 255, 0.16);
  --border-active: rgba(124, 110, 247, 0.5);

  --text-primary: #f0f0f5;
  --text-secondary: #9090aa;
  --text-muted: #5e5e78;
  
  --accent: #6c5ce7;
  --accent-glow: rgba(108, 92, 231, 0.35);
  --accent-hover: #7c6ef7;
  --accent-subtle: rgba(108, 92, 231, 0.15);

  --green: #00d2a0;
  --green-glow: rgba(0, 210, 160, 0.25);
  --green-subtle: rgba(0, 210, 160, 0.12);
  
  --red: #ff5572;
  --red-glow: rgba(255, 85, 114, 0.25);
  --red-subtle: rgba(255, 85, 114, 0.12);

  --orange: #ffa234;
  --blue: #4ea0ff;
  --pink: #f772b6;
  --cyan: #00cec9;

  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
  --shadow-glow: 0 0 20px var(--accent-glow);

  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.35s cubic-bezier(0.16, 1, 0.3, 1);

  --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

/* OLED Pure Black Theme */
[data-theme="oled"] {
  --bg-primary: #000000;
  --bg-secondary: #07070a;
  --bg-tertiary: #101014;
  --bg-card: #0a0a0f;
  --bg-card-hover: #14141c;
  --bg-glass: rgba(7, 7, 10, 0.85);
  --bg-glass-card: rgba(10, 10, 15, 0.8);
  --border: rgba(255, 255, 255, 0.1);
  --border-hover: rgba(255, 255, 255, 0.25);
  --text-primary: #ffffff;
  --text-secondary: #a2a2b8;
  --text-muted: #666680;
  --accent: #7c6ef7;
  --accent-glow: rgba(124, 110, 247, 0.4);
}

/* Nord Polar Theme */
[data-theme="nord"] {
  --bg-primary: #242933;
  --bg-secondary: #2e3440;
  --bg-tertiary: #3b4252;
  --bg-card: #2e3440;
  --bg-card-hover: #3b4252;
  --bg-glass: rgba(46, 52, 64, 0.85);
  --bg-glass-card: rgba(59, 66, 82, 0.7);
  --border: rgba(216, 222, 233, 0.1);
  --border-hover: rgba(216, 222, 233, 0.22);
  --text-primary: #eceff4;
  --text-secondary: #d8dee9;
  --text-muted: #88c0d0;
  --accent: #88c0d0;
  --accent-hover: #81a1c1;
  --accent-glow: rgba(136, 192, 208, 0.35);
  --accent-subtle: rgba(136, 192, 208, 0.15);
  --green: #a3be8c;
  --red: #bf616a;
  --orange: #d08770;
  --blue: #5e81ac;
}

/* Crisp Paper Light Theme */
[data-theme="light"] {
  --bg-primary: #f8f9fc;
  --bg-secondary: #ffffff;
  --bg-tertiary: #edf0f7;
  --bg-card: #ffffff;
  --bg-card-hover: #f3f5fa;
  --bg-glass: rgba(255, 255, 255, 0.88);
  --bg-glass-card: rgba(255, 255, 255, 0.95);
  --border: rgba(0, 0, 0, 0.08);
  --border-hover: rgba(0, 0, 0, 0.16);
  --border-active: rgba(108, 92, 231, 0.6);
  --text-primary: #121217;
  --text-secondary: #56566c;
  --text-muted: #8c8ca2;
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.06);
  --shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 16px 36px rgba(0, 0, 0, 0.12);
  --shadow-glow: 0 0 16px rgba(108, 92, 231, 0.2);
}