:root { --blue-lara: #0d6efd; --gray-dark: #2c3e50; --bg-light: #f8f9fa; }
body { background-color: var(--bg-light); overflow-x: hidden; }
#sidebar-wrapper { min-width: 250px; max-width: 250px; background: var(--gray-dark); min-height: 100vh; transition: all 0.3s; }
#sidebar-wrapper .nav-link { color: #bdc3c7; margin: 5px 15px; border-radius: 8px; }
#sidebar-wrapper .nav-link:hover { background: rgba(255,255,255,0.1); color: white; }
#sidebar-wrapper .nav-link.active { background: var(--blue-lara); color: white; box-shadow: 0 4px 10px rgba(13,110,253,0.3); }
.card { border: none; border-radius: 12px; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
@media (max-width: 992px) { #sidebar-wrapper { margin-left: -250px; position: absolute; z-index: 1000; } #sidebar-wrapper.toggled { margin-left: 0; } }