/* =========================================================
   t26-cloudhost.css
   云服务器页 2026 品牌主题覆盖（在 cloudhostly.css / jqtransform.css 之后加载）
   作用域限定在 #content，避免污染 2026 全局（hero / CTA 用 t26 工具类）。
   逻辑 DOM 完全沿用 2016（diyserver.js），此处只改视觉。
   ========================================================= */

#content {
  background: #ffffff;
  color: #070b18;
  font-family: inherit;
}

/* ---------- 2016 浮动工具类兼容 ----------
   2016 版依赖 global.css 的 .cl / .clearfix 清浮动，2026 未加载该文件。
   缺失时 .linebox1 内的浮动行（线路 / 存储模式 / 服务标准）会互相环绕，
   导致配置器排版错乱。定义与 2016 global.css 完全一致。 */
#content .cl:after,
#content .clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#content .cl,
#content .clearfix { zoom: 1; }

/* ---------- 顶部 Tab 导航：弹性云 / 套餐云 ---------- */
#content .host-content { padding-bottom: 40px; }

#content .CloudRightMainSelectMenu {
  margin: 0 auto 28px;
  border-bottom: 1px solid #e6eaf3;
}
#content .CloudRightMainSelectMenu > ul {
  display: flex;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
#content .CloudRightMainSelectMenu .wjf-ui-tab-style2 li a,
#content .CloudRightMainSelectMenu > ul > li > a {
  display: inline-block;
  padding: 12px 26px;
  font-size: 16px;
  font-weight: 600;
  color: #5b6784;
  border-radius: 10px 10px 0 0;
  border: 1px solid transparent;
  border-bottom: none;
  text-decoration: none;
  transition: all .15s ease;
}
#content .CloudRightMainSelectMenu .Tab_tx_a > a,
#content .CloudRightMainSelectMenu .Tab_tc_a > a,
#content .CloudRightMainSelectMenu > ul > li > a.active {
  color: #1b4bf0;
  background: #eff4ff;
  border-color: #e6eaf3;
}
#content .CloudRightMainSelectMenu .Tab_tx_b > a,
#content .CloudRightMainSelectMenu .Tab_tc_b > a {
  color: #5b6784;
  background: transparent;
}

/* ---------- 配置器布局 ---------- */
#content .host-config { padding: 8px 0 24px; }

#content .linebox1 {
  background: #f5f7fc;
  border: 1px solid #e6eaf3;
  border-radius: 14px;
  padding: 18px 24px;
  margin-bottom: 18px;
}
#content .linebox1 #prodtype_msg,
#content .linebox1 #tuijian_msg { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
#content .linebox1 span[style*="font-size:14px"] {
  font-size: 14px !important; color: #1e2942; font-weight: 600;
}

/* 推荐配置按钮（通用型 / 高频CPU型 等） */
#content .btn_page_ {
  border: 1px solid #dde8ff;
  background: #ffffff;
  color: #1e2942;
  padding: 8px 18px;
  border-radius: 999px;
  cursor: pointer;
  font-size: 14px;
  transition: all .15s ease;
}
#content .btn_page_:hover { border-color: #1b4bf0; color: #1b4bf0; }
#content .btn_page_1 {
  background: #1b4bf0;
  border-color: #1b4bf0;
  color: #ffffff;
}

/* 配置项行 */
#content .dd-list,
#content .dd-line,
#content dd.dd-list {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 4px;
  border-bottom: 1px solid #f0f3f9;
}
#content .dd-list > label,
#content dd.dd-list > label,
#content .dd-list label.label,
#content .cpu_label, #content .ram_label, #content .data_label,
#content .flux_label, #content .msg label[class="label"] {
  flex: 0 0 96px;
  font-size: 14px;
  font-weight: 600;
  color: #1e2942;
  padding-top: 6px;
}
#content .dd-list .msg,
#content dd.dd-list .msg { flex: 1 1 auto; }

/* 滑块（inputrange）品牌化 */
#content .slider {
  position: relative;
  height: 6px;
  background: #e6eaf3;
  border-radius: 999px;
  margin-top: 14px;
}
#content .slider .progress {
  position: absolute; left: 0; top: 0; height: 6px;
  background: linear-gradient(90deg, #3a67ff, #1b4bf0);
  border-radius: 999px;
}
#content .slider a.handle {
  position: absolute; top: 50%; width: 18px; height: 18px;
  margin: -9px 0 0 -9px; border-radius: 50%;
  background: #ffffff; border: 3px solid #1b4bf0;
  box-shadow: 0 2px 6px rgba(27,75,240,.25); cursor: pointer;
}
#content .slider-leftbutton, #content .slider-rightbutton {
  display: inline-block; width: 22px; height: 22px; line-height: 20px;
  text-align: center; border: 1px solid #dde8ff; border-radius: 6px;
  color: #1b4bf0; cursor: pointer; margin-right: 6px;
}
#content #cpuvalue > div, #content #ramvalue > div, #content #data_range > div {
  color: #5b6784; font-weight: 500;
}
#content #cpuvalue > div, #content #ramvalue > div { padding: 4px 0; }

/* 单选 / 复选项（jqtransform 之后）品牌化 */
#content .jqTransformRadio, #content .jqTransformRadioWrapper { margin-right: 6px; }
#content .otherbox { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; }
#content .divhengzhelai, #content .divlaizhelai { display: flex; flex-wrap: wrap; gap: 10px 18px; }

