/**
 * CSS Variables for NewLukasBlog
 * Centralized color scheme and design tokens
 */

:root {
  /* ============================================
   * Color Palette - Light Theme
   * ============================================ */
  
  /* Background colors */
  --bg-primary: #ffffff;
  --bg-secondary: #f5f5f5;
  --bg-tertiary: #e8e8e8;
  
  /* Text colors */
  --text-primary: #282a36;
  --text-secondary: #555555;
  --text-tertiary: #888888;
  --text-inverse: #ffffff;
  
  /* Accent colors */
  --accent-primary: #4a90d9;
  --accent-secondary: #6ab04c;
  --accent-tertiary: #eb4d4b;
  
  /* Link colors */
  --link-color: #2980b9;
  --link-hover: #1a5276;
  --link-visited: #9b59b6;
  
  /* Border colors */
  --border-light: #dddddd;
  --border-medium: #bbbbbb;
  --border-dark: #999999;
  
  /* Header/Footer colors */
  --header-bg: #ffffff;
  --header-text: #282a36;
  --footer-bg: #2c3e50;
  --footer-text: #ecf0f1;
  
  /* Button colors */
  --btn-bg: #3498db;
  --btn-text: #ffffff;
  --btn-hover-bg: #2980b9;
  --btn-border: #2980b9;
  
  /* Code block colors */
  --code-bg: #f8f9fa;
  --code-text: #212529;
  --code-border: #dee2e6;
  
  /* Scrollbar colors */
  --scrollbar-thumb: #888888;
  --scrollbar-track: #f1f1f1;
  
  /* Shadow colors */
  --shadow-sm: rgba(0, 0, 0, 0.1);
  --shadow-md: rgba(0, 0, 0, 0.2);
  --shadow-lg: rgba(0, 0, 0, 0.3);
  
  /* ============================================
   * Typography
   * ============================================ */
  --font-primary: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-secondary: Georgia, 'Times New Roman', Times, serif;
  --font-mono: 'Courier New', Courier, monospace;
  
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 2rem;
  
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  
  /* ============================================
   * Spacing
   * ============================================ */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-2xl: 3rem;
  --spacing-3xl: 4rem;
  
  /* ============================================
   * Border Radius
   * ============================================ */
  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-full: 9999px;
  
  /* ============================================
   * Transitions
   * ============================================ */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 350ms ease;
  
  /* ============================================
   * Z-Index Scale
   * ============================================ */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
}

/* ============================================
 * Dark Theme Variables
 * ============================================ */
[data-theme="dark"],
.dark-theme {
  --bg-primary: #1a1a1a;
  --bg-secondary: #252525;
  --bg-tertiary: #333333;
  
  --text-primary: #e0e0e0;
  --text-secondary: #b0b0b0;
  --text-tertiary: #808080;
  --text-inverse: #1a1a1a;
  
  --accent-primary: #5daee2;
  --accent-secondary: #78c46c;
  --accent-tertiary: #e74c3c;
  
  --link-color: #3498db;
  --link-hover: #5dade2;
  --link-visited: #9b59b6;
  
  --border-light: #444444;
  --border-medium: #555555;
  --border-dark: #666666;
  
  --header-bg: #1a1a1a;
  --header-text: #e0e0e0;
  --footer-bg: #1a1a1a;
  --footer-text: #b0b0b0;
  
  --btn-bg: #3498db;
  --btn-text: #ffffff;
  --btn-hover-bg: #2980b9;
  --btn-border: #2980b9;
  
  --code-bg: #2d2d2d;
  --code-text: #f8f8f2;
  --code-border: #444444;
  
  --scrollbar-thumb: #555555;
  --scrollbar-track: #252525;
}

/* ============================================
 * Specific Theme Variables (for individual pages)
 * ============================================ */

/* ApolloNvim Theme */
:root.apollo-theme {
  --bg-primary: #2a232b;
  --bg-secondary: #1e1a1f;
  --text-primary: #f8f8f2;
  --text-secondary: #e0e0e0;
  --accent-primary: #e54472;
  --accent-secondary: #18f700;
  --accent-tertiary: #f76b00;
}

/* Kakoune Theme */
:root.kakoune-theme {
  --bg-primary: #2a232b;
  --bg-secondary: #1e1a1f;
  --text-primary: #f8f8f2;
  --text-secondary: #e0e0e0;
  --accent-primary: #e54472;
  --accent-secondary: #9fea8a;
  --accent-tertiary: #ea3838;
}

/* Terminal Space Theme */
:root.terminal-theme {
  --bg-primary: #2a232b;
  --bg-secondary: #1e1a1f;
  --text-primary: #f8f8f2;
  --text-secondary: #e0e0e0;
  --accent-primary: #e7efa7;
  --accent-secondary: #c627d8;
  --accent-tertiary: #f76b00;
}