/* ===== THEME SYSTEM ===== */
/* Multiple color schemes with clear, understandable colors */

:root {
    --theme-transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

* {
    transition: var(--theme-transition);
}

/* ===== LIGHT THEME (Default) ===== */
:root {
    /* Background Colors */
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --bg-tertiary: #e9ecef;
    --bg-accent: #f0f8ff;
    
    /* Text Colors */
    --text-primary: #212529;
    --text-secondary: #6c757d;
    --text-muted: #868e96;
    --text-accent: #0066cc;
    
    /* Border & Shadow */
    --border-color: #dee2e6;
    --border-accent: #007acc;
    --shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.15);
    
    /* Action Colors */
    --primary-color: #007acc;
    --primary-hover: #005a9e;
    --secondary-color: #6c757d;
    --success-color: #28a745;
    --danger-color: #dc3545;
    --warning-color: #ffc107;
    --info-color: #17a2b8;
}

/* ===== DARK THEME ===== */
[data-theme="dark"] {
    /* Background Colors */
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #404040;
    --bg-accent: #1e2a3a;
    
    /* Text Colors */
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --text-accent: #66b3ff;
    
    /* Border & Shadow */
    --border-color: #404040;
    --border-accent: #4da6ff;
    --shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.4);
    
    /* Action Colors */
    --primary-color: #4da6ff;
    --primary-hover: #3399ff;
    --secondary-color: #6c757d;
    --success-color: #4caf50;
    --danger-color: #ff6b6b;
    --warning-color: #ffb74d;
    --info-color: #29b6f6;
}

/* ===== BLUE THEME ===== */
[data-theme="blue"] {
    /* Background Colors */
    --bg-primary: #f0f4f8;
    --bg-secondary: #e2e8f0;
    --bg-tertiary: #cbd5e0;
    --bg-accent: #ebf8ff;
    
    /* Text Colors */
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --text-accent: #2b6cb0;
    
    /* Border & Shadow */
    --border-color: #cbd5e0;
    --border-accent: #3182ce;
    --shadow: 0 2px 4px rgba(66, 153, 225, 0.1);
    --shadow-lg: 0 4px 12px rgba(66, 153, 225, 0.15);
    
    /* Action Colors */
    --primary-color: #3182ce;
    --primary-hover: #2c5282;
    --secondary-color: #718096;
    --success-color: #38a169;
    --danger-color: #e53e3e;
    --warning-color: #d69e2e;
    --info-color: #0bc5ea;
}

/* ===== GREEN THEME ===== */
[data-theme="green"] {
    /* Background Colors */
    --bg-primary: #f0fff4;
    --bg-secondary: #e6fffa;
    --bg-tertiary: #c6f6d5;
    --bg-accent: #f0fff4;
    
    /* Text Colors */
    --text-primary: #1a202c;
    --text-secondary: #2d3748;
    --text-muted: #4a5568;
    --text-accent: #2f855a;
    
    /* Border & Shadow */
    --border-color: #c6f6d5;
    --border-accent: #38a169;
    --shadow: 0 2px 4px rgba(72, 187, 120, 0.1);
    --shadow-lg: 0 4px 12px rgba(72, 187, 120, 0.15);
    
    /* Action Colors */
    --primary-color: #38a169;
    --primary-hover: #2f855a;
    --secondary-color: #718096;
    --success-color: #48bb78;
    --danger-color: #f56565;
    --warning-color: #ed8936;
    --info-color: #4299e1;
}

