/*
 * Minimal Obsidian Publish Theme
 * Author: 4bakker
 * 
 * A clean vanilla foundation with warm cream colors and system fonts.
 * Designed as a minimal starting point to build upon.
 */

/* ===== SYSTEM FONT STACK ===== */
body {
    --font-text: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --font-monospace: ui-monospace, "SF Mono", Menlo, Monaco, "Cascadia Mono", "Consolas", monospace;
    
    --font-text-theme: var(--font-text);
    --font-interface-theme: var(--font-text);
    --font-monospace-theme: var(--font-monospace);
}

/* ===== LIGHT MODE - Warm Cream ===== */
.theme-light {
    --background-primary: #f8f5f0;
    --background-primary-alt: #f0ebe3;
    --background-secondary: #f0ebe3;
    --background-secondary-alt: #e8e3da;
    --background-modifier-border: #ddd8cc;
    
    --text-normal: #2c2c2c;
    --text-muted: #6b6b6b;
    --text-faint: #999999;
    --text-accent: #1a4b7c;
    --text-accent-hover: #0d3a5e;
    
    --interactive-normal: #f0ebe3;
    --interactive-hover: #e8e3da;
    --interactive-accent: #1a4b7c;
}

/* ===== SEARCH BOX ===== */
.search-input-container input,
input[type="text"].search-input {
    background-color: var(--background-primary);
    border: 1px solid var(--background-modifier-border);
    border-radius: 6px;
}

.theme-light .search-input-container input,
.theme-light input[type="text"].search-input {
    background-color: #f0ebe3;
}

/* ===== MERMAID DIAGRAMS - Responsive ===== */
.mermaid {
    max-width: 100%;
    overflow-x: auto;
}

.mermaid svg {
    max-width: 100%;
    height: auto;
}

/* ===== DARK MODE - Warm Dark ===== */
.theme-dark {
    --background-primary: #1c1b19;
    --background-primary-alt: #252320;
    --background-secondary: #252320;
    --background-secondary-alt: #2f2d29;
    --background-modifier-border: #3a3835;
    
    --text-normal: #e5e2db;
    --text-muted: #9a968e;
    --text-faint: #5a5752;
    --text-accent: #7aabd4;
    --text-accent-hover: #b8d4ed;
    
    --interactive-normal: #252320;
    --interactive-hover: #2f2d29;
    --interactive-accent: #7aabd4;
}