/**
 * 前台固定侧边栏导航（对齐 nova.aixzd.com 样式）
 * 仅在「侧边栏设置 → 启用侧边栏」开启时由 header.php 引入
 * 颜色全部使用主题 CSS 变量，自动适配深色模式
 */

:root {
    /* nova 实测：.flex-row .l-container{width:clamp(200px, 12.5vw, 100%)} */
    --xl-side-nav-width: clamp(200px, 12.5vw, 100%);
}

/* ========================================
   布局避让：内容区整体右移
   ======================================== */

body.xl-side-nav-on {
    padding-left: var(--xl-side-nav-width);
}

/* banner 模式下 header 与背景装饰层为 fixed/absolute，需单独避让 */
body.xl-side-nav-on .site-header,
body.xl-side-nav-on .site-banner {
    left: var(--xl-side-nav-width);
}

/* 经典模式 header 为 sticky，跟随 body padding 无需处理 */

/* ========================================
   侧边栏本体
   ======================================== */

.xl-side-nav {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--xl-side-nav-width);
    z-index: 1001;
    background: var(--bg-body);
    border-right: 0px solid var(--border-primary);
    display: flex;
    flex-direction: column;
}

/* 登录态：给 WordPress 管理栏让位 */
body.admin-bar .xl-side-nav {
    top: 32px;
}

@media screen and (max-width: 782px) {
    body.admin-bar .xl-side-nav {
        top: 46px;
    }
}

.xl-side-nav__inner {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.xl-side-nav__logo {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 21px 16px 21px;
    flex-shrink: 0;
    color: var(--text-primary);
}

.xl-side-nav__logo-img {
    max-height: 46px;
    max-width: 100%;
    width: auto;
    object-fit: contain;
}

.xl-side-nav__logo--dark {
    display: none;
}

html[data-theme="dark"] .xl-side-nav__logo--light {
    display: none;
}

html[data-theme="dark"] .xl-side-nav__logo--dark {
    display: block;
}

.xl-side-nav__logo-text {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.xl-side-nav__scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    /* nova：容器无内边距，菜单项自带左右 20px 留位，分组分隔线通栏 */
    padding: 0 0 20px;
    scrollbar-width: thin;
    scrollbar-color: var(--border-primary) transparent;
}

.xl-side-nav__scroll::-webkit-scrollbar {
    width: 4px;
}

.xl-side-nav__scroll::-webkit-scrollbar-thumb {
    background: var(--border-primary);
    border-radius: 2px;
}

.xl-side-nav__block {
    margin-bottom: 6px;
    padding-bottom: 6px;
}

.xl-side-nav__block + .xl-side-nav__block {
    /* nova 实测：.menu-bar .menu-block{border-top:1px solid #24282c;margin/padding-top:.2rem(=20px)} */
    margin-top: 20px;
    border-top: 1px solid var(--border-secondary);
    padding-top: 20px;
}

.xl-side-nav__block--main {
    margin-top: 4px;
}

.xl-side-nav__block-title {
    /* nova 实测：.menu-block-title{color:#ffffff73;padding:0 20px;margin-bottom:10px} */
    margin: 0 0 10px;
    padding: 0 20px;
    font-size: 12px;
    font-weight: 400;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.xl-side-nav__items {
    display: flex;
    flex-direction: column;
    /* nova 实测：.menu-item{margin-bottom:6px} */
    gap: 6px;
}

.xl-side-nav__item {
    /* nova 实测：.menu-a{height 40px / padding 0 20px / radius 10px / color #c5c7d5}，
       外层 .menu-item 再提供 20px 留位（此处用 margin 等效），hover/current 胶囊距侧栏边缘 20px */
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    margin: 0 20px;
    padding: 0 20px;
    border-radius: 10px;
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.xl-side-nav__item:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.xl-side-nav__item.is-active {
    background: var(--theme-color);
    color: #fff;
}

.xl-side-nav__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.xl-side-nav__icon svg,
.xl-side-nav__icon .xl-side-nav__icon-svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.xl-side-nav__icon svg[fill="none"] {
    fill: none;
}

.xl-side-nav__text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ========================================
   暗色模式：与 nova.aixzd.com 逐值对齐
   （nova 实测：body/#060914、菜单字/#c5c7d5、hover/#252a2f+白字、
     当前项/#25221c+#f7c673 金字 + 左缘金色箭头标、分组标题/#ffffff73、分隔线/#24282c）
   ======================================== */

html[data-theme="dark"] .xl-side-nav {
    background: #060914;
}

html[data-theme="dark"] .xl-side-nav__item {
    color: #c5c7d5;
}

html[data-theme="dark"] .xl-side-nav__item:hover {
    background: #252a2f;
    color: #fff;
}

html[data-theme="dark"] .xl-side-nav__item.is-active {
    background: #25221c;
    color: #f7c673;
}

/* 当前项左缘金色箭头标（nova .menu-item.current::before，图片已存本地） */
html[data-theme="dark"] .xl-side-nav__item.is-active::before {
    content: '';
    position: absolute;
    left: -20px;
    top: 0;
    bottom: 0;
    width: 10px;
    background: url('../img/nav-selected-gold.png') left center / contain no-repeat;
    pointer-events: none;
}

html[data-theme="dark"] .xl-side-nav__block-title {
    color: rgba(255, 255, 255, 0.45);
}

html[data-theme="dark"] .xl-side-nav__block + .xl-side-nav__block {
    border-top-color: #24282c;
}

/* ========================================
   响应式：移动端隐藏侧边栏，恢复原布局
   ======================================== */

@media (max-width: 1023.98px) {
    .xl-side-nav {
        display: none;
    }

    body.xl-side-nav-on {
        padding-left: 0;
    }

    body.xl-side-nav-on .site-header,
    body.xl-side-nav-on .site-banner {
        left: 0;
    }
}

/* ========================================
   打印：隐藏侧边栏
   ======================================== */

@media print {
    .xl-side-nav {
        display: none;
    }

    body.xl-side-nav-on {
        padding-left: 0;
    }
}