/*-- -------------------------- -->
<---   LifeOS Dark Mode Styles -->
<--- -------------------------- -*/

/* Dark mode specific overrides
 * Source: mockup lines 142, 257 (sidebar and header dark mode colors)
 * Note: Most dark mode colors handled by CSS variables in lifeos-variables.css
 * This file contains specific hex color overrides from the mockup
 */

/* Dark Mode Sidebar Background
 * Mockup specifies exact hex color: dark:bg-[#0F0F12]
 */
.dark .lifeos-sidebar {
    background-color: #0F0F12;
}

/* Dark Mode Header Background
 * Mockup specifies exact hex color: dark:bg-[#0F0F12]
 */
.dark .lifeos-header {
    background-color: #0F0F12;
}

/* Dark Mode Main Content Background
 * Mockup specifies exact hex color: dark:bg-[#0F0F12]
 */
.dark .lifeos-content {
    background-color: #0F0F12;
}

/* Dark Mode Borders
 * Mockup specifies exact hex color: dark:border-[#1F1F23]
 */
.dark .lifeos-sidebar {
    border-color: #1F1F23;
}

.dark .lifeos-header {
    border-color: #1F1F23;
}

.dark .sidebar-header,
.dark .sidebar-footer {
    border-color: #1F1F23;
}

.dark .lifeos-metric-card,
.dark .lifeos-dashboard-card {
    border-color: #1F1F23;
}

/* Dark Mode Card Backgrounds */
.dark .lifeos-metric-card,
.dark .lifeos-dashboard-card {
    background-color: #0F0F12;
}

/* Dark Mode Dropdown */
.dark .lifeos-dropdown {
    background-color: #0F0F12;
    border-color: #1F1F23;
}

/* Dark Mode Logo Icon Inversion */
.dark .logo-icon {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
}