﻿.admin-panel-nav { position:relative; }
.admin-panel-nav > summary { cursor:pointer; list-style:none; }
.admin-panel-nav > summary::-webkit-details-marker { display:none; }
.admin-panel-nav[open] > summary .fa-chevron-down { transform:rotate(180deg); }
.admin-panel-links { position:absolute; top:calc(100% + 8px); right:0; z-index:1001; width:520px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 8px; max-width:calc(100vw - 24px); max-height: min(640px, calc(100dvh - 140px)); overflow-y:auto; padding:8px; border:1px solid var(--hx-border); border-radius:10px; background:var(--hx-surface); color:var(--hx-text); box-shadow:var(--shadow-lg); }
.admin-panel-links .dropdown-item { display:block; padding:10px 12px; color:var(--hx-text); font-size:14px; line-height:1.4; text-decoration:none; border-radius:6px; }
.admin-panel-links .dropdown-item:hover,.admin-panel-links .dropdown-item:focus-visible { background:var(--hx-raised); }
.admin-panel-mobile .admin-panel-links { grid-template-columns:minmax(0,1fr); position:static; width:auto; max-height:none; border:0; box-shadow:none; padding:0 0 0 16px; }

.admin-panel-links { scrollbar-width:thin; scrollbar-color:var(--hx-border) transparent; }
.admin-panel-links .dropdown-item { min-width:0; overflow-wrap:anywhere; }

.hx-side-links .admin-panel-sidebar > summary { display:flex; align-items:center; gap:12px; padding:12px 24px; color:var(--hx-text); font-size:14px; }
.hx-side-links .admin-panel-sidebar > summary:hover { background:var(--hx-raised); }
.hx-side-links .admin-panel-sidebar > summary .fa-chevron-down { margin-left:auto; font-size:10px; }
.hx-side-links .admin-panel-sidebar .admin-panel-links { position:static; width:auto; max-width:100%; max-height:none; display:grid; grid-template-columns:minmax(0,1fr); padding:4px 12px; border:0; box-shadow:none; background:transparent; }
.hx-side-links .admin-panel-sidebar .dropdown-item { margin:0; padding:10px 16px; font-size:13px; }
/* Reserve the same space for the sidebar and page at every desktop width. */
@media (min-width:1200px) {
    html[data-design] body.hx-shell:not(.hx-standalone) { padding-left:280px; }
    html[data-design] body.hx-shell .hx-sidebar {
        width:280px;
        box-sizing:border-box;
        overflow-x:hidden;
        scrollbar-gutter:stable;
        scrollbar-width:thin;
        scrollbar-color:var(--hx-border) transparent;
    }
}
html[data-design] body.hx-shell .admin-panel-sidebar { min-width:0; width:100%; }
html[data-design] body.hx-shell .admin-panel-sidebar > summary {
    padding:12px;
    gap:10px;
    white-space:nowrap;
}
html[data-design] body.hx-shell .admin-panel-sidebar > summary i { flex-shrink:0; }
html[data-design] body.hx-shell .admin-panel-sidebar .admin-panel-links { padding:4px 0 4px 12px; }
html[data-design] body.hx-shell .admin-panel-sidebar .dropdown-item {
    margin:0;
    padding:10px 8px;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    display:block;
}

/* Two explicit columns retain their order regardless of the surrounding layout. */
html body.hx-site .admin-panel-links { width:580px; padding:16px; gap:16px; box-sizing:border-box; direction:ltr; }
html body.hx-site .admin-menu-group { min-width:0; padding:4px; }
html body.hx-site .admin-menu-group + .admin-menu-group { border-left:1px solid var(--hx-border); padding-left:20px; }
html body.hx-site .admin-menu-heading { display:flex; align-items:center; gap:12px; margin:8px 8px 12px; color:var(--hx-accent); font-size:12px; line-height:20px; font-weight:700; text-transform:uppercase; }
html body.hx-site .admin-menu-heading > i { display:none; }
html body.hx-site .admin-panel-links .dropdown-item { display:flex; align-items:center; gap:14px; min-height:40px; box-sizing:border-box; padding:8px 10px; margin:0; white-space:nowrap; }
html body.hx-site .admin-panel-links .dropdown-item > i { width:22px; flex:none; text-align:center; font-size:18px; }
html body.hx-site .admin-panel-links .dropdown-item:is(:hover,:focus-visible) { background:color-mix(in srgb,var(--hx-accent) 16%,var(--hx-surface)); }
html[data-admin-menu="grouped"] body.hx-site .admin-panel-links { width:640px; padding:14px; }
html[data-admin-menu="grouped"] body.hx-site .admin-menu-group { padding:12px 8px; border:1px solid var(--hx-border); border-radius:10px; background:color-mix(in srgb,var(--hx-bg) 25%,var(--hx-surface)); }
html[data-admin-menu="grouped"] body.hx-site .admin-menu-heading > i { display:inline-block; font-size:20px; }
html body.hx-site :is(.admin-panel-mobile,.admin-panel-sidebar) .admin-panel-links { width:auto; padding:8px; }
html body.hx-site :is(.admin-panel-mobile,.admin-panel-sidebar) .admin-menu-group + .admin-menu-group { border-left:0; border-top:1px solid var(--hx-border); padding:12px 4px 4px; }
@media(max-width:620px) {
 html body.hx-site .admin-panel-links { grid-template-columns:minmax(0,1fr); }
 html body.hx-site .admin-menu-group + .admin-menu-group { border-left:0; border-top:1px solid var(--hx-border); padding:12px 4px 4px; }
}

html body.hx-site .admin-panel-nav:not(.admin-panel-mobile):not(.admin-panel-sidebar) > .admin-panel-links {
 left:50%; right:auto;
 transform:translateX(calc(-50% + var(--admin-menu-shift, 0px)));
}
