/* assets/css/style.css */

:root {
    --navbar-height: 56px;
}

body {
    display: flex; /* <--- Asegura que el body use flexbox */
    min-height: 100vh;
    flex-direction: column; /* Apilar navbar y main-container verticalmente */
    padding-top: var(--navbar-height); /* Espacio global para la navbar fija */
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* --- Barra Superior (Navbar) --- */
.navbar.fixed-top { /* Asegurar que es fixed-top */
    height: var(--navbar-height);
    z-index: 1030;
}


/* --- Contenedor Principal (Wrapper para Sidebar + Content) --- */
.main-wrapper {
    display: flex; /* <--- CONTENEDOR FLEX para sidebar y content */
    flex-grow: 1; /* Ocupa el espacio vertical restante */
    width: 100%;
    position: relative; /* Necesario para algunos posicionamientos internos si se usan */
}


/* --- Sidebar --- */
#sidebar {
    min-width: 250px;
    max-width: 250px;
    height: calc(100vh - var(--navbar-height)); /* Altura correcta */
    position: sticky; /* Fijo al hacer scroll */
    top: var(--navbar-height); /* Empieza debajo de la navbar */
    background-color: var(--bs-dark);
    color: var(--bs-light);
    transition: background-color 0.3s ease;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    overflow-y: auto; /* Scroll interno */
    z-index: 1020; /* Debajo de la navbar pero sobre el contenido si hay solapamiento */
}
#sidebar .nav-sidebar { /* El UL principal */
   flex-grow: 1; /* Ocupa espacio disponible */
}
/* Estilos de enlaces y demás del sidebar (igual que antes) */
#sidebar .nav-link { color: rgba(255, 255, 255, 0.8); padding: 0.75rem 1rem; font-size: 0.95rem; border-bottom: 1px solid #495057; transition: all 0.2s; }
#sidebar .nav-link:last-child { border-bottom: none; }
#sidebar .nav-link:hover, #sidebar .nav-link.active { color: #fff; background-color: #495057; text-decoration: none; }
#sidebar .nav-link .fa-fw { margin-right: 10px; width: 1.2em; }
#sidebar .sidebar-header { display: none; } /* Oculto */
#sidebar .nav-logout { display: none; } /* Oculto */


/* --- Área de Contenido --- */
#content {
    flex-grow: 1; /* Ocupa el espacio restante horizontal */
    padding: 25px;
    min-height: calc(100vh - var(--navbar-height)); /* Altura mínima */
    overflow-y: auto; /* Scroll interno */
    background-color: var(--bs-light-bg-subtle);
    transition: background-color 0.3s ease;
}

/* --- Estilos Dark Mode --- */
[data-bs-theme="dark"] #sidebar { background-color: var(--bs-gray-900); border-right: 1px solid var(--bs-border-color); }
[data-bs-theme="dark"] #content { background-color: var(--bs-dark-bg-subtle); }
/* ... (resto de estilos dark mode y switch sin cambios) ... */
.theme-switch-wrapper { display: flex; align-items: center; }
.theme-switch { display: inline-block; height: 24px; position: relative; width: 48px; }
.theme-switch input { display: none; }
.slider { background-color: #ccc; bottom: 0; cursor: pointer; left: 0; position: absolute; right: 0; top: 0; transition: .4s; }
.slider:before { background-color: #fff; bottom: 4px; content: ""; height: 16px; left: 4px; position: absolute; transition: .4s; width: 16px; }
input:checked + .slider { background-color: #66bb6a; }
input:checked + .slider:before { transform: translateX(24px); }
.slider.round { border-radius: 24px; }
.slider.round:before { border-radius: 50%; }
.theme-switch-wrapper .fa-sun, .theme-switch-wrapper .fa-moon { margin: 0 8px; color: var(--bs-navbar-color); }