/* GoldStar Solar - Dynamic CSS (SaaS White Label) */
:root {
    --primary-color: #f39c12;
    --primary-hover: #f39c12cc;
    --secondary-color: #2c3e50;
    --bg-color: #f4f6f9;
    --text-color: #333;
    --white: #ffffff;
    --gray-light: #ecf0f1;
    --card-bg: #ffffff;
    --border-color: #ddd;
    --danger: #e74c3c;
    --success: #27ae60;
    --menu-text: #fff;
    --menu-bg-mobile: #fff;
}

body.dark-mode {
    --bg-color: #1a1a1a;
    --text-color: #e0e0e0;
    --white: #2c2c2c;
    --card-bg: #2c2c2c;
    --gray-light: #3a3a3a;
    --border-color: #444;
    --secondary-color: #ecf0f1;
    --menu-text: #eee;
    --menu-bg-mobile: #2c2c2c;
}

/* Dark Mode Specific Overrides */
body.dark-mode .navbar {
    background-color: #000;
    border-bottom: 1px solid #333;
}
body.dark-mode .navbar .brand {
    color: var(--primary-color) !important;
}
body.dark-mode .navbar a,
body.dark-mode .navbar span {
    color: var(--menu-text);
}
body.dark-mode .card, 
body.dark-mode .form-container,
body.dark-mode table,
body.dark-mode .filter-bar, 
body.dark-mode .chart-container,
body.dark-mode .modal-content {
    background-color: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
    border-top-color: var(--primary-color);
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); /* Darker shadow for dark mode */
}
body.dark-mode .card p,
body.dark-mode .dashboard-header p,
body.dark-mode label {
    color: #bbb;
}
body.dark-mode th {
    background-color: #333;
    color: #fff;
    border-bottom-color: #555;
}
body.dark-mode td {
    border-bottom-color: var(--border-color);
    color: var(--text-color);
}
body.dark-mode tr:hover {
    background-color: #333;
}
body.dark-mode input, 
body.dark-mode select, 
body.dark-mode textarea {
    background-color: #333;
    color: #fff;
    border-color: #555;
}
body.dark-mode .header h1,
body.dark-mode .dashboard-header h1,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3 {
    color: #fff;
}
/* Mobile Menu Dark Mode */
@media (max-width: 768px) {
    body.dark-mode .navbar .menu {
        background-color: var(--menu-bg-mobile);
        padding: 10px;
        border-radius: 8px;
    }
}

/* Custom Overrides from Config */
.navbar .brand {
    color: var(--primary-color) !important;
}

body {
    background-color: var(--bg-color);
}