/* ===== PURPLE THEME ===== */
[data-theme="purple"] {
    /* Background Colors */
    --bg-primary: #faf5ff;
    --bg-secondary: #f3e8ff;
    --bg-tertiary: #e9d5ff;
    --bg-accent: #faf5ff;
    
    /* Text Colors */
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --text-accent: #7c3aed;
    
    /* Border & Shadow */
    --border-color: #e9d5ff;
    --border-accent: #8b5cf6;
    --shadow: 0 2px 4px rgba(139, 92, 246, 0.1);
    --shadow-lg: 0 4px 12px rgba(139, 92, 246, 0.15);
    
    /* Action Colors */
    --primary-color: #8b5cf6;
    --primary-hover: #7c3aed;
    --secondary-color: #718096;
    --success-color: #10b981;
    --danger-color: #ef4444;
    --warning-color: #f59e0b;
    --info-color: #06b6d4;
}

/* ===== ORANGE THEME ===== */
[data-theme="orange"] {
    /* Background Colors */
    --bg-primary: #fffaf0;
    --bg-secondary: #fef5e7;
    --bg-tertiary: #fed7aa;
    --bg-accent: #fff7ed;
    
    /* Text Colors */
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --text-accent: #ea580c;
    
    /* Border & Shadow */
    --border-color: #fed7aa;
    --border-accent: #f97316;
    --shadow: 0 2px 4px rgba(249, 115, 22, 0.1);
    --shadow-lg: 0 4px 12px rgba(249, 115, 22, 0.15);
    
    /* Action Colors */
    --primary-color: #f97316;
    --primary-hover: #ea580c;
    --secondary-color: #718096;
    --success-color: #059669;
    --danger-color: #dc2626;
    --warning-color: #d97706;
    --info-color: #0891b2;
}

/* ===== HIGH CONTRAST THEME ===== */
[data-theme="high-contrast"] {
    /* Background Colors */
    --bg-primary: #ffffff;
    --bg-secondary: #f0f0f0;
    --bg-tertiary: #e0e0e0;
    --bg-accent: #f8f8f8;
    
    /* Text Colors */
    --text-primary: #000000;
    --text-secondary: #333333;
    --text-muted: #666666;
    --text-accent: #0000ff;
    
    /* Border & Shadow */
    --border-color: #000000;
    --border-accent: #0000ff;
    --shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.6);
    
    /* Action Colors */
    --primary-color: #0000ff;
    --primary-hover: #0000cc;
    --secondary-color: #666666;
    --success-color: #008000;
    --danger-color: #ff0000;
    --warning-color: #ff8000;
    --info-color: #0080ff;
}

/* ===== THEME-SPECIFIC ADJUSTMENTS ===== */

/* Drop zone hover effects */
.drop-zone:hover,
.drop-zone.dragover {
    background-color: var(--bg-accent);
    border-color: var(--border-accent);
}

/* Input focus effects */
#markdown-input:focus {
    border-color: var(--border-accent);
    box-shadow: 0 0 0 3px rgba(var(--primary-color), 0.1);
}

/* Code styling */
.preview-content code {
    background-color: var(--bg-tertiary);
    color: var(--danger-color);
}

.preview-content pre {
    background-color: var(--bg-secondary);
    border-color: var(--border-color);
}

/* Blockquote styling */
.preview-content blockquote {
    background-color: var(--bg-accent);
    border-left-color: var(--primary-color);
}

/* Table styling */
.preview-content table {
    background-color: var(--bg-primary);
    box-shadow: var(--shadow);
}

.preview-content th {
    background-color: var(--bg-secondary);
}

.preview-content tr:nth-child(even) {
    background-color: var(--bg-accent);
}

/* Button hover effects */
.btn-icon:hover {
    background-color: var(--bg-tertiary);
}

.toc-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--primary-color);
}

.toc-link.active {
    background-color: var(--primary-color);
    color: white;
}

/* ===== DARK THEME SPECIFIC OVERRIDES ===== */
[data-theme="dark"] .preview-content tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

/* ===== PRISM.JS THEME SWITCHING ===== */
[data-theme="dark"] #prism-dark-theme {
    display: block !important;
}

