html[data-theme="dark"]{--bg:#303238;--panel:#3b3e44;--panel2:#51565e;--input-bg:#34373d;--table-bg:#3b3e44;--card-bg:#3b3e44;--sidebar-bg:#36393f;--topbar-bg:#393c42;--line:#555a62;--text:#f0f1f3;--muted:#b6bdc6;--surface-inset:#34373d;--filter-toggle-bg:#34373d}html[data-theme="dark"] body{background:linear-gradient(135deg,#45494f,#303238 65%,#393c42);background-attachment:fixed}html[data-theme="dark"] .main,html[data-theme="dark"] .main-body{background:transparent}#app-sidebar .nav a>span:has(.crm-ui-icon){color:#536779;background:linear-gradient(145deg,#e4edf2,#f6f9fb);border-radius:9px;padding:5px;box-shadow:inset 0 0 0 1px #60788c12}#app-sidebar .nav a.active>span:has(.crm-ui-icon){color:#07885e;background:#cef0e2}html[data-theme="dark"] #app-sidebar .nav a>span:has(.crm-ui-icon){color:#bdcfda;background:linear-gradient(145deg,#555d67,#3d434b)}html[data-theme="dark"] #app-sidebar,html[data-theme="dark"] .main>.topbar{background:linear-gradient(160deg,#42464d,#34373d)!important}

/* Fit the complete desktop navigation to the viewport in both rail and flyout. */
@media(min-width:1025px){
 #app-sidebar{height:100dvh!important;padding-top:10px!important;padding-bottom:10px!important;overflow:hidden!important}
 #app-sidebar .sidebar-header{flex:0 0 36px;min-height:36px!important;margin:0!important}
 #app-sidebar>.footer{flex:0 0 auto;margin-top:6px;padding-top:6px;font-size:10px;line-height:1.2}
 #app-sidebar .nav{flex:1 1 0%!important;min-height:0!important;margin-top:6px!important;gap:2px!important;padding-top:0!important;padding-bottom:0!important}
 #app-sidebar .nav>a{flex:1 1 0!important;min-height:24px!important;max-height:44px!important;padding-top:0!important;padding-bottom:0!important;margin-top:0!important;margin-bottom:0!important;box-sizing:border-box}
 #app-sidebar .nav a>span:not(.nav-msg-badge){height:28px!important;width:28px!important;flex-basis:28px!important;padding:4px!important}
 #app-sidebar .nav a .crm-ui-icon{width:18px;height:18px}
 #app-sidebar .nav a{line-height:1.15!important}
}
@media(min-width:1025px) and (max-height:720px){
 #app-sidebar .nav>a{min-height:20px!important}
 #app-sidebar .nav a>span:not(.nav-msg-badge){height:22px!important;width:22px!important;flex-basis:22px!important;padding:2px!important}
 #app-sidebar .nav a .crm-ui-icon{width:16px;height:16px}
 #app-sidebar .nav{gap:1px!important}
}