/* 🏰 ENCHANTED KINGDOM THEME - PARCHMENT STYLE */
:root {
  /* ===== COLOR PALETTE ===== */
  --primary-bg: linear-gradient(135deg, #f4f1e8 0%, #e8dcc0 50%, #f4f1e8 100%);
  --body-overlay: radial-gradient(circle at 30% 70%, rgba(139, 69, 19, 0.03) 0%, transparent 50%), radial-gradient(circle at 70% 30%, rgba(160, 82, 45, 0.02) 0%, transparent 50%);
  --primary-text: #3e2723;
  --heading-color: #2e1a1a;
  --paragraph-color: #4a2c2a;
  --accent-primary: #8b4513;
  --accent-secondary: #a0522d;
  --accent-tertiary: #d2691e;
  --title-gradient: linear-gradient(135deg, #8b4513 0%, #a0522d 50%, #d2691e 100%);

  /* ===== TYPOGRAPHY ===== */
  --font-primary: 'Crimson Text', 'Times New Roman', serif;
  --font-heading: 'Uncial Antiqua', 'Papyrus', 'Bradley Hand', cursive;
  --font-code: 'Courier New', 'Courier', monospace;
  --heading-weight: 700;

  /* ===== EFFECTS ===== */
  --text-shadow: none;
  --glow-shadow: 0 2px 4px rgba(139, 69, 19, 0.3);

  /* ===== NAVBAR ===== */
  --navbar-bg: rgba(232, 220, 192, 0.95);
  --navbar-border: 1px solid rgba(139, 69, 19, 0.3);
  --navbar-shadow: 0 2px 8px rgba(139, 69, 19, 0.2);

  /* ===== CONTENT AREAS ===== */
  --content-bg: rgba(248, 245, 235, 0.9);
  --content-border: 1px solid rgba(139, 69, 19, 0.2);
  --content-shadow: 0 4px 12px rgba(139, 69, 19, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  --section-border: 2px solid rgba(160, 82, 45, 0.4);

  /* ===== QUEST SECTIONS ===== */
  --quest-section-bg: rgba(245, 240, 230, 0.8);
  --quest-content-bg: rgba(248, 245, 235, 0.9);

  /* ===== QUEST LINKS ===== */
  --quest-link-bg: rgba(240, 235, 220, 0.9);
  --quest-link-border: 1px solid rgba(139, 69, 19, 0.3);
  --quest-link-text: #3e2723;
  --quest-link-shadow: 0 2px 8px rgba(139, 69, 19, 0.15);
  --quest-link-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --quest-link-hover-overlay: linear-gradient(135deg, rgba(139, 69, 19, 0.05) 0%, rgba(160, 82, 45, 0.05) 100%);
  --quest-link-hover-shadow: 0 4px 12px rgba(139, 69, 19, 0.25);
  --quest-link-hover-text: #8b4513;

  /* ===== NAVIGATION BUTTONS ===== */
  --nav-button-bg: rgba(139, 69, 19, 0.1);
  --nav-button-border: 1px solid rgba(139, 69, 19, 0.3);
  --nav-button-text: #8b4513;
  --nav-button-shadow: 0 2px 8px rgba(139, 69, 19, 0.15);
  --nav-button-transition: all 0.3s ease;
  --nav-button-hover-bg: rgba(139, 69, 19, 0.15);
  --nav-button-hover-text: #2e1a1a;
  --nav-button-hover-shadow: 0 4px 12px rgba(139, 69, 19, 0.25);

  /* ===== CODE BLOCKS ===== */
  --code-block-bg: rgba(235, 225, 205, 0.9);
  --code-block-border: 1px solid rgba(139, 69, 19, 0.3);
  --code-block-shadow: 0 3px 12px rgba(139, 69, 19, 0.2);
  --code-pre-bg: rgba(250, 248, 240, 0.95);
  --code-text: #3e2723;
  --code-line-height: 1.3;

  /* ===== INLINE CODE ===== */
  --inline-code-bg: transparent;
  --inline-code-text: #8b4513;
  --inline-code-border: none;

  /* ===== NAVIGATION PILLS ===== */
  --nav-link-text: #4a2c2a;
  
  --nav-quest-pill-bg: rgba(139, 69, 19, 0.1);
  --nav-quest-pill-border: 1px solid rgba(139, 69, 19, 0.3);
  --nav-quest-pill-shadow: 0 2px 6px rgba(139, 69, 19, 0.2);
  --nav-quest-pill-hover-bg: rgba(139, 69, 19, 0.18);
  --nav-quest-pill-hover-shadow: 0 4px 10px rgba(139, 69, 19, 0.3);
  
  --nav-theme-pill-bg: rgba(160, 82, 45, 0.1);
  --nav-theme-pill-border: 1px solid rgba(160, 82, 45, 0.3);
  --nav-theme-pill-shadow: 0 2px 6px rgba(160, 82, 45, 0.2);
  --nav-theme-pill-hover-bg: rgba(160, 82, 45, 0.18);
  --nav-theme-pill-hover-shadow: 0 4px 10px rgba(160, 82, 45, 0.3);

  /* ===== BACKGROUND IMAGES ===== */
  --story-bg-image: url('images/mythical.png');
  --quest-bg-image: url('images/mythical-quest.png');
  --story-background-position-percentage: 25%;
  --quest-background-position-percentage: 15%;
}

/* 🌙 MYTHICAL THEME - DARK MODE VARIANT */
[data-theme="dark"] {
  /* ===== COLOR PALETTE - MIDNIGHT ENCHANTMENT ===== */
  --primary-bg: linear-gradient(135deg, #0a0612 0%, #1a1025 50%, #0a0612 100%);
  --body-overlay: radial-gradient(circle at 30% 70%, rgba(139, 92, 246, 0.1) 0%, transparent 50%), radial-gradient(circle at 70% 30%, rgba(59, 130, 246, 0.08) 0%, transparent 50%);
  --primary-text: #e6d9ff;
  --heading-color: #fbbf24;
  --paragraph-color: #d4c1ff;
  --accent-primary: #fbbf24;
  --accent-secondary: #3b82f6;
  --accent-tertiary: #a855f7;
  --title-gradient: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);

  /* ===== EFFECTS ===== */
  --text-shadow: none;
  --glow-shadow: 0 0 25px rgba(168, 85, 247, 0.8), 0 0 50px rgba(139, 92, 246, 0.6);

  /* ===== NAVBAR ===== */
  --navbar-bg: rgba(10, 6, 18, 0.98);
  --navbar-border: 1px solid rgba(168, 85, 247, 0.3);
  --navbar-shadow: 0 4px 35px rgba(0, 0, 0, 0.9);

  /* ===== CONTENT AREAS ===== */
  --content-bg: rgba(26, 16, 37, 0.85);
  --content-border: 1px solid rgba(168, 85, 247, 0.25);
  --content-shadow: 0 15px 45px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  --section-border: 2px solid rgba(59, 130, 246, 0.4);

  /* ===== QUEST SECTIONS ===== */
  --quest-section-bg: rgba(26, 16, 37, 0.6);
  --quest-content-bg: rgba(26, 16, 37, 0.85);

  /* ===== QUEST LINKS ===== */
  --quest-link-bg: rgba(35, 25, 50, 0.9);
  --quest-link-border: 1px solid rgba(168, 85, 247, 0.35);
  --quest-link-text: #e6d9ff;
  --quest-link-shadow: 0 8px 25px rgba(0, 0, 0, 0.5);
  --quest-link-hover-overlay: linear-gradient(135deg, rgba(168, 85, 247, 0.15) 0%, rgba(16, 185, 129, 0.1) 100%);
  --quest-link-hover-shadow: 0 12px 40px rgba(168, 85, 247, 0.6);
  --quest-link-hover-text: #fbbf24;

  /* ===== NAVIGATION BUTTONS ===== */
  --nav-button-bg: rgba(168, 85, 247, 0.18);
  --nav-button-border: 1px solid rgba(168, 85, 247, 0.45);
  --nav-button-text: #e6d9ff;
  --nav-button-shadow: 0 8px 25px rgba(0, 0, 0, 0.5);
  --nav-button-hover-bg: rgba(168, 85, 247, 0.28);
  --nav-button-hover-text: #fbbf24;
  --nav-button-hover-shadow: 0 10px 30px rgba(168, 85, 247, 0.7);

  /* ===== CODE BLOCKS - ENCHANTED SYNTAX ===== */
  --code-block-bg: rgba(8, 5, 15, 0.95);
  --code-block-border: 1px solid rgba(168, 85, 247, 0.35);
  --code-block-shadow: 0 15px 40px rgba(0, 0, 0, 0.8);
  --code-pre-bg: rgba(5, 3, 10, 0.98);
  --code-text: #e6d9ff;

  /* ===== INLINE CODE ===== */
  --inline-code-text: #a855f7;

  /* ===== NAVIGATION PILLS ===== */
  --nav-link-text: #e6d9ff;
  
  --nav-quest-pill-bg: rgba(59, 130, 246, 0.25);
  --nav-quest-pill-border: 1px solid rgba(59, 130, 246, 0.55);
  --nav-quest-pill-shadow: 0 4px 15px rgba(59, 130, 246, 0.4);
  --nav-quest-pill-hover-bg: rgba(59, 130, 246, 0.35);
  --nav-quest-pill-hover-shadow: 0 8px 20px rgba(59, 130, 246, 0.6);
  
  --nav-theme-pill-bg: rgba(16, 185, 129, 0.25);
  --nav-theme-pill-border: 1px solid rgba(16, 185, 129, 0.55);
  --nav-theme-pill-shadow: 0 4px 15px rgba(16, 185, 129, 0.4);
  --nav-theme-pill-hover-bg: rgba(16, 185, 129, 0.35);
  --nav-theme-pill-hover-shadow: 0 8px 20px rgba(16, 185, 129, 0.6);
}

/* Mythical theme uses base navbar styles for consistency */