/* Dark mode readability boost — overrides inline :root defaults */
[data-theme="dark"], :root:not([data-theme]) {
    --text-muted: rgba(240,237,232,0.85);
    --text-dim: rgba(240,237,232,0.55);
}

/* Light mode overrides for CSS-variable templates */
[data-theme="light"] {
    --bg: #f0ebe0;
    --surface: #f8f5ef;
    --surface-2: #e8e3d8;
    --surface-3: #dfd9cd;
    --border: rgba(0,0,0,0.10);
    --border-hover: rgba(0,0,0,0.18);
    --amber: #a07015;
    --amber-dim: rgba(160,112,21,0.10);
    --text: #1a1917;
    --text-muted: rgba(26,25,23,0.82);
    --text-dim: rgba(26,25,23,0.50);
    --error: #dc2626;
    --green: rgba(22,163,74,0.9);
    --blue: rgba(37,99,235,0.85);
    --red: rgba(220,38,38,0.85);
}

/* Reduce grain overlay in light mode */
[data-theme="light"] body::before {
    opacity: 0.018;
}

/* Header glass effect */
[data-theme="light"] header {
    background: rgba(248,247,244,0.85) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

/* Fix hardcoded navbar backgrounds for simple templates */
[data-theme="light"] #navbar {
    background-color: rgba(248,247,244,0.9) !important;
    border-bottom-color: rgba(0,0,0,0.08) !important;
}

/* Override hardcoded dark backgrounds on simple templates */
[data-theme="light"] body {
    background-color: var(--bg, #f8f7f4);
    color: var(--text, #1a1917);
}

/* Tailwind hardcoded color overrides for simple templates */
[data-theme="light"] .bg-black { background-color: #f8f7f4 !important; }
[data-theme="light"] .bg-gray-900 { background-color: #f1efeb !important; }
[data-theme="light"] .bg-gray-800 { background-color: #e9e7e2 !important; }
[data-theme="light"] .border-gray-800,
[data-theme="light"] .border-gray-700 { border-color: rgba(0,0,0,0.1) !important; }
[data-theme="light"] .text-white { color: #1a1917 !important; }
[data-theme="light"] .text-gray-300 { color: #555 !important; }
[data-theme="light"] .text-gray-400 { color: #666 !important; }
[data-theme="light"] .text-gray-500 { color: #777 !important; }
[data-theme="light"] .bg-red-900 { background-color: #fef2f2 !important; }
[data-theme="light"] .border-red-700 { border-color: #fca5a5 !important; }
[data-theme="light"] .text-red-200 { color: #991b1b !important; }

/* Form inputs on simple templates */
[data-theme="light"] .form-input {
    border-bottom-color: #d1d5db !important;
    color: #1a1917 !important;
}
[data-theme="light"] .form-input::placeholder { color: #9ca3af !important; }

/* Card backgrounds */
[data-theme="light"] .project-card,
[data-theme="light"] [style*="background:var(--surface)"],
[data-theme="light"] [style*="background: var(--surface)"] {
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

/* Theme toggle button */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    border: 1px solid var(--border, rgba(255,255,255,0.07));
    background: transparent;
    color: var(--text-muted, rgba(240,237,232,0.48));
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
    flex-shrink: 0;
}
.theme-toggle:hover {
    border-color: var(--border-hover, rgba(255,255,255,0.14));
    color: var(--text, #f0ede8);
}
.theme-toggle .icon-sun,
.theme-toggle .icon-moon { display: none; }
[data-theme="dark"] .theme-toggle .icon-sun,
:root:not([data-theme]) .theme-toggle .icon-sun { display: block; }
[data-theme="light"] .theme-toggle .icon-moon { display: block; }
[data-theme="light"] .theme-toggle .icon-sun { display: none; }