[data-theme="dark"] link[href*="prism-enhanced.min.css"]:not(#prism-dark-theme),
[data-theme="dark"] link[href*="prism.min.css"]:not(#prism-dark-theme) {
    display: none !important;
}

/* Enhanced code block styling for all themes */
.preview-content pre[class*="language-"] {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
    box-shadow: var(--shadow) !important;
}

.preview-content :not(pre) > code[class*="language-"] {
    background: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--danger-color) !important;
}

/* Theme-specific code block enhancements */
[data-theme="dark"] .preview-content pre[class*="language-"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.3) !important;
}

[data-theme="dark"] .preview-content :not(pre) > code[class*="language-"] {
    background: #334155 !important;
    border-color: #475569 !important;
}

[data-theme="blue"] .preview-content pre[class*="language-"] {
    background: #ebf8ff !important;
    border-color: #bee3f8 !important;
}

[data-theme="green"] .preview-content pre[class*="language-"] {
    background: #f0fff4 !important;
    border-color: #c6f6d5 !important;
}

[data-theme="purple"] .preview-content pre[class*="language-"] {
    background: #faf5ff !important;
    border-color: #e9d5ff !important;
}

[data-theme="orange"] .preview-content pre[class*="language-"] {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
}

[data-theme="high-contrast"] .preview-content pre[class*="language-"] {
    background: #f8f8f8 !important;
    border-color: #000000 !important;
    border-width: 2px !important;
}

/* ===== THEME-SPECIFIC MATH BLOCK STYLING ===== */
/* Enhanced math block styling for proper contrast across all themes */

/* Default light theme math blocks */
.preview-content .math-block {
    background-color: #f8f9fa !important;
    border-color: #dee2e6 !important;
    color: #212529 !important;
}

.preview-content .math-block .MathJax,
.preview-content .math-block mjx-container,
.preview-content .math-block mjx-container *,
.preview-content .math-block .MathJax *,
.preview-content .math-block .MathJax_Display,
.preview-content .math-block .MathJax_Display * {
    color: #212529 !important;
    background: transparent !important;
}

.preview-content .math-inline .MathJax,
.preview-content .math-inline mjx-container,
.preview-content .math-inline mjx-container *,
.preview-content .math-inline .MathJax * {
    color: #212529 !important;
    background: transparent !important;
}

/* Dark theme math blocks */
[data-theme="dark"] .preview-content .math-block {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
    color: #ffffff !important;
}

[data-theme="dark"] .preview-content .math-block .MathJax,
[data-theme="dark"] .preview-content .math-block mjx-container,
[data-theme="dark"] .preview-content .math-block mjx-container *,
[data-theme="dark"] .preview-content .math-block .MathJax *,
[data-theme="dark"] .preview-content .math-block .MathJax_Display,
[data-theme="dark"] .preview-content .math-block .MathJax_Display * {
    color: #ffffff !important;
    background: transparent !important;
}

/* Blue theme math blocks */
[data-theme="blue"] .preview-content .math-block {
    background-color: #ebf8ff !important;
    border-color: #bee3f8 !important;
    color: #1a202c !important;
}

[data-theme="blue"] .preview-content .math-block .MathJax,
[data-theme="blue"] .preview-content .math-block mjx-container,
[data-theme="blue"] .preview-content .math-block mjx-container *,
[data-theme="blue"] .preview-content .math-block .MathJax *,
[data-theme="blue"] .preview-content .math-block .MathJax_Display,
[data-theme="blue"] .preview-content .math-block .MathJax_Display * {
    color: #1a202c !important;
    background: transparent !important;
}

/* Green theme math blocks */
[data-theme="green"] .preview-content .math-block {
    background-color: #f0fff4 !important;
    border-color: #c6f6d5 !important;
    color: #1a202c !important;
}

[data-theme="green"] .preview-content .math-block .MathJax,
[data-theme="green"] .preview-content .math-block mjx-container,
[data-theme="green"] .preview-content .math-block mjx-container *,
[data-theme="green"] .preview-content .math-block .MathJax *,
[data-theme="green"] .preview-content .math-block .MathJax_Display,
[data-theme="green"] .preview-content .math-block .MathJax_Display * {
    color: #1a202c !important;
    background: transparent !important;
}

