/* --- VERTICAL SIDEBAR MENU --- */
@media screen and (min-width: 992px) {
/* 1. Fix the Header to the left side */
#header {
position: fixed !important;
width: 240px !important;
height: 100vh !important;
left: 0 !important;
top: 0 !important;
background-color: #ffffff;
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-top: 50px !important;
z-index: 1000;
}
/* 2. Stack Navigation Vertically */
.header-nav-list {
flex-direction: column !important;
align-items: flex-start !important;
padding-left: 30px !important;
}
.header-nav-item {
margin: 8px 0 !important; /* Spacing between links */
text-align: left !important;
}
/* 3. Push Site Content to the Right */
#site-wrapper, .main-content {
margin-left: 240px !important;
width: calc(100% - 240px) !important;
}
/* 4. Position Logo/Title */
.header-title {
text-align: left !important;
padding-left: 30px !important;
margin-bottom: 40px !important;
}
/* 5. Hide Mobile Elements on Desktop */
.header-actions, .header-display-mobile {
display: none !important;
}
}