/* ==========================================================================
   CstoneCloud Theme — Core Layer (v2)
   设计基线：实测 cloud.tencent.com 的 computed style
     · 主色 #0052D9；主按钮 linear-gradient(90deg,#0059EB,#2677FF)，圆角 0~2px、无阴影
     · 字重只用 400 / 500；正文 14px；区块标题 32px/500；首屏标题 40px/500
     · 圆角 2 / 4 / 6px；阴影极淡且偏蓝 0 4px 12px rgba(0,65,171,.12)
     · 分层边线 #E5E6EB / #EFF1F5；浅底 #F8FAFD
   Loaded AFTER theme.min.css + custom.css  (see header.tpl)
   ========================================================================== */

:root{
  /* ---- 品牌 ---- */
  --cst-brand:#0052D9;
  --cst-brand-hover:#366EF4;
  --cst-brand-active:#0034A8;
  --cst-brand-50:#F2F7FF;
  --cst-brand-100:#E0EFFF;
  --cst-brand-200:#B5D0FF;
  --cst-grad:linear-gradient(90deg,#0059EB 0%,#2677FF 100%);
  --cst-grad-hover:linear-gradient(90deg,#0052D9 0%,#1E6BEE 100%);
  --cst-cyan:#00A2ED;
  /* ---- 文字 ---- */
  --cst-ink:rgba(0,0,0,.9);
  --cst-title:#181818;
  --cst-text:#4B5B76;
  --cst-text-2:#6F7988;
  --cst-muted:#A7A7A7;
  /* ---- 线与面 ---- */
  --cst-line:#E5E6EB;
  --cst-line-2:#EFF1F5;
  --cst-bg:#FFFFFF;
  --cst-bg-soft:#F8FAFD;
  --cst-dark:#1D2129;
  --cst-dark-2:#2B303B;
  /* ---- 状态 ---- */
  --cst-ok:#00AF66;
  --cst-warn:#FF7D00;
  --cst-danger:#E34D59;
  /* ---- 圆角（腾讯云实测以 0/2/4px 为主） ---- */
  --cst-radius-xs:2px;
  --cst-radius-s:4px;
  --cst-radius:6px;
  --cst-radius-l:8px;
  /* ---- 阴影（极淡、偏蓝） ---- */
  --cst-shadow-xs:0 1px 3px rgba(0,0,0,.08);
  --cst-shadow-sm:0 2px 8px rgba(0,0,0,.1);
  --cst-shadow:0 4px 12px rgba(0,65,171,.12);
  --cst-shadow-lg:0 8px 24px rgba(0,65,171,.14);
  --cst-font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;
  --cst-header-h:64px;
}

/* ---------- 基础排版 ---------- */
body{font-family:var(--cst-font);font-size:14px;line-height:1.6;color:var(--cst-text);-webkit-font-smoothing:antialiased;}
/* body 上永远带着 WHMCS 的 .primary-bg-color，绝不能写成 .primary-bg-color{...!important}（会把整页刷色） */
body.primary-bg-color{background-color:#fff !important;}
h1,h2,h3,h4,h5,h6,.cst-h{color:var(--cst-title);font-weight:500;letter-spacing:0;}
a{color:var(--cst-brand);transition:color .2s;}
a:hover{color:var(--cst-brand-hover);text-decoration:none;}
.cst-wrap{max-width:1200px;margin:0 auto;padding:0 20px;}
.cst-center{text-align:center;}
.cst-divider{height:1px;background:var(--cst-line);border:0;margin:0;}

/* ---------- 区块与标题（对应腾讯云 section__tag / __title / __inner） ---------- */
.cst-section{padding:60px 0;}
.cst-section--soft{background:var(--cst-bg-soft);}
.cst-section--tight{padding:40px 0;}
.cst-sec-block{padding:60px 0;}
.cst-eyebrow{display:inline-block;font-size:12px;font-weight:500;color:var(--cst-muted);letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px;}
.cst-h2,.cst-section h2{font-size:32px;line-height:1.25;font-weight:500;color:var(--cst-title);margin:0 0 14px;}
.cst-sub{font-size:14px;line-height:1.75;color:var(--cst-text-2);margin:0 auto;max-width:720px;}

/* ---------- 按钮（腾讯云实测：高 36px、字号 14、字重 400、圆角 0、无阴影） ---------- */
.cst-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 16px;border:1px solid transparent;border-radius:var(--cst-radius-xs);font-size:14px;font-weight:400;line-height:1;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,color .2s;white-space:nowrap;background:transparent;box-shadow:none;}
.cst-btn i{font-size:13px;}
.cst-btn--primary{background:var(--cst-grad);color:#fff !important;border:0;}
.cst-btn--primary:hover,.cst-btn--primary:focus{background:var(--cst-grad-hover);color:#fff !important;}
.cst-btn--outline-light{background:transparent;color:var(--cst-ink) !important;border:1px solid var(--cst-line);}
.cst-btn--outline-light:hover{border-color:var(--cst-brand);color:var(--cst-brand) !important;background:#fff;}
.cst-btn--ghost{background:#fff;color:var(--cst-ink) !important;border:1px solid var(--cst-line);}
.cst-btn--ghost:hover{border-color:var(--cst-brand);color:var(--cst-brand) !important;}
.cst-btn--lg{height:40px;padding:0 22px;}
.cst-btn--sm{height:30px;padding:0 12px;font-size:13px;}
.cst-btn--block{display:flex;width:100%;}

/* ==========================================================================
   顶栏 + 吸顶主导航
   ========================================================================== */
.cst-topbar{background:var(--cst-bg-soft);border-bottom:1px solid var(--cst-line-2);font-size:12px;color:var(--cst-text-2);}
.cst-topbar__inner{display:flex;align-items:center;justify-content:space-between;min-height:34px;gap:16px;}
.cst-topbar__left,.cst-topbar__right{display:flex;align-items:center;gap:14px;min-width:0;}
.cst-topbar a{color:var(--cst-text-2);text-decoration:none;display:inline-flex;align-items:center;gap:5px;}
.cst-topbar a:hover{color:var(--cst-brand);}
.cst-topbar i{font-size:11px;color:var(--cst-brand);}
.cst-topbar__count{display:inline-block;min-width:15px;height:15px;padding:0 4px;margin-left:3px;border-radius:8px;background:var(--cst-danger);color:#fff;font-size:10px;font-weight:400;line-height:15px;text-align:center;font-style:normal;}
.cst-topbar__sep{display:inline-block;width:1px;height:12px;background:var(--cst-line);}
.cst-dot{display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--cst-line);}
.cst-topnav{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px;position:relative;}
.cst-topnav > li{position:relative;display:block;}
.cst-topnav > li > a{display:inline-flex;align-items:center;gap:5px;padding:4px 6px;border-radius:var(--cst-radius-xs);}
.cst-topnav .dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;left:auto;z-index:1050;display:none;background:#fff;border:1px solid var(--cst-line);border-radius:var(--cst-radius-s);box-shadow:var(--cst-shadow);padding:6px;min-width:196px;margin:0;list-style:none;text-align:left;}
.cst-topnav > li.show > .dropdown-menu,
.cst-topnav .dropdown-menu.show{display:block;}
.cst-topnav .dropdown-menu li{padding:0;margin:0;display:block;}
.cst-topnav .dropdown-menu li > a{display:block;padding:8px 12px !important;border-radius:var(--cst-radius-xs);color:var(--cst-text) !important;font-size:13px;text-decoration:none;font-weight:400;white-space:normal;}
.cst-topnav .dropdown-menu li > a:hover{background:var(--cst-brand-50);color:var(--cst-brand) !important;}

.cst-masthead{position:sticky;top:0;z-index:1030;background:#fff;border-bottom:1px solid var(--cst-line);transition:box-shadow .25s;}
.cst-masthead.is-stuck{box-shadow:var(--cst-shadow);}
.cst-masthead__inner{display:flex;align-items:center;gap:20px;min-height:var(--cst-header-h);}
.cst-brand{display:flex;align-items:center;flex:0 0 auto;text-decoration:none;padding:0;}
.cst-brand img{max-height:38px;width:auto;display:block;}

/* ---------- 主导航 ---------- */
.cst-nav{flex:1 1 auto;display:flex;justify-content:center;min-width:0;}
/* 只作用于主菜单那个 ul：写成 `.cst-nav ul` 会命中 .dropdown-menu 并把它强制展开 */
.cst-nav > ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;}
.cst-nav > ul > li{position:relative;}
.cst-nav > ul > li > a{display:inline-flex;align-items:center;gap:2px;height:var(--cst-header-h);padding:0 14px !important;font-size:14px;font-weight:500;color:var(--cst-title) !important;text-decoration:none;position:relative;transition:color .2s;background:transparent;}
.cst-nav > ul > li > a:hover,.cst-nav > ul > li.active > a,.cst-nav > ul > li > a.active{color:var(--cst-brand) !important;}
.cst-nav > ul > li > a::before{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--cst-brand);transform:scaleX(0);transform-origin:center;transition:transform .25s ease;}
.cst-nav > ul > li > a:hover::before,.cst-nav > ul > li.active > a::before{transform:scaleX(1);}
.cst-nav > ul > li.dropdown > a::after{margin-left:5px;opacity:.4;transition:transform .22s ease,opacity .22s;}
.cst-nav > ul > li.dropdown > a:hover::after{opacity:.85;}
.cst-nav > ul > li.show > a::after{transform:rotate(180deg);opacity:.85;}

/* 子菜单：必须显式 absolute + display:none，不依赖 Bootstrap 是否被完整编译进来 */
.cst-nav .dropdown-menu{position:absolute;top:calc(100% - 6px);left:0;z-index:1050;display:none;list-style:none;float:none;border:1px solid var(--cst-line);border-radius:var(--cst-radius-s);box-shadow:var(--cst-shadow);padding:6px;margin:0;min-width:212px;background:#fff;text-align:left;max-height:calc(100vh - 140px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;}
.cst-nav > ul > li:hover > .dropdown-menu,
.cst-nav > ul > li.show > .dropdown-menu,
.cst-nav .dropdown-menu.show{display:block;}
.cst-nav .dropdown-menu li{padding:0;display:block;margin:0;}
.cst-nav .dropdown-menu li > a{display:block;padding:9px 12px !important;border-radius:var(--cst-radius-xs);font-size:14px;color:var(--cst-text) !important;text-decoration:none;font-weight:400;transition:all .18s;white-space:normal;}
.cst-nav .dropdown-menu li > a:hover{background:var(--cst-brand-50);color:var(--cst-brand) !important;}
.cst-nav .dropdown-menu .dropdown-divider{height:0;margin:5px 4px;border-top:1px solid var(--cst-line-2);}
/* WHMCS 在主导航末尾塞的「更多」溢出收纳桶：li.d-none.dropdown.collapsable-dropdown
   它靠 Bootstrap 的 .d-none 隐藏，菜单为空是正常的（溢出项由脚本搬进来）。
   必须保证 .d-none 永远赢——否则移动端那条 display:block !important 会把它复活成死链接。 */
.cst-nav > ul > li.d-none{display:none !important;}
/* 空菜单不要渲染成一条空白白盒 */
.cst-nav .dropdown-menu:empty{display:none !important;border:0;box-shadow:none;padding:0;min-width:0;}
/* 长菜单自动双列，避免拉成 500px+ 的长条 */
.cst-nav .dropdown-menu.cst-dd--wide{columns:2;column-gap:2px;min-width:444px;}
.cst-nav .dropdown-menu.cst-dd--wide > li{break-inside:avoid;page-break-inside:avoid;}

/* ---------- 右侧动作区 ---------- */
.cst-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;}
.cst-icon-btn{width:34px;height:34px;border-radius:var(--cst-radius-xs);border:1px solid var(--cst-line);background:#fff;color:var(--cst-text);display:inline-flex;align-items:center;justify-content:center;position:relative;transition:all .2s;cursor:pointer;text-decoration:none;font-size:14px;}
.cst-icon-btn:hover{border-color:var(--cst-brand);color:var(--cst-brand);background:var(--cst-brand-50);}
.cst-icon-btn__badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--cst-danger);color:#fff;font-size:11px;font-weight:400;line-height:16px;text-align:center;}
.cst-burger{display:none;width:36px;height:36px;border-radius:var(--cst-radius-xs);border:1px solid var(--cst-line);background:#fff;color:var(--cst-ink);font-size:15px;cursor:pointer;align-items:center;justify-content:center;}
.cst-user{display:flex;align-items:center;gap:8px;}
.cst-user__name{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:var(--cst-radius-xs);background:var(--cst-brand-50);border:1px solid var(--cst-brand-100);color:var(--cst-ink);font-size:13px;font-weight:500;text-decoration:none;max-width:190px;}
.cst-user__name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.cst-searchbar{display:none;border-top:1px solid var(--cst-line-2);background:var(--cst-bg-soft);padding:12px 0;}
.cst-searchbar.is-open{display:block;}
.cst-searchbar form{display:flex;gap:8px;}
.cst-searchbar input{flex:1;height:38px;border:1px solid var(--cst-line);border-radius:var(--cst-radius-xs);padding:0 14px;font-size:14px;color:var(--cst-ink);outline:none;background:#fff;}
.cst-searchbar input:focus{border-color:var(--cst-brand);box-shadow:0 0 0 2px rgba(0,82,217,.12);}
.cst-search{display:flex;gap:8px;}

/* ---------- 客户提醒条（余额 / 到期 / 欠费） ----------
   模板里已改成普通行结构，不再用 Bootstrap carousel。
   原因：.carousel-item 是 float 布局，父级高度会塌陷（实测色条 27px / 内容 43px），
   文字会溢出到色条外面、还被下边线穿过。 单条提醒也不应该出现左右箭头。 */
.cst-alerts{font-size:13px;}
.cst-alert{display:flex;align-items:center;justify-content:center;gap:9px;padding:11px 16px;
  text-decoration:none !important;border-bottom:1px solid transparent;line-height:1.5;transition:background .2s;}
.cst-alert i{font-size:13px;flex:0 0 auto;}
.cst-alert__msg{line-height:1.5;}
.cst-alert--success,.cst-alert--info{background:var(--cst-brand-50);color:var(--cst-brand) !important;border-bottom-color:var(--cst-brand-100);}
.cst-alert--success:hover,.cst-alert--info:hover{background:var(--cst-brand-100);color:var(--cst-brand-active) !important;}
.cst-alert--warning{background:#FFF7E6;color:#9A5B00 !important;border-bottom-color:#FFE0A3;}
.cst-alert--warning:hover{background:#FFEFCC;color:#7A4700 !important;}
.cst-alert--danger{background:#FDECEE;color:#C0392B !important;border-bottom-color:#F7C6CB;}
.cst-alert--danger:hover{background:#FADDE0;color:#9E2B20 !important;}

/* ==========================================================================
   移动端抽屉
   ========================================================================== */
.cst-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:all .3s;z-index:1035;}
.cst-overlay.is-open{opacity:1;visibility:visible;}
.cst-nav__head,.cst-nav__foot{display:none;}

@media (max-width:1199.98px){
  .cst-nav > ul > li > a{padding:0 10px !important;font-size:13.5px;}
  .cst-nav > ul > li > a::before{left:10px;right:10px;}
}
@media (max-width:991.98px){
  .cst-burger{display:inline-flex;}
  .cst-actions .cst-actions__cta{display:none;}
  .cst-nav{position:fixed;top:0;right:0;bottom:0;width:310px;max-width:86vw;background:#fff;z-index:1040;display:block;justify-content:flex-start;padding:0 0 20px;overflow-y:auto;transform:translateX(102%);transition:transform .3s ease;box-shadow:var(--cst-shadow-lg);}
  .cst-nav.is-open{transform:translateX(0);}
  .cst-nav__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--cst-line);}
  .cst-nav__title{font-size:15px;font-weight:500;color:var(--cst-title);}
  .cst-nav__close{width:32px;height:32px;border-radius:var(--cst-radius-xs);border:1px solid var(--cst-line);background:#fff;color:var(--cst-text);cursor:pointer;}
  .cst-nav > ul{display:block;width:100%;padding:6px 12px;}
  .cst-nav > ul > li{display:block !important;width:100%;}
  .cst-nav > ul > li > a{height:auto;padding:13px 10px !important;font-size:15px;font-weight:500;border-radius:var(--cst-radius-xs);justify-content:space-between;width:100%;}
  .cst-nav > ul > li > a::before{display:none;}
  .cst-nav > ul > li > a:hover{background:var(--cst-brand-50);color:var(--cst-brand) !important;}
  /* 触屏禁用 hover 展开，交给 JS 的 .show */
  .cst-nav > ul > li:hover > .dropdown-menu{display:none;}
  .cst-nav .dropdown-menu{position:static !important;top:auto;display:none;float:none;transform:none !important;box-shadow:none;border:0;border-left:1px solid var(--cst-line);border-radius:0;margin:0 0 4px 10px;padding:0 0 0 8px;min-width:0;width:calc(100% - 10px);max-height:none;columns:auto !important;}
  .cst-nav > ul > li.show > .dropdown-menu,
  .cst-nav .dropdown-menu.show{display:block;}
  .cst-nav .dropdown-menu.cst-dd--wide{min-width:0;}
  .cst-nav .dropdown-menu li > a{padding:9px 10px !important;font-size:14px;}
  .cst-nav__foot{display:flex;padding:16px 18px;border-top:1px solid var(--cst-line);margin-top:10px;flex-direction:column;gap:10px;}
}

/* ==========================================================================
   页脚（淡蓝底 + 深色文字；原为深灰 #1D2129 + 白字）
   ========================================================================== */
.cst-footer{background:#EEF1F5;color:var(--cst-text);font-size:13px;padding:52px 0 0;}
.cst-footer a{color:var(--cst-text);text-decoration:none;}
.cst-footer a:hover{color:var(--cst-brand);}
.cst-footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:36px;padding-bottom:40px;}
.cst-footer h4{font-size:14px;font-weight:500;color:var(--cst-title);margin:0 0 16px;}
.cst-footer ul{list-style:none;margin:0;padding:0;}
.cst-footer ul li{margin-bottom:10px;line-height:1.6;}
.cst-footer__brand{margin-bottom:16px;}
.cst-footer__brand img{max-height:34px;width:auto;display:block;background:#fff;padding:8px 12px;border-radius:var(--cst-radius-s);border:1px solid var(--cst-line);}
.cst-footer__desc{color:var(--cst-text);font-size:13px;line-height:1.75;margin:0 0 18px;max-width:340px;}
.cst-footer__contact li{display:flex;gap:9px;align-items:flex-start;color:var(--cst-text-2);}
.cst-footer__contact i{color:var(--cst-brand);margin-top:4px;font-size:12px;}
.cst-footer__contact a{color:var(--cst-brand) !important;}
.cst-footer__badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.cst-footer__badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--cst-brand-200);background:#fff;border-radius:var(--cst-radius-xs);font-size:12px;color:var(--cst-text);}
.cst-footer__badge i{color:var(--cst-brand);font-size:11px;}
.cst-footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--cst-line);padding:18px 0;font-size:12px;color:var(--cst-text-2);}
.cst-footer__bottom p{margin:0;}
.cst-footer__social{display:flex;gap:14px;margin:0;}
.cst-footer__social a{font-size:16px;color:var(--cst-text-2);}
.cst-footer__social a:hover{color:var(--cst-brand);}
.cst-langbtn{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--cst-brand-200);color:var(--cst-text);font-size:12px;padding:6px 10px;border-radius:var(--cst-radius-xs);cursor:pointer;}
.cst-langbtn:hover{border-color:var(--cst-brand);color:var(--cst-brand);}

.cst-totop{position:fixed;right:22px;bottom:26px;width:40px;height:40px;border-radius:var(--cst-radius-xs);border:1px solid var(--cst-line);background:#fff;color:var(--cst-text);box-shadow:var(--cst-shadow);cursor:pointer;opacity:0;visibility:hidden;transition:all .25s;z-index:1020;}
.cst-totop.is-on{opacity:1;visibility:visible;}
.cst-totop:hover{border-color:var(--cst-brand);color:var(--cst-brand);}

/* ==========================================================================
   原生 WHMCS / Bootstrap 组件对齐（内页、购物车、域名搜索都会用到）
   只改观感（色 / 圆角 / 高度 / 字重），不动布局，避免影响下单流程
   ========================================================================== */
.btn{border-radius:var(--cst-radius-xs);font-size:14px;font-weight:400;}
.btn-primary{background:var(--cst-grad);border-color:transparent;color:#fff;}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary:not(:disabled):not(.disabled):active{background:var(--cst-grad-hover);border-color:transparent;color:#fff;box-shadow:none;}
.btn-success{background:var(--cst-ok);border-color:var(--cst-ok);color:#fff;}
.btn-success:hover{border-color:#008F53;background:#008F53;color:#fff;}
.btn-outline-primary{color:var(--cst-brand);border-color:var(--cst-brand-200);background:#fff;}
.btn-outline-primary:hover{background:var(--cst-brand-50);border-color:var(--cst-brand);color:var(--cst-brand);}
.btn-link{color:var(--cst-brand);font-weight:400;}
.btn-link:hover{color:var(--cst-brand-hover);}
.form-control{border:1px solid var(--cst-line);border-radius:var(--cst-radius-xs);font-size:14px;color:var(--cst-ink);}
.form-control:focus{border-color:var(--cst-brand);box-shadow:0 0 0 2px rgba(0,82,217,.12);}
.card{border:1px solid var(--cst-line);border-radius:var(--cst-radius-s);box-shadow:none;background:#fff;}
.card-title{font-size:18px;font-weight:500;color:var(--cst-title);}
.text-muted{color:var(--cst-text-2) !important;}
.breadcrumb{background:transparent;}
.dropdown-menu{border:1px solid var(--cst-line);border-radius:var(--cst-radius-s);box-shadow:var(--cst-shadow);font-size:14px;}
.dropdown-item{border-radius:var(--cst-radius-xs);}
.dropdown-item:hover,.dropdown-item:focus{background:var(--cst-brand-50);color:var(--cst-brand);}
.modal-content{border:0;border-radius:var(--cst-radius-s);box-shadow:var(--cst-shadow-lg);}
.badge{border-radius:var(--cst-radius-xs);font-weight:400;}
.table th{font-weight:500;color:var(--cst-title);border-top:0;}

/* ---------- 面包屑 ---------- */
.master-breadcrumb{background:var(--cst-bg-soft);border-bottom:1px solid var(--cst-line);}
.master-breadcrumb .breadcrumb{padding:14px 0;margin:0;font-size:13px;}
.master-breadcrumb .breadcrumb a{color:var(--cst-brand);}