/* Purple theme math blocks */
[data-theme="purple"] .preview-content .math-block {
    background-color: #faf5ff !important;
    border-color: #e9d5ff !important;
    color: #1a202c !important;
}

[data-theme="purple"] .preview-content .math-block .MathJax,
[data-theme="purple"] .preview-content .math-block mjx-container,
[data-theme="purple"] .preview-content .math-block mjx-container *,
[data-theme="purple"] .preview-content .math-block .MathJax *,
[data-theme="purple"] .preview-content .math-block .MathJax_Display,
[data-theme="purple"] .preview-content .math-block .MathJax_Display * {
    color: #1a202c !important;
    background: transparent !important;
}

/* Orange theme math blocks */
[data-theme="orange"] .preview-content .math-block {
    background-color: #fff7ed !important;
    border-color: #fed7aa !important;
    color: #1a202c !important;
}

[data-theme="orange"] .preview-content .math-block .MathJax,
[data-theme="orange"] .preview-content .math-block mjx-container,
[data-theme="orange"] .preview-content .math-block mjx-container *,
[data-theme="orange"] .preview-content .math-block .MathJax *,
[data-theme="orange"] .preview-content .math-block .MathJax_Display,
[data-theme="orange"] .preview-content .math-block .MathJax_Display * {
    color: #1a202c !important;
    background: transparent !important;
}

/* High contrast theme math blocks */
[data-theme="high-contrast"] .preview-content .math-block {
    background-color: #ffffff !important;
    border-color: #000000 !important;
    border-width: 2px !important;
    color: #000000 !important;
}

[data-theme="high-contrast"] .preview-content .math-block .MathJax,
[data-theme="high-contrast"] .preview-content .math-block mjx-container,
[data-theme="high-contrast"] .preview-content .math-block mjx-container *,
[data-theme="high-contrast"] .preview-content .math-block .MathJax *,
[data-theme="high-contrast"] .preview-content .math-block .MathJax_Display,
[data-theme="high-contrast"] .preview-content .math-block .MathJax_Display * {
    color: #000000 !important;
    background: transparent !important;
    font-weight: 600 !important;
}

/* Inline math theme-specific styling */
[data-theme="dark"] .preview-content .math-inline .MathJax,
[data-theme="dark"] .preview-content .math-inline mjx-container,
[data-theme="dark"] .preview-content .math-inline mjx-container *,
[data-theme="dark"] .preview-content .math-inline .MathJax * {
    color: #ffffff !important;
    background: transparent !important;
}

[data-theme="high-contrast"] .preview-content .math-inline .MathJax,
[data-theme="high-contrast"] .preview-content .math-inline mjx-container,
[data-theme="high-contrast"] .preview-content .math-inline mjx-container *,
[data-theme="high-contrast"] .preview-content .math-inline .MathJax * {
    color: #000000 !important;
    background: transparent !important;
    font-weight: 600 !important;
}

/* ===== SCROLLBAR THEMING ===== */
::-webkit-scrollbar-track {
    background: var(--bg-secondary);
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* ===== SELECTION COLORS ===== */
::selection {
    background-color: var(--bg-accent);
    color: var(--text-primary);
}

/* ===== FOCUS INDICATORS ===== */
.btn:focus,
.toc-link:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* ===== ACCESSIBILITY SUPPORT ===== */
@media (prefers-contrast: high) {
    :root {
        --border-color: #000000;
        --text-secondary: #000000;
    }
    
    [data-theme="dark"] {
        --border-color: #ffffff;
        --text-secondary: #ffffff;
    }
}

@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
    }
    
    .sidebar {
        transition: none !important;
    }
    
    .content-area {
        transition: none !important;
    }
}

