/* custom-dashboard.css */
/* Make the sidebar header (brand area) dark to match the logo background */
.fi-sidebar-header {
    background-color: #0f172a !important;
    /* Slate-900, standard dark mode color */
    border-bottom-color: #1e293b !important;
    /* Slate-800 for subtle border */
}

/* Ensure text is white in the header */
.fi-sidebar-header .fi-logo {
    color: white !important;
}

/* Optional: Make the whole sidebar dark if requested later, but for now just the header as per "barra superior" which usually implies the brand area in sidebar layout */

/* Dark styling for the entire top bar */
.fi-topbar nav {
    background-color: #0f172a !important;
    /* Slate-900 */
    border-bottom: 1px solid #1e293b !important;
}

/* Ensure text and icons in the top bar are visible */
.fi-topbar nav .fi-icon-btn,
.fi-topbar nav .fi-btn,
.fi-topbar nav .text-gray-500,
.fi-topbar nav .text-gray-400,
.fi-topbar nav .text-gray-700 {
    color: #e2e8f0 !important;
    /* Slate-200 */
}

/* Adjust hover states for top bar buttons */
.fi-topbar nav .fi-icon-btn:hover {
    background-color: #1e293b !important;
}

/* FIX: Ensure dropdowns inside the nav (like user menu) have correct contrast */
/* Light Mode: White background, so force Dark Text */
.fi-topbar nav .fi-dropdown-list .fi-dropdown-list-item-label,
.fi-topbar nav .fi-dropdown-header-label {
    color: #1e293b !important;
    /* Slate-800 */
}

/* Dark Mode: Dark background, so force Light Text */
:is(.dark) .fi-topbar nav .fi-dropdown-list .fi-dropdown-list-item-label,
:is(.dark) .fi-topbar nav .fi-dropdown-header-label {
    color: #e2e8f0 !important;
    /* Slate-200 */
}

/* Icons: Dark in Light Mode, Light in Dark Mode */
.fi-topbar nav .fi-dropdown-list .fi-dropdown-list-item-icon {
    color: #64748b !important;
    /* Slate-500 - neutral enough for light mode */
}

:is(.dark) .fi-topbar nav .fi-dropdown-list .fi-dropdown-list-item-icon {
    color: #94a3b8 !important;
    /* Slate-400 for dark mode */
}