/* ============================================================
   拾光里 56s.cn · 顶部导航高亮 · 完整版
   放进：后台 → 外观布局 → 自定义代码 → 自定义css代码 (电脑端)
   ⚠️ 不要放进 diy.css —— 那个文件没有 ?v= 版本号，会被浏览器死缓存
   ============================================================ */

/* ---------- 1. 当前项通用样式（JS 打的标记） ---------- */
a[data-sg-active],
[data-sg-active] > a,
.ls-nav-item[data-sg-active],
.ls-nav-item[data-sg-active] > a {
    color: #ff8a65 !important;
    font-weight: 700 !important;
    position: relative;
    text-decoration: none;
}

/* 胶囊底：想要截图那种浅色底就留着，只想要字体变色就删掉 background 那行 */
a[data-sg-active],
.ls-nav-item[data-sg-active] > a {
    background: linear-gradient(135deg, #fff2ec, #ffe8e2) !important;
    border-radius: 8px !important;
}

/* 底部渐变小横条 */
a[data-sg-active]::after,
.ls-nav-item[data-sg-active] > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -2px;
    transform: translateX(-50%);
    width: 18px;
    height: 3px;
    border-radius: 9999px;
    background: linear-gradient(90deg, #ffb74d, #ff9a9e);
}

/* ---------- 2. 纯 CSS 兜底：首页（body.route-index） ---------- */
body.route-index .ls-header a[href="/"],
body.route-index .ls-header a[href="//56s.cn"],
body.route-index .ls-header a[href="//56s.cn/"],
body.route-index .ls-header a[href="https://56s.cn"],
body.route-index .ls-header a[href="https://56s.cn/"],
body.route-index header a[href="/"],
body.route-index header a[href="//56s.cn"],
body.route-index header a[href="//56s.cn/"],
body.route-index header a[href="https://56s.cn"],
body.route-index header a[href="https://56s.cn/"],
body.route-index [class*="header"] a[href="/"],
body.route-index [class*="header"] a[href="//56s.cn"],
body.route-index [class*="header"] a[href="//56s.cn/"],
body.route-index [class*="nav"] a[href="/"],
body.route-index [class*="nav"] a[href="//56s.cn"],
body.route-index [class*="nav"] a[href="//56s.cn/"] {
    color: #ff8a65 !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #fff2ec, #ffe8e2) !important;
    border-radius: 8px !important;
    position: relative;
}

body.route-index [class*="header"] a[href="/"]::after,
body.route-index [class*="nav"] a[href="/"]::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -2px;
    transform: translateX(-50%);
    width: 18px;
    height: 3px;
    border-radius: 9999px;
    background: linear-gradient(90deg, #ffb74d, #ff9a9e);
}

/* 首页兜底：直接取主导航第一项 */
body.route-index .ls-main-nav .ls-nav-item:first-child,
body.route-index .ls-main-nav .ls-nav-item:first-child > a,
body.route-index .ls-main-nav > *:first-child,
body.route-index .ls-main-nav > *:first-child > a {
    color: #ff8a65 !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #fff2ec, #ffe8e2) !important;
    border-radius: 8px !important;
}

/* ---------- 3. 主题自带 .active（顶部导航） ---------- */
.ls-main-nav .ls-nav-item.active,
.ls-main-nav .ls-nav-item.active > a {
    color: #ff8a65 !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #fff2ec, #ffe8e2) !important;
    border-radius: 8px !important;
}

/* ---------- 4. 内容导航（最新/热门/视频那排）—— 注意是 .ls-active ---------- */
.ls-top-nav-item.ls-active,
.ls-content-nav-item.ls-active {
    color: #ff8a65 !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #fff2ec, #ffe8e2) !important;
    border-radius: 8px !important;
}

/* ---------- 5. hover 保持橙调 ---------- */
.ls-main-nav .ls-nav-item:hover > a,
[class*="header"] .ls-nav-item:hover > a {
    color: #ff8a65 !important;
}

/* ---------- 6. 过渡 ---------- */
.ls-main-nav a,
[class*="header"] a,
[class*="nav"] a {
    transition: color .25s ease, background .25s ease;
}
