/**
 * 默认模版主题皮肤（覆盖式）
 * 通过 body.skin-theme-{a|b|c|d} 切换：
 *   a 企业蓝（默认） b 深空暗色 c 青绿SaaS d 极简黑白
 * 配置项：skin_theme（分组 skin），支持 ?theme=x 临时预览
 */

/* ================= 主题变量 ================= */
body.skin-theme-a{
    --sk-primary:#1a66ff;
    --sk-primary-hover:#0e4fd6;
    --sk-primary-soft:#dbe8ff;
    --sk-price:#ff6a00;
    --sk-bg:#ffffff;
    --sk-bg-alt:#f6f8fc;
    --sk-panel:#ffffff;
    --sk-border:#e6eaf2;
    --sk-text:#344054;
    --sk-muted:#667085;
    --sk-heading:#101828;
    --sk-hero-bg:#eef4ff;
    --sk-hero-heading:#101828;
    --sk-hero-text:#475467;
    --sk-nav-bg:#ffffff;
    --sk-nav-text:#475467;
    --sk-footer-bg:#161e2e;
    --sk-footer-text:#98a2b3;
    --sk-radius:8px;
    --sk-btn-radius:4px;
    --sk-on-primary:#ffffff;
}
body.skin-theme-b{
    --sk-primary:#22d3ee;
    --sk-primary-hover:#4ee0f5;
    --sk-primary-soft:#0e2a38;
    --sk-price:#22d3ee;
    --sk-bg:#0b1220;
    --sk-bg-alt:#0e1729;
    --sk-panel:#101a30;
    --sk-border:#1e2b4a;
    --sk-text:#c3cfe3;
    --sk-muted:#8fa0bd;
    --sk-heading:#f1f5f9;
    --sk-hero-bg:#0b1220;
    --sk-hero-heading:#f1f5f9;
    --sk-hero-text:#8fa0bd;
    --sk-nav-bg:#0b1220;
    --sk-nav-text:#8fa0bd;
    --sk-footer-bg:#080e19;
    --sk-footer-text:#5b6b8c;
    --sk-radius:10px;
    --sk-btn-radius:6px;
    --sk-on-primary:#06202a;
}
body.skin-theme-c{
    --sk-primary:#0d9488;
    --sk-primary-hover:#0b7f75;
    --sk-primary-soft:#d9f0ec;
    --sk-price:#0d9488;
    --sk-bg:#f7faf9;
    --sk-bg-alt:#eef5f3;
    --sk-panel:#ffffff;
    --sk-border:#e2ece9;
    --sk-text:#3d5450;
    --sk-muted:#68807b;
    --sk-heading:#12332f;
    --sk-hero-bg:#f7faf9;
    --sk-hero-heading:#12332f;
    --sk-hero-text:#68807b;
    --sk-nav-bg:#ffffff;
    --sk-nav-text:#5b7470;
    --sk-footer-bg:#12332f;
    --sk-footer-text:#9db8b3;
    --sk-radius:16px;
    --sk-btn-radius:999px;
    --sk-on-primary:#ffffff;
}
body.skin-theme-d{
    --sk-primary:#111111;
    --sk-primary-hover:#333333;
    --sk-primary-soft:#f2f2f2;
    --sk-price:#111111;
    --sk-bg:#ffffff;
    --sk-bg-alt:#fafafa;
    --sk-panel:#ffffff;
    --sk-border:#ececec;
    --sk-text:#444444;
    --sk-muted:#888888;
    --sk-heading:#111111;
    --sk-hero-bg:#ffffff;
    --sk-hero-heading:#111111;
    --sk-hero-text:#666666;
    --sk-nav-bg:#ffffff;
    --sk-nav-text:#666666;
    --sk-footer-bg:#ffffff;
    --sk-footer-text:#888888;
    --sk-radius:8px;
    --sk-btn-radius:6px;
    --sk-on-primary:#ffffff;
}

/* ================= 通用覆盖 ================= */
body[class*="skin-theme-"]{
    background-color:var(--sk-bg);
    color:var(--sk-text);
}

