/* Grouped sidebar navigation */
.nav-group{margin:3px 0;border:0}
.nav-group summary{min-height:42px;display:flex;align-items:center;gap:12px;padding:0 12px;border-radius:5px;color:#bfc7c1;cursor:pointer;list-style:none;font-size:12px;font-weight:700}
.nav-group summary::-webkit-details-marker{display:none}
.nav-group summary:hover{background:#222f27;color:#fff}
.nav-group summary .icon{width:22px;text-align:center;font-size:15px;color:#aebbb2}
.nav-group-chevron{margin-left:auto;font-size:16px;transition:transform .15s}
.nav-group[open] .nav-group-chevron{transform:rotate(180deg)}
.nav-group-items{display:grid;gap:1px;margin:2px 0 5px 17px;padding-left:10px;border-left:1px solid #425046}
.nav button.nav-child{min-height:37px;padding:0 10px;font-size:11px}
.nav button.nav-child .icon{font-size:13px}
.nav-group:has(button.active) summary{color:#fff}
.nav-group:has(button.active) summary .icon{color:#d4a947}

/* Static route colors for sidebar icons. */
.nav button[data-route="dashboard"] .icon{color:#58a6ff}
.nav button[data-route="clients"] .icon,
.nav button[data-route="users"] .icon,
.nav button[data-route="payroll"] .icon{color:#c4a7ff}
.nav button[data-route="projects"] .icon,
.nav button[data-route="gallery"] .icon{color:#5eead4}
.nav button[data-route="estimates"] .icon,
.nav button[data-route="industry-library"] .icon{color:#f6c76e}
.nav button[data-route="documents"] .icon,
.nav button[data-route="sales-invoices"] .icon{color:#fb8f8b}
.nav button[data-route="warehouse"] .icon,
.nav button[data-route="material-categories"] .icon{color:#8edb9b}
.nav button[data-route="ksef"] .icon{color:#98a8ff}
.nav button[data-route="reports"] .icon,
.nav button[data-route="work-log-approval"] .icon{color:#f5aa62}
.nav button[data-route="calendar"] .icon{color:#74c9ff}
.nav button[data-route="work-log"] .icon{color:#61d5aa}
.nav button[data-route="my-company"] .icon,
.nav button[data-route="companies"] .icon{color:#8cb6e8}

body[data-layout="professional"] .nav-group summary{color:#c7d4e3;border-radius:7px}
body[data-layout="professional"] .nav-group summary:hover{background:rgba(255,255,255,.07);color:#fff}
body[data-layout="professional"] .nav-group-items{border-color:rgba(174,204,234,.28)}
body[data-layout="professional"] .nav-group:has(button.active) summary .icon{color:#65afea}

@media(max-width:760px){
  .nav-group summary{min-height:40px}
  .nav-group-items{margin-left:14px}
  .nav button.nav-child{min-height:38px}
}

/* CORE-1: direct, safe menu reordering; inactive during normal navigation. */
.sidebar-menu-order-list{display:grid;gap:2px}
.nav-order-unit{position:relative}
.nav-order-unit.is-customizing{padding-left:25px;border:1px dashed rgba(174,187,178,.34);border-radius:6px;background:rgba(255,255,255,.025);cursor:grab}
.nav-order-unit.is-customizing:active,.nav-order-unit.is-dragging{cursor:grabbing;opacity:.58}
.nav-order-unit.is-customizing .nav-group{margin:0}
.nav-drag-handle{position:absolute;left:7px;top:13px;color:#91a096;font-size:12px;font-family:monospace;pointer-events:none}
.sidebar-menu-drop-placeholder{height:7px;margin:2px 0;border:1px dashed #d4a947;border-radius:4px;background:rgba(212,169,71,.18)}
.sidebar-customize-toolbar{display:flex;flex-wrap:wrap;gap:6px;margin:10px 4px 2px;padding-top:9px;border-top:1px solid #364238}
.sidebar-customize-trigger,.sidebar-order-reset{min-height:29px;border:0;background:transparent;color:#aebbb2;font-size:10px;font-weight:700;cursor:pointer;text-align:left}
.sidebar-customize-trigger:hover,.sidebar-customize-trigger.is-active{color:#fff}
.sidebar-order-reset{color:#d4a947}
.sidebar-order-status{flex:1 0 100%;color:#9bc6aa;font-size:9px}
.nav-order-mobile-controls{display:none}
@media(max-width:760px){
  .nav-order-unit.is-customizing{padding:3px 41px 3px 25px}
  .nav-order-mobile-controls{position:absolute;right:5px;top:8px;display:flex;gap:2px;z-index:2}
  .nav-order-mobile-controls button{width:24px;height:24px;border:1px solid #526158;border-radius:4px;background:#1d2921;color:#e7ece8;cursor:pointer}
  .nav-order-unit.is-customizing .nav-group .nav-order-mobile-controls{top:7px}
}