/* ===== SYSTEM THEME PREFERENCE ===== */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --bg-primary: #1a1a1a;
        --bg-secondary: #2d2d2d;
        --bg-tertiary: #404040;
        --bg-accent: #1e2a3a;
        
        --text-primary: #ffffff;
        --text-secondary: #b3b3b3;
        --text-muted: #808080;
        --text-accent: #66b3ff;
        
        --border-color: #404040;
        --border-accent: #4da6ff;
        --shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
        --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.4);
        
        --primary-color: #4da6ff;
        --primary-hover: #3399ff;
    }
}

/* ===== PRINT THEME OVERRIDE ===== */
@media print {
    [data-theme] {
        --bg-primary: #ffffff !important;
        --bg-secondary: #ffffff !important;
        --bg-tertiary: #f8f9fa !important;
        --bg-accent: #f8f9fa !important;
        
        --text-primary: #000000 !important;
        --text-secondary: #333333 !important;
        --text-muted: #666666 !important;
        --text-accent: #000000 !important;
        
        --border-color: #dee2e6 !important;
        --border-accent: #000000 !important;
        --shadow: none !important;
        --shadow-lg: none !important;
        
        --primary-color: #000000 !important;
        --primary-hover: #000000 !important;
        --secondary-color: #666666 !important;
        --success-color: #000000 !important;
        --danger-color: #000000 !important;
        --warning-color: #000000 !important;
        --info-color: #000000 !important;
    }
    
    /* Reset all theme-specific code styling for print */
    .preview-content code {
        background-color: #f0f0f0 !important;
        color: #000000 !important;
        border: 1px solid #ddd !important;
    }
    
    .preview-content pre {
        background-color: #f8f9fa !important;
        border-color: #dee2e6 !important;
        box-shadow: none !important;
    }
    
    .preview-content blockquote {
        background-color: #f8f9fa !important;
        border-left-color: #000000 !important;
        box-shadow: none !important;
    }
    
    /* Override all theme-specific code block styling */
    .preview-content pre[class*="language-"] {
        background: #f8f9fa !important;
        border: 1px solid #dee2e6 !important;
        border-radius: 4pt !important;
        box-shadow: none !important;
    }
    
    .preview-content :not(pre) > code[class*="language-"] {
        background: #f0f0f0 !important;
        border: 1px solid #ddd !important;
        color: #000000 !important;
    }
    
    /* Ensure all Highlight.js elements use print colors */
    .preview-content .hljs,
    .preview-content .hljs * {
        background: transparent !important;
        text-shadow: none !important;
    }
    
    /* Override any remaining theme-specific elements */
    .preview-content table {
        background-color: #ffffff !important;
        box-shadow: none !important;
    }
    
    .preview-content th {
        background-color: #f8f9fa !important;
    }
    
    .preview-content tr:nth-child(even) {
        background-color: #f8f9fa !important;
    }
    
    /* Math and Mermaid containers */
    .preview-content .math-block {
        background-color: #ffffff !important;
        border-color: #dee2e6 !important;
        box-shadow: none !important;
        color: #000000 !important;
    }
    
    .preview-content .math-block .MathJax,
    .preview-content .math-block mjx-container,
    .preview-content .math-block mjx-container *,
    .preview-content .math-block .MathJax *,
    .preview-content .math-block .MathJax_Display,
    .preview-content .math-block .MathJax_Display * {
        color: #000000 !important;
        background: transparent !important;
    }
    
    .preview-content .mermaid-container {
        background-color: #ffffff !important;
        border-color: #dee2e6 !important;
        box-shadow: none !important;
    }
    
    /* Task lists */
    .preview-content .task-checkbox {
        accent-color: #000000 !important;
    }
    
    /* Links */
    .preview-content a {
        color: #000000 !important;
    }
    
    .preview-content .footnote-ref,
    .preview-content .footnote-backref {
        color: #000000 !important;
    }
}