/*
 * Theme System for R&D Insights
 * Inspired by Obsidian's design language
 *
 * Three themes:
 *   1. obsidian-dark  – Warm dark theme (default), Obsidian's signature look
 *   2. obsidian-light – Clean light theme, Obsidian iOS-inspired
 *   3. midnight       – Deep AMOLED-friendly dark theme
 */

/* ============================================================
   OBSIDIAN DARK (default)
   Warm, sophisticated dark theme with purple accent
   ============================================================ */
:root,
[data-theme="obsidian-dark"] {
  /* Background layers – pure black */
  --color-bg-primary: #000000;
  --color-bg-secondary: #000000;
  --color-bg-tertiary: #000000;
  --color-bg-surface: #111118;
  --color-bg-surface-hover: #1a1a24;
  --color-bg-surface-active: #22222e;
  --color-bg-elevated: #151520;
  --color-bg-overlay: rgba(0, 0, 0, 0.85);
  --color-bg-input: #0a0a10;

  /* Text */
  --color-text-primary: #dcdce4;
  --color-text-secondary: #a8a8ba;
  --color-text-muted: #78788e;
  --color-text-faint: #555568;
  --color-text-on-accent: #ffffff;
  --color-text-heading: #e8e8f0;

  /* Accent */
  --color-accent: #8b5cf6;
  --color-accent-hover: #7c3aed;
  --color-accent-muted: rgba(139, 92, 246, 0.15);
  --color-accent-subtle: rgba(139, 92, 246, 0.08);

  /* Borders */
  --color-border: #1e1e2c;
  --color-border-hover: #2e2e40;
  --color-border-focus: #8b5cf6;
  --color-border-faint: #141420;

  /* Sidebar */
  --color-sidebar-bg: #000000;
  --color-sidebar-item-hover: rgba(139, 92, 246, 0.08);
  --color-sidebar-item-active: rgba(139, 92, 246, 0.15);

  /* Interactive states */
  --color-interactive-normal: #78788e;
  --color-interactive-hover: #a8a8ba;
  --color-interactive-accent: #8b5cf6;

  /* Semantic */
  --color-success: #34d399;
  --color-warning: #fbbf24;
  --color-error: #f87171;
  --color-info: #60a5fa;

  /* Links */
  --color-link: #8b5cf6;
  --color-link-hover: #a78bfa;
  --color-link-broken: #f87171;

  /* Code */
  --color-code-bg: rgba(139, 92, 246, 0.08);
  --color-code-text: #c4b5fd;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.55);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.6);
  --shadow-sidebar: 6px 0 20px rgba(0, 0, 0, 0.4);
  --shadow-floating: 0 8px 32px rgba(0, 0, 0, 0.6);

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* Typography */
  --font-ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
  --font-editor: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
  --font-mono: 'SF Mono', 'Fira Code', 'JetBrains Mono', ui-monospace, monospace;

  /* Spacing scale */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-2xl: 32px;

  /* Transitions */
  --transition-fast: 0.1s ease;
  --transition-normal: 0.15s ease;
  --transition-slow: 0.25s ease;

  /* Scrollbar */
  --scrollbar-thumb: #2a2a3a;
  --scrollbar-thumb-hover: #3a3a4e;

  /* Canvas-specific */
  --color-canvas-bg: #000000;
  --color-canvas-toolbar-bg: #111118;

  /* Table */
  --color-table-header: #111118;
  --color-table-cell: #0a0a10;
  --color-table-border: #1e1e2c;

  /* Heading marker */
  --color-heading-marker-bg: rgba(139, 92, 246, 0.15);
  --color-heading-marker-text: #c4b5fd;

  /* Blockquote */
  --color-blockquote-border: #8b5cf6;
  --color-blockquote-text: #8888a0;

  /* PWA chrome */
  --color-theme-meta: #000000;

  /* Backdrop blur */
  --header-bg: rgba(0, 0, 0, 0.88);
}


/* ============================================================
   OBSIDIAN LIGHT
   Clean, airy light theme inspired by Obsidian iOS
   ============================================================ */