/* 表单输入（联系人表单等） */
#content .common-input {
  border: 1px solid #dde8ff;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 14px;
  color: #070b18;
  outline: none;
}
#content .common-input:focus { border-color: #1b4bf0; box-shadow: 0 0 0 3px rgba(27,75,240,.12); }
#content .common-label { color: #1e2942; font-weight: 600; }

/* 价格 */
#content .price_red, #content #pricelist {
  color: #1b4bf0;
  font-weight: 700;
  font-size: 24px;
}

/* 按钮：立即购买 / 测试购买 */
#content .common-btn.cloud-btn,
#content input.common-btn.cloud-btn {
  background: linear-gradient(135deg, #3a67ff, #1b4bf0);
  border: none;
  color: #ffffff;
  padding: 12px 34px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s ease;
}
#content .common-btn.cloud-btn:hover { box-shadow: 0 8px 20px rgba(27,75,240,.3); transform: translateY(-1px); }
#content .g-common-btn.g-dark-btn.cloud-btn {
  background: #ffffff;
  border: 1px solid #dde8ff;
  color: #1b4bf0;
}
#content .g-common-btn.g-dark-btn.cloud-btn:hover { background: #eff4ff; }

/* 弹性云配置器里的提示气泡 */
#content #cpu_datatishi, #content #ram_datatishi, #content #flux_datatishi {
  background: #fff7e6; border: 1px solid #ffd591; color: #ad6800;
  border-radius: 8px; margin: 8px 0 8px 110px; text-align: center;
}

/* ---------- 套餐云（xcloudA-F）表格 ---------- */
#content .vps-list {
  border: 1px solid #e6eaf3;
  border-radius: 14px;
  padding: 20px 24px;
  margin-bottom: 18px;
  background: #ffffff;
  transition: box-shadow .15s ease, border-color .15s ease;
}
#content .vps-list:hover { box-shadow: 0 10px 30px rgba(27,75,240,.08); border-color: #bcd2ff; }
#content .vps-title {
  display: flex; align-items: center; gap: 12px;
  font-size: 17px; font-weight: 700; color: #070b18; margin-bottom: 14px;
}
#content .vps-line { flex: 1; height: 1px; background: #e6eaf3; }
#content .vps-table { width: 100%; border-collapse: collapse; }
#content .vps-table th {
  text-align: right; color: #5b6784; font-weight: 500; padding: 8px 12px; white-space: nowrap;
}
#content .vps-table td { color: #1e2942; padding: 8px 12px; }
#content .vps-table a.common-btn.vps-buy,
#content a.common-btn.vps-buy {
  display: inline-block; background: #1b4bf0; color: #fff;
  padding: 8px 22px; border-radius: 8px; text-decoration: none; font-weight: 600;
}
#content .vps-table a.common-btn.vps-buy:hover { box-shadow: 0 6px 16px rgba(27,75,240,.3); }

/* ---------- 锚点导航 ---------- */
#content .wjf-page-anchor-nav-container {
  margin: 30px auto;
}
#content .wjf-page-anchor-nav {
  display: flex; gap: 10px; list-style: none; padding: 0; margin: 0;
  border-bottom: 1px solid #e6eaf3;
}
#content .wjf-page-anchor-nav li a {
  display: inline-block; padding: 12px 22px; color: #5b6784; font-weight: 600;
  text-decoration: none; border-radius: 10px 10px 0 0;
}
#content .wjf-page-anchor-nav li a.active { color: #1b4bf0; background: #eff4ff; }

/* ---------- 底部内容区块：介绍 / 优势 / FAQ ---------- */
#content .cloud-introduce-top p { color: #1e2942; line-height: 1.9; margin: 0 0 16px; }
#content .cloud-introduce-middle { display: flex; gap: 20px; flex-wrap: wrap; margin: 20px 0 40px; }
#content .cloud-introduce-middle img { border-radius: 12px; max-width: 100%; }

#content .cloud-advantage-list {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; list-style: none; padding: 0; margin: 20px 0 40px;
}
#content .cloud-advantage-list li {
  background: #f5f7fc; border: 1px solid #e6eaf3; border-radius: 14px; padding: 24px;
}
#content .cloud-advantage-list .cloud-title { color: #070b18; font-weight: 700; font-size: 16px; margin: 12px 0 8px; }
#content .cloud-advantage-list li p { color: #5b6784; line-height: 1.8; font-size: 14px; }

#content .cloud-faq .faq-list {
  border-bottom: 1px solid #f0f3f9; padding: 18px 0;
}
#content .cloud-faq .faq-list dt { color: #070b18; font-weight: 700; font-size: 16px; margin-bottom: 8px; }
#content .cloud-faq .faq-list dt .font18 { color: #1b4bf0; margin-right: 6px; }
#content .cloud-faq .faq-list dd { color: #5b6784; line-height: 1.9; font-size: 14px; }
#content .cloud-faq .faq-list dd p { margin: 0 0 8px; }
#content .faq-btn {
  display: inline-block; margin-top: 20px; color: #1b4bf0; font-weight: 600; text-decoration: none;
}

#content a.common-btn { text-decoration: none; }

/* 让宽屏容器与 2026 一致 */
#content .wide1190 { max-width: 1190px; margin: 0 auto; padding: 0 16px; }