background: var(--user-theme-sidebar) !important; overflow: hidden; } .sidebar-brand .brand-logo { width: 32px; height: 32px; border-radius: 6px; object-fit: cover; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25); } .sidebar-wrapper { height: calc(100vh - 57px); overflow-y: auto !important; overflow-x: hidden !important; scrollbar-width: thin; -webkit-overflow-scrolling: touch; } .sidebar-wrapper::-webkit-scrollbar { width: 8px; } .sidebar-wrapper::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.22); border-radius: 999px; } .sidebar-wrapper::-webkit-scrollbar-track { background: transparent; } .sidebar-menu .nav-link.active { background: color-mix(in srgb, var(--user-theme-primary) 26%, transparent) !important; border-left: 3px solid var(--user-theme-primary); } .btn-primary { background-color: var(--user-theme-primary) !important; border-color: var(--user-theme-primary) !important; } .layout-rtl .app-sidebar { border-left: 1px solid rgba(255, 255, 255, 0.08); border-right: 0; } #sidebarMenuList, #sidebarMenuList .nav-treeview { list-style: none; margin: 0; padding-left: 0; } #sidebarMenuList .nav-item { position: relative; width: 100%; display: block; clear: both; height: auto !important; } #sidebarMenuList .nav-item.has-treeview { overflow: visible !important; } #sidebarMenuList .nav-link { display: flex; align-items: center; gap: .55rem; line-height: 1.25; overflow: hidden; } #sidebarMenuList .nav-link .nav-icon { flex: 0 0 1.1rem; width: 1.1rem; text-align: center; } #sidebarMenuList .menu-label { display: flex; align-items: center; width: 100%; margin: 0; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #sidebarMenuList .menu-label .nav-arrow { margin-left: auto; flex: 0 0 auto; } #sidebarMenuList .nav-link.nav-depth-0 { padding-left: 0.9rem; } #sidebarMenuList .nav-link.nav-depth-1 { padding-left: 1.45rem; } #sidebarMenuList .nav-link.nav-depth-2 { padding-left: 2rem; } #sidebarMenuList .nav-link.nav-depth-3 { padding-left: 2.55rem; } #sidebarMenuList .nav-link.nav-depth-4 { padding-left: 3.1rem; } #sidebarMenuList .nav-treeview { padding-top: 2px; position: static !important; float: none !important; width: 100%; height: auto !important; overflow: visible !important; } #sidebarMenuList .nav-item.has-treeview > .nav-treeview { display: none; } #sidebarMenuList .nav-item.has-treeview.menu-open > .nav-treeview { display: block; } #sidebarMenuList .nav-treeview > .nav-item > .nav-link { padding-top: 0.35rem; padding-bottom: 0.35rem; } .nav-badge { position: absolute; top: 3px; right: 3px; font-size: 0.65rem; padding: 2px 5px; } .menu-badge { flex: 0 0 auto; margin-left: -.35rem; margin-right: -.15rem; font-size: .62rem; line-height: 1; padding: .16rem .32rem; } #sidebarMenuList .nav-item.menu-open > .nav-link > .menu-badge-summary { display: none; } .nav-user-img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(255, 255, 255, 0.35); } .sidebar-user-placeholder { width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.15); color: #fff; font-size: 1rem; } .sidebar-user-name { color: rgba(255, 255, 255, 0.95) !important; text-decoration: none !important; font-weight: 600; max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #sidebarMenuSearch, #sidebarMenuSearch::placeholder { color: #e9ecef !important; } #sidebarMenuSearch { background: rgba(17, 24, 39, 0.65); }