/* ---- 顶部导航 ---- */
body[class*="skin-theme-"] #header{
    background-color:var(--sk-nav-bg) !important;
    box-shadow:0 1px 0 var(--sk-border);
}
body[class*="skin-theme-"] #header nav .nav-primary > li > a,
body[class*="skin-theme-"] #header nav .nav-secondary > li > a{
    color:var(--sk-nav-text) !important;
    text-transform:none;
    font-weight:500;
}
body[class*="skin-theme-"] #header nav .nav-primary > li > a:hover,
body[class*="skin-theme-"] #header nav .nav-secondary > li > a:hover{
    color:var(--sk-primary) !important;
}
body[class*="skin-theme-"] #header nav .nav-primary > li > a.button,
body[class*="skin-theme-"] #header nav .nav-primary > li > a.button-secondary{
    background-color:var(--sk-primary) !important;
    color:var(--sk-on-primary) !important;
    border:0 !important;
    border-radius:var(--sk-btn-radius) !important;
}
body[class*="skin-theme-"] #header nav .nav-primary > li > a.button:hover{
    background-color:var(--sk-primary-hover) !important;
}
body[class*="skin-theme-"] #header .user-info{
    background-color:var(--sk-panel) !important;
    border:1px solid var(--sk-border);
    border-radius:var(--sk-radius);
    box-shadow:0 8px 24px rgba(0,0,0,.08);
    overflow:hidden;
}
body[class*="skin-theme-"] #header .user-info li a{
    color:var(--sk-text) !important;
}
body[class*="skin-theme-"] #header .user-info li a:hover{
    background-color:var(--sk-bg-alt) !important;
    color:var(--sk-primary) !important;
}
/* 浅色导航上警示黄不可读，压深为琥珀色 */
body.skin-theme-a #header .text-color-warning,
body.skin-theme-c #header .text-color-warning,
body.skin-theme-d #header .text-color-warning{
    color:#b45309 !important;
}
/* 白底导航时反色 logo（原 logo 为白色适配蓝底） */
body.skin-theme-a #header .logo img,
body.skin-theme-c #header .logo img,
body.skin-theme-d #header .logo img{
    filter:brightness(0) opacity(.85);
}

/* ---- 移动端展开菜单 ---- */
body[class*="skin-theme-"] #nav-overlay-background{
    background-color:var(--sk-nav-bg) !important;
}
body[class*="skin-theme-"] #nav-overlay nav .nav-primary li a,
body[class*="skin-theme-"] #nav-overlay nav .nav-secondary li a{
    color:var(--sk-nav-text) !important;
}
body[class*="skin-theme-"] #nav-overlay nav .nav-primary li a:hover{
    color:var(--sk-primary) !important;
}

/* ---- Hero 首屏（原纯蓝色带） ---- */
body[class*="skin-theme-"] #content > .content-row.content-row-color,
body[class*="skin-theme-"] #content > .content-row.content-row-color.content-row-split-left::after,
body[class*="skin-theme-"] #content > .content-row.content-row-color.content-row-split-right::after{
    background-color:var(--sk-hero-bg) !important;
    background-image:none !important;
}
body[class*="skin-theme-"] .content-row-clouds::before,
body[class*="skin-theme-"] .content-row-clouds::after{
    display:none !important;
}
body[class*="skin-theme-"] .content-row-color .content-header h1,
body[class*="skin-theme-"] .content-row-color .content-header h2{
    color:var(--sk-hero-heading) !important;
    text-transform:none;
}
body[class*="skin-theme-"] .content-row-color .content-header p{
    color:var(--sk-hero-text) !important;
}
body[class*="skin-theme-"] .content-header mark{
    background-color:var(--sk-primary-soft) !important;
    color:var(--sk-primary) !important;
    border-radius:6px;
    padding:0 10px;
}
/* 轮播圆点与箭头 */
body[class*="skin-theme-"] .content-slider > ul li{
    color:var(--sk-muted);
}
body[class*="skin-theme-"] .content-slider > ul li.active{
    color:var(--sk-primary);
}
body[class*="skin-theme-"] .content-slider > ul li:empty{
    background-color:var(--sk-border);
}
body[class*="skin-theme-"] .content-slider > ul li.active:empty{
    background-color:var(--sk-primary);
}
body[class*="skin-theme-"] .content-slider > i,
body[class*="skin-theme-"] .content-slider > i:hover{
    color:var(--sk-muted);
}

/* ---- 内容区块 ---- */
body[class*="skin-theme-"] .content-row{
    background-color:var(--sk-bg);
}
body[class*="skin-theme-"] .content-row-gray,
body[class*="skin-theme-"] #content > .content-row.content-row-gray.content-row-split-left::after,
body[class*="skin-theme-"] #content > .content-row.content-row-gray.content-row-split-right::after{
    background-color:var(--sk-bg-alt) !important;
    background-image:none !important;
}
body[class*="skin-theme-"] .content-header h1,
body[class*="skin-theme-"] .content-header h2,
body[class*="skin-theme-"] .content-header h3,
body[class*="skin-theme-"] .content-header h4{
    color:var(--sk-heading);
    text-transform:none;
}
body[class*="skin-theme-"] .content-header p{
    color:var(--sk-muted);
}
body[class*="skin-theme-"] #main-body h3,
body[class*="skin-theme-"] #main-body h4{
    color:var(--sk-heading);
}
body[class*="skin-theme-"] #main-body p{
    color:var(--sk-text);
}
body[class*="skin-theme-"] .text-gray,
body[class*="skin-theme-"] .text-color-gray{
    color:var(--sk-muted) !important;
}

