/* Admin Sidebar Styles */ .sidebar { position: fixed; top: 0; bottom: 0; left: 0; z-index: 100; padding: 0; box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1); background-color: #212529; /* Dark background */ transition: all 0.3s ease; } .sidebar-sticky { position: relative; top: 0; height: 100vh; padding-top: 0; overflow-x: hidden; overflow-y: auto; } /* Brand */ .sidebar-brand { padding: 1rem 1.5rem; display: flex; align-items: center; color: #fff; text-decoration: none; background-color: rgba(0,0,0,0.2); margin-bottom: 1rem; } .sidebar-brand:hover { color: #e0e0e0; } /* Nav Items */ .sidebar .nav-link { font-weight: 500; color: rgba(255, 255, 255, .7); padding: 0.8rem 1.5rem; display: flex; align-items: center; transition: all 0.2s ease-in-out; border-left: 3px solid transparent; } .sidebar .nav-link:hover { color: #fff; background-color: rgba(255, 255, 255, .05); border-left-color: rgba(255, 255, 255, .5); } .sidebar .nav-link.active { color: #fff; background-color: rgba(13, 110, 253, 0.15); /* Primary with opacity */ border-left-color: #0d6efd; /* Primary color */ } .sidebar .nav-link i { margin-right: 12px; font-size: 1.1rem; width: 20px; text-align: center; } /* Section Headings */ .sidebar-heading { font-size: .75rem; text-transform: uppercase; letter-spacing: 1px; color: rgba(255, 255, 255, .4); padding: 1.5rem 1.5rem 0.5rem; font-weight: 700; } /* Responsive */ @media (max-width: 767.98px) { .sidebar { top: 5rem; } }