/**
 * 顶栏与底部导航。
 *
 * 全站加载。这里只处理两件事：
 * 1. 移动端底部 tabbar —— 彩色图标换金线，配色压到站点黑金体系
 * 2. 顶栏「开通会员」—— 红色胶囊改金线描边胶囊
 *
 * 图标本体在 includes/tabbar.php 里以 symbol 的形式输出。
 */

/* ============================================================
   移动端底部导航
   ============================================================ */

body .footer-tabbar {
    background: rgba(15, 16, 18, .94) !important;
    border-top: 1px solid rgba(201, 169, 110, .15);
    box-shadow: 0 -10px 28px rgba(0, 0, 0, .46);
    -webkit-backdrop-filter: saturate(1.15) blur(18px);
    backdrop-filter: saturate(1.15) blur(18px);
}

body .footer-tabbar a.tabbar-item {
    color: #6f757d;
    transition: color .18s;
}

body .footer-tabbar a.tabbar-item:hover,
body .footer-tabbar a.tabbar-item:active {
    color: #b39a70;
}

body .footer-tabbar a.tabbar-item.dn-cur {
    color: #c9a96e;
}

/* 选中项下方一颗极小金点，比整块高亮克制 */
body .footer-tabbar a.tabbar-item.dn-cur::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 6px;
    width: 3px;
    height: 3px;
    margin-left: -1.5px;
    border-radius: 50%;
    background: #c9a96e;
}

body .footer-tabbar .tabbar-item icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 主题对 svg 有一条全局 fill 规则，会把只描边的图标填成实心块，这里必须压掉 */
body .footer-tabbar .tabbar-item svg.icon {
    width: 23px;
    height: 23px;
    display: block;
    fill: none !important;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ============================================================
   顶栏「开通会员」
   ============================================================ */

/* 主题有一条 `.navbar-top .navbar-but .but{font-size:.8em;padding:.3em 1em !important}`
   特异性 (0,3,0)，比 `body .navbar-but .payvip-icon` 的 (0,2,1) 高，会和这里打架。
   所以额外补一个带 .radius 的选择器把特异性顶到 (0,3,2)。 */
body .navbar-but a.payvip-icon.radius,
body .navbar-top .navbar-but .payvip-icon {
    margin-left: 6px !important;
    padding: 7px 15px !important;
    background: transparent !important;
    border: 1px solid rgba(201, 169, 110, .46) !important;
    border-radius: 100px !important;
    color: #c9a96e !important;
    box-shadow: none !important;
    font-size: 13px !important;
    letter-spacing: .03em;
    line-height: 1.2;
    transition: background .2s, border-color .2s, color .2s;
}

body .navbar-but a.payvip-icon.radius:hover,
body .navbar-top .navbar-but .payvip-icon:hover {
    background: rgba(201, 169, 110, .13) !important;
    border-color: rgba(201, 169, 110, .82) !important;
    color: #e6d3a6 !important;
}

/* 皇冠是主题的 #icon-vip_1，symbol 里写死了橙色渐变（#FF8A3D → #FF6B35），
   改不了 fill，只能用滤镜往金色（#c9a96e，色相约 36°）掰。 */
body .navbar-but .payvip-icon svg,
body .float-right .float-btn[title="开通会员"] svg {
    filter: hue-rotate(19deg) saturate(.58) brightness(1.04);
    opacity: .95;
}

/* 右下角那个常驻的会员悬浮球：灰底橙冠换成黑底金冠，跟顶栏同一个语言 */
body .float-right .float-btn[title="开通会员"] {
    background: rgba(23, 24, 26, .92) !important;
    border: 1px solid rgba(201, 169, 110, .34);
    color: #c9a96e !important;
}

/* 会员下拉里的两张卡：桌面色块别太亮，压一档跟顶栏融在一起 */
body .navbar-but .sub-vip-card {
    background: #17181a;
    border: 1px solid rgba(201, 169, 110, .18);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .55);
}

@media (max-width: 768px) {
    body .navbar-but a.payvip-icon.radius,
    body .navbar-top .navbar-but .payvip-icon {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
}