/* ---- 按钮 ---- */
body[class*="skin-theme-"] .button-primary{
    background-color:var(--sk-primary) !important;
    color:var(--sk-on-primary) !important;
    border:0 !important;
    border-radius:var(--sk-btn-radius) !important;
}
body[class*="skin-theme-"] .button-primary:hover{
    background-color:var(--sk-primary-hover) !important;
}
body[class*="skin-theme-"] #main-body .button-secondary{
    background-color:transparent !important;
    color:var(--sk-primary) !important;
    border:1px solid var(--sk-primary) !important;
    border-radius:var(--sk-btn-radius) !important;
}
body[class*="skin-theme-"] #main-body .button-secondary:hover{
    background-color:var(--sk-primary-soft) !important;
}

/* ---- 云服务器套餐（tab 容器 + 表格） ---- */
body[class*="skin-theme-"] .tab1{
    border:1px solid var(--sk-border) !important;
    border-radius:var(--sk-radius) !important;
    background-color:var(--sk-panel);
}
body[class*="skin-theme-"] .tab__header.tab-top{
    background-color:var(--sk-bg-alt) !important;
    border-bottom:1px solid var(--sk-border);
}
body[class*="skin-theme-"] .tab__header > div{
    color:var(--sk-muted) !important;
    border-bottom:3px solid transparent !important;
    font-weight:500;
}
body[class*="skin-theme-"] .tab__header > div:hover,
body[class*="skin-theme-"] .tab__header > div.tab__header--active{
    color:var(--sk-primary) !important;
    border-bottom:3px solid var(--sk-primary) !important;
    background:transparent !important;
}
body[class*="skin-theme-"] table.horizontal-divider th{
    color:var(--sk-muted) !important;
    border-bottom:1px solid var(--sk-border) !important;
    font-weight:500;
}
body[class*="skin-theme-"] table.horizontal-divider td{
    color:var(--sk-text) !important;
    border-bottom:1px solid var(--sk-border) !important;
}
body[class*="skin-theme-"] table.horizontal-divider tr:last-child td{
    border-bottom:0 !important;
}
body[class*="skin-theme-"] table.horizontal-divider tbody tr:hover td{
    background-color:var(--sk-bg-alt) !important;
}

/* ---- 价格 ---- */
body[class*="skin-theme-"] .text-red,
body[class*="skin-theme-"] .price,
body[class*="skin-theme-"] .price .text-red{
    color:var(--sk-price) !important;
}

/* ---- 区域切换 pills（物理机/虚拟主机/网络） ---- */
body[class*="skin-theme-"] .tab-group.tab-group-switch-style > ul{
    background-color:var(--sk-bg-alt) !important;
    border:1px solid var(--sk-border);
    border-radius:var(--sk-btn-radius) !important;
}
body[class*="skin-theme-"] .tab-group.tab-group-switch-style > ul li{
    color:var(--sk-muted) !important;
    border-radius:calc(var(--sk-btn-radius) - 2px) !important;
    background:transparent !important;
    font-weight:500;
}
body[class*="skin-theme-"] .tab-group.tab-group-switch-style > ul li.active{
    background-color:var(--sk-panel) !important;
    color:var(--sk-primary) !important;
    box-shadow:0 1px 4px rgba(0,0,0,.08);
}

/* ---- 产品卡片（物理机/虚拟主机） ---- */
body[class*="skin-theme-"] .item_goods .item{
    background-color:var(--sk-panel) !important;
    border:1px solid var(--sk-border) !important;
    border-radius:var(--sk-radius) !important;
    transition:border-color .2s, box-shadow .2s, transform .2s;
}
body[class*="skin-theme-"] .item_goods .item.active{
    border-color:var(--sk-primary) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.10) !important;
    transform:translateY(-3px);
}
body[class*="skin-theme-"] .item_goods .item .heading h3{
    color:var(--sk-heading) !important;
    text-transform:none;
}
body[class*="skin-theme-"] .item_goods .item .heading .iconfont{
    color:var(--sk-primary) !important;
}
body[class*="skin-theme-"] .item_goods .item .param .name{
    color:var(--sk-muted) !important;
}
body[class*="skin-theme-"] .item_goods .item .param .value{
    color:var(--sk-text) !important;
}

