/**
 * Theme definitions: Light and dark color schemes
 * 
 * Design aesthetic: "Scholarly but approachable"
 * - Warm, readable colors inspired by academic texts
 * - High contrast for accessibility
 * - Subtle accent colors that don't overwhelm
 */

/* ============================================
   Light Theme (Default)
   ============================================ */

:root,
[data-theme="light"] {
  --color-bg: #faf8f5;
  --color-bg-subtle: #f3f0eb;
  --color-bg-muted: #e8e4dd;
  
  --color-surface: #ffffff;
  --color-surface-raised: #ffffff;
  
  --color-text: #2d2a26;
  --color-text-heading: #1a1815;
  --color-text-muted: #6b6560;
  --color-text-subtle: #9a9590;
  
  --color-border: #d9d4cc;
  --color-border-subtle: #e8e4dd;
  --color-border-accent: #c4a77d;
  
  /* Primary accent: Deep teal - knowledge, depth */
  --color-accent: #1a6b6b;
  --color-accent-hover: #145555;
  --color-accent-subtle: #e6f2f2;
  
  /* Secondary accent: Warm amber - insight, illumination */
  --color-highlight: #c4a77d;
  --color-highlight-subtle: #faf3e8;
  
  /* Links */
  --color-link: #1a6b6b;
  --color-link-hover: #145555;
  --color-link-visited: #4a5568;
  
  /* Interactive elements */
  --color-button-bg: #1a6b6b;
  --color-button-text: #ffffff;
  --color-button-hover-bg: #145555;
  
  /* Code blocks */
  --color-code-bg: #f3f0eb;
  --color-code-text: #2d2a26;
  
  /* Semantic colors */
  --color-info: #2b6cb0;
  --color-info-bg: #ebf4ff;
  --color-success: #276749;
  --color-success-bg: #e6ffed;
  --color-warning: #c05621;
  --color-warning-bg: #fffaf0;
  --color-error: #c53030;
  --color-error-bg: #fff5f5;
  
  /* Citation type indicators */
  --color-cite-paper: #6b46c1;
  --color-cite-video: #d53f8c;
  --color-cite-docs: #2b6cb0;
  --color-cite-article: #2f855a;
}

/* ============================================
   Dark Theme
   ============================================ */

[data-theme="dark"] {
  --color-bg: #1a1917;
  --color-bg-subtle: #242320;
  --color-bg-muted: #2e2d29;
  
  --color-surface: #242320;
  --color-surface-raised: #2e2d29;
  
  --color-text: #e8e4dd;
  --color-text-heading: #f5f3f0;
  --color-text-muted: #a8a39a;
  --color-text-subtle: #6b6660;
  
  --color-border: #3d3b36;
  --color-border-subtle: #2e2d29;
  --color-border-accent: #c4a77d;
  
  /* Primary accent: Lighter teal for dark mode */
  --color-accent: #4db3b3;
  --color-accent-hover: #6bc7c7;
  --color-accent-subtle: #1a3333;
  
  /* Secondary accent: Warm amber */
  --color-highlight: #d4b88a;
  --color-highlight-subtle: #2a2520;
  
  /* Links */
  --color-link: #4db3b3;
  --color-link-hover: #6bc7c7;
  --color-link-visited: #a0aec0;
  
  /* Interactive elements */
  --color-button-bg: #4db3b3;
  --color-button-text: #1a1917;
  --color-button-hover-bg: #6bc7c7;
  
  /* Code blocks */
  --color-code-bg: #2e2d29;
  --color-code-text: #e8e4dd;
  
  /* Semantic colors (adjusted for dark) */
  --color-info: #63b3ed;
  --color-info-bg: #1a365d;
  --color-success: #68d391;
  --color-success-bg: #1c4532;
  --color-warning: #f6ad55;
  --color-warning-bg: #652b19;
  --color-error: #fc8181;
  --color-error-bg: #63171b;
  
  /* Citation type indicators */
  --color-cite-paper: #b794f4;
  --color-cite-video: #f687b3;
  --color-cite-docs: #63b3ed;
  --color-cite-article: #68d391;
}

/* ============================================
   System Preference Detection
   ============================================ */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #1a1917;
    --color-bg-subtle: #242320;
    --color-bg-muted: #2e2d29;
    
    --color-surface: #242320;
    --color-surface-raised: #2e2d29;
    
    --color-text: #e8e4dd;
    --color-text-heading: #f5f3f0;
    --color-text-muted: #a8a39a;
    --color-text-subtle: #6b6660;
    
    --color-border: #3d3b36;
    --color-border-subtle: #2e2d29;
    --color-border-accent: #c4a77d;
    
    --color-accent: #4db3b3;
    --color-accent-hover: #6bc7c7;
    --color-accent-subtle: #1a3333;
    
    --color-highlight: #d4b88a;
    --color-highlight-subtle: #2a2520;
    
    --color-link: #4db3b3;
    --color-link-hover: #6bc7c7;
    --color-link-visited: #a0aec0;
    
    --color-button-bg: #4db3b3;
    --color-button-text: #1a1917;
    --color-button-hover-bg: #6bc7c7;
    
    --color-code-bg: #2e2d29;
    --color-code-text: #e8e4dd;
    
    --color-info: #63b3ed;
    --color-info-bg: #1a365d;
    --color-success: #68d391;
    --color-success-bg: #1c4532;
    --color-warning: #f6ad55;
    --color-warning-bg: #652b19;
    --color-error: #fc8181;
    --color-error-bg: #63171b;
    
    --color-cite-paper: #b794f4;
    --color-cite-video: #f687b3;
    --color-cite-docs: #63b3ed;
    --color-cite-article: #68d391;
  }
}

/* ============================================
   Theme Transition
   ============================================ */

:root {
  transition: 
    background-color var(--duration-slow) var(--ease-in-out),
    color var(--duration-slow) var(--ease-in-out);
}