[data-theme="obsidian-light"] {
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f5f5f7;
  --color-bg-tertiary: #ebebef;
  --color-bg-surface: #f5f5f7;
  --color-bg-surface-hover: #ebebef;
  --color-bg-surface-active: #e0e0e6;
  --color-bg-elevated: #ffffff;
  --color-bg-overlay: rgba(255, 255, 255, 0.88);
  --color-bg-input: #ffffff;

  --color-text-primary: #151528;
  --color-text-secondary: #3e3e56;
  --color-text-muted: #6e6e88;
  --color-text-faint: #9898b0;
  --color-text-on-accent: #ffffff;
  --color-text-heading: #0a0a18;

  --color-accent: #7c3aed;
  --color-accent-hover: #6d28d9;
  --color-accent-muted: rgba(124, 58, 237, 0.12);
  --color-accent-subtle: rgba(124, 58, 237, 0.06);

  --color-border: #e0e0e6;
  --color-border-hover: #c8c8d4;
  --color-border-focus: #7c3aed;
  --color-border-faint: #ebebef;

  --color-sidebar-bg: #f5f5f7;
  --color-sidebar-item-hover: rgba(124, 58, 237, 0.06);
  --color-sidebar-item-active: rgba(124, 58, 237, 0.12);

  --color-interactive-normal: #8888a0;
  --color-interactive-hover: #4a4a5e;
  --color-interactive-accent: #7c3aed;

  --color-success: #059669;
  --color-warning: #d97706;
  --color-error: #dc2626;
  --color-info: #2563eb;

  --color-link: #7c3aed;
  --color-link-hover: #6d28d9;
  --color-link-broken: #dc2626;

  --color-code-bg: rgba(124, 58, 237, 0.07);
  --color-code-text: #6d28d9;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12);
  --shadow-sidebar: 2px 0 12px rgba(0, 0, 0, 0.06);
  --shadow-floating: 0 8px 32px rgba(0, 0, 0, 0.12);

  --scrollbar-thumb: #c8c8d4;
  --scrollbar-thumb-hover: #b0b0c0;

  --color-canvas-bg: #ffffff;
  --color-canvas-toolbar-bg: #f5f5f7;

  --color-table-header: #f0f0f5;
  --color-table-cell: #fafafa;
  --color-table-border: #e0e0e6;

  --color-heading-marker-bg: rgba(124, 58, 237, 0.1);
  --color-heading-marker-text: #7c3aed;

  --color-blockquote-border: #7c3aed;
  --color-blockquote-text: #6a6a80;

  --color-theme-meta: #f5f5f7;
  --header-bg: rgba(255, 255, 255, 0.92);
}


/* ============================================================
   MIDNIGHT
   Deep AMOLED-optimized dark theme with blue accent
   ============================================================ */
[data-theme="midnight"] {
  --color-bg-primary: #0a0a0f;
  --color-bg-secondary: #0e0e14;
  --color-bg-tertiary: #06060a;
  --color-bg-surface: #14141e;
  --color-bg-surface-hover: #1e1e2a;
  --color-bg-surface-active: #262634;
  --color-bg-elevated: #181822;
  --color-bg-overlay: rgba(6, 6, 10, 0.9);
  --color-bg-input: #0e0e14;

  /* Text – extra boosted for AMOLED + reduced white point */
  --color-text-primary: #e4e4ee;
  --color-text-secondary: #b0b0c4;
  --color-text-muted: #808098;
  --color-text-faint: #5e5e78;
  --color-text-on-accent: #ffffff;
  --color-text-heading: #f0f0f8;

  --color-accent: #818cf8;
  --color-accent-hover: #9ba4fc;
  --color-accent-muted: rgba(129, 140, 248, 0.18);
  --color-accent-subtle: rgba(129, 140, 248, 0.10);

  --color-border: #2a2a3c;
  --color-border-hover: #3a3a50;
  --color-border-focus: #818cf8;
  --color-border-faint: #1e1e2a;

  --color-sidebar-bg: #0a0a0f;
  --color-sidebar-item-hover: rgba(129, 140, 248, 0.10);
  --color-sidebar-item-active: rgba(129, 140, 248, 0.18);

  --color-interactive-normal: #808098;
  --color-interactive-hover: #b0b0c4;
  --color-interactive-accent: #818cf8;

  --color-success: #4ade80;
  --color-warning: #fcd34d;
  --color-error: #fca5a5;
  --color-info: #7cb8ff;

  --color-link: #93a0fc;
  --color-link-hover: #b8c0fd;
  --color-link-broken: #fca5a5;

  --color-code-bg: rgba(129, 140, 248, 0.10);
  --color-code-text: #b8c0fd;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.55);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.6);
  --shadow-sidebar: 6px 0 20px rgba(0, 0, 0, 0.4);
  --shadow-floating: 0 8px 32px rgba(0, 0, 0, 0.6);

  --scrollbar-thumb: #3a3a50;
  --scrollbar-thumb-hover: #4a4a64;

  --color-canvas-bg: #0a0a0f;
  --color-canvas-toolbar-bg: #14141e;

  --color-table-header: #161620;
  --color-table-cell: #0e0e14;
  --color-table-border: #1e1e2a;

  --color-heading-marker-bg: rgba(129, 140, 248, 0.18);
  --color-heading-marker-text: #b8c0fd;

  --color-blockquote-border: #818cf8;
  --color-blockquote-text: #9898b0;

  --color-theme-meta: #0a0a0f;
  --header-bg: rgba(10, 10, 15, 0.94);
}