/* Custom Sidebar & Topbar Style - Indigo Theme */

/* --- Sidebar Styling --- */
.fi-sidebar {
    background-color: #1e1b4b !important; /* Darker Indigo 950 */
    border-right: 1px solid #312e81 !important; /* Indigo 900 */
}

/* Sidebar header / Brand area */
.fi-sidebar-header {
    background-color: #1e1b4b !important;
    border-bottom: 1px solid #312e81 !important;
}

/* Ensure text in the sidebar brand area is white */
.fi-sidebar-header *,
.fi-sidebar-brand,
.fi-sidebar-brand * {
    color: #ffffff !important;
}

/* Sidebar group headers */
.fi-sidebar-group-label {
    color: #a5b4fc !important; /* Indigo 300 */
    font-weight: 600 !important;
}

/* Inactive sidebar items - text */
.fi-sidebar-item-label {
    color: #c7d2fe !important; /* Indigo 200 */
    font-weight: 500 !important;
}

/* Inactive sidebar items - icons */
.fi-sidebar-item a svg,
.fi-sidebar-item button svg {
    color: #a5b4fc !important; /* Indigo 300 */
}

/* Sidebar item hover state */
.fi-sidebar-item > a:hover,
.fi-sidebar-item > button:hover {
    background-color: #312e81 !important; /* Indigo 900 */
    border-radius: 0.5rem !important;
}
.fi-sidebar-item > a:hover .fi-sidebar-item-label,
.fi-sidebar-item > button:hover .fi-sidebar-item-label,
.fi-sidebar-item > a:hover svg,
.fi-sidebar-item > button:hover svg {
    color: #ffffff !important;
}

/* Active sidebar item */
.fi-sidebar-item.fi-active > a,
.fi-sidebar-item.fi-active > button {
    background-color: #4f46e5 !important; /* Indigo 600 */
    border-radius: 0.5rem !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

.fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar-item.fi-active a svg,
.fi-sidebar-item.fi-active button svg {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Ensure badges keep their intended color */
.fi-badge span,
.fi-badge {
    color: #166534 !important; /* Dark green for visibility on light green badge */
}

/* Collapsible sidebar chevron style */
.fi-sidebar-group button svg {
    color: #c7d2fe !important;
}

/* Custom Scrollbar for Sidebar (Targets the scrolling container inside) */
.fi-sidebar * {
    scrollbar-width: thin !important;
    scrollbar-color: #312e81 transparent !important;
}

.fi-sidebar *::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important;
}
.fi-sidebar *::-webkit-scrollbar-track {
    background: transparent !important;
}
.fi-sidebar *::-webkit-scrollbar-thumb {
    background-color: #312e81 !important; /* Indigo 900 */
    border-radius: 10px !important;
}
.fi-sidebar *::-webkit-scrollbar-thumb:hover {
    background-color: #4f46e5 !important; /* Indigo 600 */
}

/* --- Topbar Styling --- */
.fi-topbar,
.fi-topbar > nav,
.fi-topbar > div,
.fi-topbar-header,
header.fi-topbar {
    background-color: #1e1b4b !important; /* Darker Indigo 950 */
    border-bottom: 1px solid #312e81 !important; /* Indigo 900 */
}

/* Topbar text/icons */
.fi-logo,
.fi-logo *,
.fi-topbar-brand,
.fi-topbar-header-title,
.fi-topbar-header-title * {
    color: #ffffff !important;
}

.fi-topbar button svg,
.fi-topbar-menu-button svg,
.fi-topbar-open-sidebar-button svg {
    color: #c7d2fe !important;
}

.fi-topbar button:hover svg,
.fi-topbar-menu-button:hover svg,
.fi-topbar-open-sidebar-button:hover svg {
    color: #ffffff !important;
}

/* Corrección para que el menú de usuario en la barra superior tenga buen contraste cuando se abre */
.fi-dropdown-panel {
    background-color: #ffffff !important; /* Blanco para el menú desplegable */
}
.fi-dropdown-panel * {
    color: #1f2937 !important; /* Texto oscuro para el menú desplegable */
}