/* ---- 网络分布 ---- */
body[class*="skin-theme-"] .network-map ul li{
    background-color:var(--sk-primary) !important;
}
body[class*="skin-theme-"] .network-map ul li span{
    background-color:var(--sk-primary) !important;
    color:var(--sk-on-primary) !important;
    border-radius:4px;
}
body[class*="skin-theme-"] .text-primary{
    color:var(--sk-primary) !important;
}
body[class*="skin-theme-"] .text-color-success{
    color:#12b76a !important;
}

/* ---- 特性区图标 ---- */
body[class*="skin-theme-"] .icon-feature{
    color:var(--sk-primary) !important;
}

/* ---- 页脚 ---- */
body[class*="skin-theme-"] #footer,
body[class*="skin-theme-"] #footer .footer-primary,
body.footer-dark[class*="skin-theme-"] #footer,
body.footer-dark[class*="skin-theme-"] #footer .footer-primary{
    background-color:var(--sk-footer-bg) !important;
    color:var(--sk-footer-text) !important;
}
body[class*="skin-theme-"] #footer a:not(.button),
body.footer-dark[class*="skin-theme-"] #footer a:not(.button){
    color:var(--sk-footer-text) !important;
}
body[class*="skin-theme-"] #footer a:not(.button):hover,
body.footer-dark[class*="skin-theme-"] #footer a:not(.button):hover{
    color:var(--sk-primary) !important;
    background:transparent !important;
}

/* ---- 右侧客服浮条 ---- */
body[class*="skin-theme-"] .chat_box{
    box-shadow:0 4px 20px 0 rgba(0,0,0,.18) !important;
    border-radius:var(--sk-radius);
    overflow:hidden;
}
body[class*="skin-theme-"] .chat_box li a.link{
    background:var(--sk-primary) !important;
    color:var(--sk-on-primary) !important;
    border-bottom:1px solid rgba(255,255,255,.15) !important;
}
body[class*="skin-theme-"] .chat_box li a.link:hover{
    background:var(--sk-primary-hover) !important;
}
body[class*="skin-theme-"] .chat_box li > div{
    background-color:var(--sk-panel) !important;
    color:var(--sk-text) !important;
    border:1px solid var(--sk-border);
    border-radius:var(--sk-radius);
}

/* ================= 主题特有微调 ================= */

/* --- B 深空暗色 --- */
body.skin-theme-b #header{
    box-shadow:0 1px 0 var(--sk-border);
}
body.skin-theme-b .content-row-color .content-header h1 mark{
    background-color:var(--sk-primary-soft) !important;
    color:var(--sk-primary) !important;
}
body.skin-theme-b table.horizontal-divider tbody tr:hover td{
    background-color:#0e1e33 !important;
}
body.skin-theme-b .tab-group.tab-group-switch-style > ul li.active{
    box-shadow:none;
}
body.skin-theme-b .item_goods .item.active{
    box-shadow:0 0 0 1px var(--sk-primary), 0 12px 34px rgba(0,0,0,.5) !important;
}
/* 暗色下地图贴图整体提亮 */
body.skin-theme-b .network-map img{
    opacity:.85;
    filter:invert(1) hue-rotate(180deg) saturate(.6);
}
/* 暗色下 hero 截图边框化，避免白图刺眼 */
body.skin-theme-b .content-slider .slide img{
    border:1px solid var(--sk-border);
    border-radius:var(--sk-radius);
}

/* --- C 青绿 SaaS --- */
body.skin-theme-c .item_goods .item{
    border-radius:16px !important;
}
body.skin-theme-c .tab-group.tab-group-switch-style > ul,
body.skin-theme-c .tab-group.tab-group-switch-style > ul li{
    border-radius:999px !important;
}
body.skin-theme-c .content-header mark{
    border-radius:999px;
}

/* --- D 极简黑白 --- */
body.skin-theme-d .content-header mark{
    background:transparent !important;
    color:var(--sk-heading) !important;
    padding:0;
    border-bottom:3px solid var(--sk-heading);
    border-radius:0;
}
body.skin-theme-d .item_goods .item.active{
    box-shadow:0 6px 20px rgba(0,0,0,.08) !important;
}
body.skin-theme-d #footer{
    box-shadow:0 -1px 0 var(--sk-border);
}
body.skin-theme-d .tab-group.tab-group-switch-style > ul li.active{
    background-color:#111 !important;
    color:#fff !important;
}