﻿
/* PHI Dark Mode Override */
:root {
    --phi-bg: #0f1117;
    --phi-card-bg: #16181f;
    --phi-border: rgba(255,255,255,0.08);
    --phi-text: #e5e7eb;
    --phi-text-muted: #9ca3af;
    --phi-accent: #4f46e5;
    --phi-accent-rgb: 79, 70, 229;
}

/* Apply styles IF body has .dark-mode class OR (if no preference is saved) system is dark */
body.dark-mode {
    background-color: var(--phi-bg) !important;
    color: var(--phi-text) !important;
}

body.dark-mode .bg-light { background-color: var(--phi-card-bg) !important; }
body.dark-mode .text-dark { color: var(--phi-text) !important; }
body.dark-mode .card {
    background-color: var(--phi-card-bg) !important;
    border-color: var(--phi-border) !important;
    color: var(--phi-text) !important;
}
body.dark-mode .card-header {
    background-color: rgba(255,255,255,0.03) !important;
    border-bottom-color: var(--phi-border) !important;
}
body.dark-mode .gallery-pill {
    background-color: rgba(255,255,255,0.05) !important;
    border-color: var(--phi-border) !important;
    color: var(--phi-text-muted) !important;
}
body.dark-mode .gallery-pill:hover, body.dark-mode .gallery-pill.active {
    background-color: var(--phi-accent) !important;
    color: #fff !important;
}
body.dark-mode .form-control, body.dark-mode .form-select {
    background-color: rgba(255,255,255,0.05) !important;
    border-color: var(--phi-border) !important;
    color: var(--phi-text) !important;
}
body.dark-mode #ai-dropzone {
    background-color: rgba(255,255,255,0.02) !important;
    border: 2px dashed var(--phi-border) !important;
}
body.dark-mode .ai-crop-item {
    background-color: var(--phi-card-bg) !important;
    border-color: var(--phi-border) !important;
}
body.dark-mode pre, body.dark-mode code {
    background-color: #000 !important;
    color: #10b981 !important;
    border-color: var(--phi-border) !important;
}
body.dark-mode header {
    background-color: rgba(15, 17, 23, 0.9) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--phi-border);
}
body.dark-mode .accordion-button {
    background-color: var(--phi-card-bg) !important;
    color: var(--phi-text) !important;
}
