/* 🌊 TEMA AZUL — Sidebar oscuro, texto claro, acentos azules */
/* NO afecta sesión, login, ni configuración del servidor */

/* ============================== */
/* SIDEBAR                        */
/* ============================== */

/* Fondo oscuro */
.fi-sidebar {
    background-color: #0f172a !important;
}

.fi-sidebar-header {
    background-color: #0f172a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Brand name (Motos y Motos) visible sobre fondo oscuro */
.fi-sidebar-header .fi-logo {
    color: #ffffff !important;
}

.fi-sidebar-header .fi-logo a,
.fi-sidebar-header .fi-logo span,
.fi-sidebar-header .fi-brand-name {
    color: #ffffff !important;
}

.fi-sidebar-nav-groups {
    background-color: #0f172a !important;
}

/* Items inactivos — texto claro */
.fi-sidebar-item:not(.fi-active) .fi-sidebar-item-label {
    color: #f1f5f9 !important;
}

.fi-sidebar-item:not(.fi-active) .fi-sidebar-item-icon {
    color: #94a3b8 !important;
}

/* Hover en items inactivos */
.fi-sidebar-item-button:hover {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

/* Items activos — azul brillante */
.fi-sidebar-item.fi-active .fi-sidebar-item-label {
    color: #60a5fa !important;
}

.fi-sidebar-item.fi-active .fi-sidebar-item-icon {
    color: #60a5fa !important;
}

.fi-sidebar-item.fi-active .fi-sidebar-item-button {
    background-color: rgba(96, 165, 250, 0.1) !important;
}

/* ============================== */
/* TABS — botones                 */
/* ============================== */

/* Contenedor de tabs con fondo claro */
.fi-tabs {
    border-radius: 0.5rem !important;
}

/* Tab activo — fondo azul con texto blanco */
.fi-tabs-item.fi-active {
    background-color: #2563eb !important;
    border-radius: 0.5rem !important;
}

.fi-tabs-item.fi-active .fi-tabs-item-label {
    color: #ffffff !important;
}

.fi-tabs-item.fi-active .fi-tabs-item-icon {
    color: #ffffff !important;
}

/* Tabs inactivos — texto gris oscuro, hover sutil */
.fi-tabs-item:not(.fi-active) .fi-tabs-item-label {
    color: #374151 !important;
}

.fi-tabs-item:not(.fi-active):hover {
    background-color: #f3f4f6 !important;
    border-radius: 0.5rem !important;
}