/* Theme variables and color schemes */

/* Import Google Fonts for beautiful title */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&family=Kalam:wght@300;400;700&display=swap');

:root {
  /* Color palette */
  --color-primary: #c98a2c;
  --color-primary-hover: #b27821;
  --color-secondary: #d1a45b;
  --color-dark-brown: #3b2f1a;
  --color-medium-brown: #5c4a2b;
  --color-light-brown: #6b5a3a;
  --color-wood: #5b3a1e;
  --color-parchment: #f7e7c1;
  --color-cream: #f9f5e7;
  --color-light-cream: #fffaf0;
  --color-card-bg: #fff8e6;
  --color-border: #d1a45b;
  
  /* Night mode colors */
  --color-night-bg: #1a1717;
  --color-night-surface: #2a2520;
  --color-night-text: #e8e5e0;
  --color-night-border: #444;
  
  /* Series colors */
  --color-series: #4caf50;
  --color-series-bg: #e8f5e8;
  --color-series-text: #2e7d32;
  
  /* Error colors */
  --color-error: #dc3545;
  --color-error-light: #fff5f5;
  --color-error-dark: #a71e2a;
  --color-error-bg: #fff5f5;
  --color-error-border: #f5c6cb;
  --color-success: #28a745;
  --color-success-bg: #f8fff9;
  --color-warning: #ffc107;
  --color-warning-bg: #fffdf0;
  --color-info: #17a2b8;
  --color-info-light: #f0f9ff;
  
  /* Text colors */
  --color-text: #333;
  --color-text-muted: #666;
  
  /* Scariness rating colors */
  --scariness-1: #ffffff;
  --scariness-2: #ffeb3b;
  --scariness-3: #ff9800;
  --scariness-4: #f44336;
  --scariness-5: #000000;
  
  /* Typography */
  --font-family: "Georgia", "Times New Roman", serif;
  --font-family-title: 'Dancing Script', 'Kalam', 'Brush Script MT', 'Lucida Handwriting', cursive;
  --font-size-base: 14px;
  --font-size-large: 18px;
  --font-size-small: 12px;
  --line-height-base: 1.6;
  --line-height-reading: 1.8;
  
  /* Spacing */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 20px;
  --spacing-xxl: 24px;
  
  /* Border radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  
  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(91, 58, 30, 0.1);
  --shadow-md: 0 6px 18px rgba(91, 58, 30, 0.25);
  --shadow-lg: 0 12px 24px rgba(91, 58, 30, 0.35);
  
  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.3s ease;
}