/* ============================================================
   顶天云商城 · 前台会员中心 —— 独立现代风皮肤 (user-modern.css)
   仅覆盖颜色/边框/圆角/阴影，不改动 display/position，
   以保留 Color Admin 侧栏折叠(app-aside-folded)与移动端 off-screen 行为。
   ============================================================ */
:root{
  --mc-bg:#f4f6fb;
  --mc-card:#ffffff;
  --mc-border:rgba(15,23,42,.07);
  --mc-text:#1e293b;
  --mc-muted:#64748b;
  --mc-accent:#4f46e5;
  --mc-accent-2:#7c3aed;
  --mc-accent-soft:#eef2ff;
  --mc-grad:linear-gradient(135deg,#5b6cff 0%,#8b5cf6 100%);
  --mc-shadow:0 6px 24px rgba(31,41,55,.06);
  --mc-shadow-hover:0 12px 30px rgba(79,70,229,.16);
  --mc-radius:16px;
}

/* ---------- 页面底色 ---------- */
html{ background-color:var(--mc-bg); }

/* ---------- 顶部导航条 ---------- */
#header.app-header,
#header.app-header .navbar-header,
#header.app-header .navbar-collapse{
  background-color:#fff !important;
  color:var(--mc-text) !important;
  border-bottom:1px solid var(--mc-border) !important;
  box-shadow:0 1px 12px rgba(31,41,55,.04) !important;
}
#header.app-header .navbar-brand,
#header.app-header .navbar-brand:hover,
#header.app-header .navbar-brand:focus{
  color:var(--mc-text) !important;
}
#header.app-header .navbar-brand > i{ color:var(--mc-accent) !important; }
#header.app-header .navbar-collapse .nav > li > a,
#header.app-header .nav.navbar-nav > li > a,
#header.app-header .navbar-btn .text,
#header.app-header .navbar-btn .text-active{
  color:#475569 !important;
}
#header.app-header .nav.navbar-nav > li > a:hover{ color:var(--mc-accent) !important; }
#header.app-header .navbar-header .pull-right.visible-xs{ color:#475569 !important; }
#header.app-header .navbar-header .pull-right.visible-xs .glyphicon{ color:#475569 !important; }
#header.app-header .avatar img{ border-color:#fff !important; box-shadow:0 0 0 2px var(--mc-accent-soft); }
#header .dropdown-menu > li > a{ color:#475569 !important; }
#header .dropdown-menu{ border:1px solid var(--mc-border); box-shadow:var(--mc-shadow); border-radius:12px; }
/* 头像下拉触发按钮：把贴顶出血的紫色高亮改成内缩圆角胶囊 */
#header .navbar-right > li > a.dropdown-toggle{
  background:transparent !important;
  color:#475569 !important;
  border-radius:12px !important;
  margin:6px 10px !important;
  padding:4px 10px !important;
  line-height:1.5 !important;
  transition:background-color .18s ease,color .18s ease;
}
#header .navbar-right > li > a.dropdown-toggle .avatar{ margin-top:0 !important; margin-bottom:0 !important; }
#header .navbar-right > li > a.dropdown-toggle:hover,
#header .navbar-right > li > a.dropdown-toggle:focus,
#header .navbar-right > li.open > a.dropdown-toggle{
  background:var(--mc-accent-soft) !important;
  color:var(--mc-accent) !important;
}
#header .navbar-right > li.open > a.dropdown-toggle .caret,
#header .navbar-right > li > a.dropdown-toggle:hover .caret{ border-top-color:var(--mc-accent) !important; border-bottom-color:var(--mc-accent) !important; }

/* ---------- 左侧边栏 ---------- */
/* 侧栏透明露出 .app 灰底(#f0f3f4)；导航做成白色圆角卡片浮在灰底上。
   灰边距放「上/下/左」(用 aside 的 padding 撑出，稳、不会被 margin 合并吃掉)；右边距归零，卡片贴齐内容区(和以前一样)。 */
#aside.app-aside,
#aside.app-aside.bg-dark,
#aside.app-aside.bg-light.dker{
  background:transparent !important;
  border-right:none !important;
  padding:22px 0 12px 12px !important;
}
#aside.app-aside:before{ display:none !important; }
#aside .aside-wrap,
#aside .navi-wrap{ background:transparent !important; }
#aside .navi{
  background:#fff;
  border-radius:16px;
  box-shadow:var(--mc-shadow);
  margin:0 !important;
  padding:10px 0 14px;
}
#aside .navi ul.nav{ padding:0 8px !important; }
#aside .navi ul.nav > li > a{
  color:#475569 !important;
  border-radius:12px !important;
  margin:2px 10px !important;
  padding:10px 14px 10px 42px !important;
  overflow:hidden;
  transition:background-color .18s ease,color .18s ease;
}
#aside .navi ul.nav > li > a:hover{
  background-color:#f1f5f9 !important;
  color:var(--mc-accent) !important;
}
#aside .navi ul.nav > li.active > a,
#aside .nav > li.active > a{
  background-color:var(--mc-accent-soft) !important;
  color:var(--mc-accent) !important;
  font-weight:600;
  border-radius:12px !important;
  margin:2px 10px !important;
  overflow:hidden;
}
/* 去掉 Color Admin 选中项的整行出血背景与左侧尖角指示 */
#aside .navi ul.nav > li.active{ background:transparent !important; }
#aside .navi ul.nav > li.active > a:before,
#aside .navi ul.nav > li.active > a:after{ display:none !important; content:none !important; }
#aside .navi ul.nav > li.active > a > i{ color:var(--mc-accent) !important; background:transparent !important; }
#aside .navi ul.nav > li > a > i{ color:inherit !important; }
/* 分组标题 导航/其他 —— 可点击的 −/+ 折叠开关（参考图2） */
#aside .nav > li.mc-nav-group{
  display:flex; align-items:center; gap:10px;
  padding:14px 20px 8px;
  margin-top:8px;
  color:var(--mc-text) !important;
  font-size:14px; font-weight:700; line-height:1;
  letter-spacing:.01em;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
#aside .nav > li.mc-nav-group .mc-nav-group-ico{
  position:relative;
  width:22px; height:22px; border-radius:6px;
  background:#fff;
  border:1px solid var(--mc-border);
  flex:0 0 auto;
  transition:border-color .18s ease, box-shadow .18s ease;
}
#aside .nav > li.mc-nav-group:hover .mc-nav-group-ico{
  border-color:var(--mc-accent);
  box-shadow:0 0 0 3px var(--mc-accent-soft);
}
#aside .nav > li.mc-nav-group .mc-nav-group-ico::before,
#aside .nav > li.mc-nav-group .mc-nav-group-ico::after{
  content:""; position:absolute; left:50%; top:50%;
  background:var(--mc-muted); border-radius:1px;
  transform:translate(-50%,-50%);
  transition:background .18s ease;
}
#aside .nav > li.mc-nav-group .mc-nav-group-ico::before{ width:10px; height:2px; }
#aside .nav > li.mc-nav-group .mc-nav-group-ico::after{ width:2px; height:10px; opacity:0; }
#aside .nav > li.mc-nav-group:hover .mc-nav-group-ico::before,
#aside .nav > li.mc-nav-group:hover .mc-nav-group-ico::after{ background:var(--mc-accent); }
#aside .nav > li.mc-nav-group.collapsed .mc-nav-group-ico::after{ opacity:1; }
/* 二级子菜单 */
#aside .nav-sub, #aside .nav-sub.dk{ background-color:#f8fafc !important; }
#aside .nav-sub li a{ color:#52606f !important; }
#aside .nav-sub li a:hover{ color:var(--mc-accent) !important; }
#aside .nav-sub li.active a{ color:var(--mc-accent) !important; font-weight:600; }

/* ============================================================
   仪表盘内容 (mc-*)
   ============================================================ */
.mc-page{ padding:22px 10px !important; }

/* 顶部弱密码提醒 */
.mc-alerts .alert{
  border:none !important;
  border-radius:14px;
  box-shadow:var(--mc-shadow);
  background:#fef2f2 !important;
  color:#b91c1c !important;
  font-weight:500;
}
.mc-alerts .alert a{ color:#7f1d1d; text-decoration:underline; }

/* 余额 hero 卡 */
.mc-hero{
  position:relative;
  overflow:hidden;
  background:var(--mc-grad);
  border-radius:20px;
  padding:26px 28px;
  color:#fff;
  box-shadow:0 16px 40px rgba(91,108,255,.28);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:22px;
  margin-bottom:22px;
}
.mc-hero:after{
  content:"";position:absolute;right:-60px;top:-60px;
  width:220px;height:220px;border-radius:50%;
  background:rgba(255,255,255,.12);
}
.mc-hero-id{ display:flex; align-items:center; gap:14px; position:relative; z-index:1; }
.mc-avatar{
  width:60px;height:60px;border-radius:50%;object-fit:cover;
  border:3px solid rgba(255,255,255,.7);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.mc-hero-name{ font-size:19px; font-weight:700; line-height:1.2; }
.mc-hero-sub{ font-size:12.5px; opacity:.9; margin-top:4px; }
/* 等级 + 升级合并为同一张白卡：左侧等级名，右侧「↑升级」，整卡点击开升级弹窗 */
.mc-hero-lv{
  display:inline-flex; align-items:center;
  margin-left:6px; padding:0 2px 0 9px; border-radius:999px;
  background:#fff; color:var(--mc-accent);
  font-size:11.5px; line-height:1.7;
  vertical-align:1px; text-decoration:none;
  box-shadow:0 2px 6px rgba(15,23,42,.16);
  transition:transform .15s ease, box-shadow .15s ease;
}
.mc-hero-lv:hover,
.mc-hero-lv:focus{
  color:var(--mc-accent); text-decoration:none;
  transform:translateY(-1px); box-shadow:0 4px 10px rgba(15,23,42,.22);
}
.mc-hero-lv-name{ font-weight:700; color:#312e81; letter-spacing:.2px; }
.mc-hero-lv-act{
  display:inline-flex; align-items:center; gap:2px;
  margin-left:7px; padding:0 6px 0 7px;
  border-left:1px solid #e2e8f0; font-weight:700;
}
.mc-hero-lv .mc-ico{ width:11px; height:11px; stroke-width:2.4; }
.mc-hero-body{ flex:1 1 220px; min-width:220px; position:relative; z-index:1; }
.mc-bal-label{ font-size:12.5px; opacity:.85; }
.mc-bal-value{ font-size:34px; font-weight:800; line-height:1.1; letter-spacing:.5px; }
.mc-bal-value small{ font-size:15px; font-weight:600; opacity:.85; margin-left:2px; }
.mc-bal-actions{ margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }
.mc-bal-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:2px; }
.mc-bal-row .mc-bal-actions{ margin-top:0; }
.mc-hero-stat{
  position:relative; z-index:1; text-align:left;
  padding-left:14px; border-left:1px solid rgba(255,255,255,.25);
}
.mc-hero-stat .v{ font-size:22px; font-weight:800; }
.mc-hero-stat .l{ font-size:12.5px; opacity:.85; margin-top:2px; }
.mc-hero-stat--lead{ border-left:none; padding-left:0; }
.mc-hero-stat .v small{ font-size:15px; font-weight:600; opacity:.85; margin-left:2px; }
/* Hero 退出登录（Hero 最右侧，普通 flex 子项，与今日收益不再拥挤） */
.mc-hero-logout{
  display:inline-flex; align-items:center; gap:5px;
  position:relative; z-index:1;
  padding:5px 12px; border-radius:999px;
  font-size:12.5px; font-weight:600; line-height:1.4;
  color:#fff !important; text-decoration:none !important;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.34);
  transition:background .15s ease;
}
.mc-hero-logout:hover{ background:rgba(255,255,255,.30); }
.mc-hero-logout .mc-ico{ width:14px; height:14px; }

/* 通用按钮 */
.mc-btn{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 18px; border-radius:999px; font-weight:600; font-size:13.5px;
  text-decoration:none !important; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.mc-btn:active{ transform:translateY(1px); }
.mc-btn-solid{ background:#fff; color:var(--mc-accent) !important; }
.mc-btn-solid:hover{ box-shadow:0 8px 20px rgba(0,0,0,.16); }
.mc-btn-ghost{ background:rgba(255,255,255,.16); color:#fff !important; border:1px solid rgba(255,255,255,.4); }
.mc-btn-ghost:hover{ background:rgba(255,255,255,.28); }

/* 区块标题 */
.mc-section-title{
  font-size:15px; font-weight:700; color:var(--mc-text);
  margin:4px 2px 12px; display:flex; align-items:center; gap:8px;
}
.mc-section-title > i{ color:var(--mc-accent); }

/* 快捷操作磁贴 */
.mc-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:14px;
  margin-bottom:22px;
}
.mc-tile{
  position:relative;
  display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  background:var(--mc-card);
  border:1px solid var(--mc-border);
  border-radius:var(--mc-radius);
  padding:18px 18px;
  text-decoration:none !important;
  color:var(--mc-text) !important;
  box-shadow:var(--mc-shadow);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.mc-tile:hover{ transform:translateY(-3px); box-shadow:var(--mc-shadow-hover); border-color:rgba(79,70,229,.3); }
.mc-tile-ico{
  position:relative;
  width:42px;height:42px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:var(--mc-accent-soft); color:var(--mc-accent); font-size:19px;
}
.mc-tile-label{ font-size:14px; font-weight:600; }
.mc-tile-sub{ font-size:11.5px; color:var(--mc-muted); margin-top:-6px; }

/* 双列信息区 */
.mc-cols{ display:grid; grid-template-columns:1.1fr 1fr; gap:22px; align-items:start; }
@media (max-width:992px){ .mc-cols{ grid-template-columns:1fr; } }
.mc-card{
  background:var(--mc-card);
  border:1px solid var(--mc-border);
  border-radius:var(--mc-radius);
  box-shadow:var(--mc-shadow);
  overflow:hidden;
}
.mc-card-head{
  padding:16px 20px; font-weight:700; font-size:15px; color:var(--mc-text);
  border-bottom:1px solid var(--mc-border);
  display:flex; align-items:center; gap:8px;
}
.mc-card-head > i{ color:var(--mc-accent); }
.mc-card-body{ padding:14px 20px 18px; }

.mc-info-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 0; border-bottom:1px dashed var(--mc-border);
}
.mc-info-row:last-child{ border-bottom:none; }
.mc-info-k{ color:var(--mc-muted); font-size:13px; white-space:nowrap; }
.mc-info-v{ color:var(--mc-text); font-weight:600; font-size:13.5px; text-align:right; word-break:break-all; }
.mc-info-v a{ color:var(--mc-accent); }
.mc-tag{ display:inline-block; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:600; }
.mc-tag-pro{ background:#fef3c7; color:#b45309; }
.mc-tag-basic{ background:#e0f2fe; color:#0369a1; }

.mc-cta{
  display:flex; flex-direction:column; align-items:center; gap:14px;
  padding:26px 20px; text-align:center;
}
.mc-cta p{ color:var(--mc-muted); margin:0; }
.mc-cta .btn-primary{
  background:var(--mc-grad) !important; border:none !important; border-radius:999px !important;
  padding:8px 22px !important; font-weight:600 !important;
}
.mc-empty-notice{ padding:26px 20px; text-align:center; color:var(--mc-muted); }

/* 公告正文 */
.mc-gg{ font-size:13.5px; line-height:1.7; color:#334155; }
.mc-gg img{ max-width:100%; }

/* 未读红点(JS 给 #message_count/#work_count 加 span_position) */
.mc-dotwrap{ position:relative; }
.span_position{
  display:inline-block; background:#ef4444; border-radius:50%;
  width:9px; height:9px; position:absolute; top:-2px; right:-10px;
  box-shadow:0 0 0 2px #fff;
}

/* 旧内联样式沿用 */
img.logo{ width:14px; height:auto; margin:0 5px 0 3px; }
.nickname{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:120px; }

/* 移动端微调：整页元素收小一档，桌面端样式保持不变 */
@media (max-width:768px){
  .mc-page{ padding:10px 8px !important; }
  .mc-hero{ padding:16px; gap:12px; border-radius:16px; margin-bottom:16px; }
  .mc-avatar{ width:50px; height:50px; border-width:2px; }
  .mc-hero-id{ gap:11px; }
  .mc-hero-name{ font-size:16.5px; }
  .mc-hero-sub{ font-size:11.5px; margin-top:3px; }
  .mc-hero-lv{ margin-left:4px; padding:0 2px 0 8px; font-size:10.5px; }
  .mc-hero-lv-act{ margin-left:5px; padding:0 5px 0 6px; }
  .mc-bal-label{ font-size:11.5px; }
  .mc-bal-value{ font-size:28px; }
  .mc-bal-value small{ font-size:13px; }
  /* 手机端：充值/提现按钮与金额同行靠右，去掉图标以留出横向空间 */
  .mc-bal-row{ gap:8px; flex-wrap:nowrap; }
  .mc-bal-actions{ gap:6px; margin-top:0; margin-left:auto; flex-wrap:nowrap; }
  .mc-btn{ padding:7px 14px; font-size:12.5px; gap:5px; }
  .mc-btn .mc-ico{ width:14px; height:14px; }
  .mc-bal-actions .mc-btn{ padding:6px 11px; font-size:12px; white-space:nowrap; }
  .mc-bal-actions .mc-btn .mc-ico{ display:none; }
  .mc-hero-stat{ text-align:left; padding-left:0; border-left:none; min-width:auto; }
  .mc-hero-stat .v{ font-size:18px; white-space:nowrap; }
  .mc-hero-stat .l{ font-size:11.5px; white-space:nowrap; }
  /* 手机端：退出登录移到 Hero 右上角(UID 行最右)，脱离换行流 */
  .mc-hero-logout{ position:absolute; top:14px; right:14px; z-index:2; padding:4px 10px; font-size:11.5px; gap:4px; }
  .mc-hero-logout .mc-ico{ width:13px; height:13px; }
  .mc-section-title{ font-size:14px; margin:2px 2px 10px; gap:6px; }
  .mc-section-title .mc-ico{ width:16px; height:16px; }
  .mc-grid{ grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:8px; margin-bottom:16px; }
  .mc-tile{ padding:13px; gap:8px; border-radius:14px; }
  .mc-tile-ico{ width:36px; height:36px; border-radius:10px; font-size:17px; }
  .mc-tile-ico .mc-ico{ width:19px; height:19px; }
  .mc-tile-label{ font-size:13px; }
}

/* ============================================================
   全局组件层 —— 让所有会员中心内页(工单/订单/收支/消息/下单/设置…)
   的通用 Color Admin 组件一次性现代化。作用域限定 #content，
   不影响外壳(header/aside)与首页 mc- 卡片。
   ============================================================ */
#content .wrapper{ padding:22px 10px; }
#content .wrapper > [class*="col-"]{ padding-left:0; padding-right:0; }
#content .row{ margin-left:-11px; margin-right:-11px; }
#content .col-md-12.center-block{ float:none !important; }
/* 会员内页里的"窄列居中"容器(分类/签到/续费/域名/工单等 col-md-8/10、col-lg-6/8 + center-block)
   统一满铺，消除大屏两侧大片灰边；仅作用 wrapper 直接子列，不影响 .row 内多列网格与登录/注册独立页。 */
#content .wrapper > [class*="col-"].center-block{ width:100% !important; max-width:100%; float:none; }

/* 分站管理 Tab 导航条（uset site/tplset/logo/link + rank/classlist/shoplist/sitelist/userlist 复用） */
.fz-tabs{
  display:flex; flex-wrap:wrap; gap:8px;
  margin:0 0 18px; padding:0;
}
.fz-tabs .fz-tab{
  display:inline-flex; align-items:center;
  padding:8px 16px; border-radius:999px;
  background:var(--mc-card);
  border:1px solid var(--mc-border);
  color:var(--mc-muted);
  font-size:14px; font-weight:500; line-height:1;
  text-decoration:none; white-space:nowrap;
  box-shadow:var(--mc-shadow);
  transition:background .18s ease, color .18s ease, box-shadow .18s ease;
}
.fz-tabs .fz-tab:hover{ color:var(--mc-accent); background:var(--mc-accent-soft); border-color:transparent; }
.fz-tabs .fz-tab.on{
  color:#fff !important;
  background:var(--mc-accent);
  border-color:transparent;
  box-shadow:0 6px 18px rgba(79,70,229,.28);
}
@media (max-width:768px){
  .fz-tabs{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .fz-tabs::-webkit-scrollbar{ display:none; }
}

/* 分站管理列表页顶部统计 + 内联搜索条（userlist/sitelist 复用） */
.fz-listbar{
  display:flex; align-items:center; gap:14px;
  padding:14px 20px;
  border-bottom:1px solid var(--mc-border);
}
.fz-listbar-text{ color:var(--mc-muted); font-size:13.5px; white-space:nowrap; }
.fz-listbar-text b{ color:var(--mc-text); font-size:16px; margin:0 4px; }
.fz-listbar-actions{ margin-left:auto; display:flex; align-items:center; gap:8px; min-width:0; }
.fz-listbar-search{ display:flex; align-items:center; gap:8px; min-width:0; margin:0; }
.fz-listbar-search .form-control{ width:220px; }
.fz-listbar-search .btn{ white-space:nowrap; }
@media (max-width:768px){
  .fz-listbar{ padding:12px 14px; gap:8px; }
  .fz-listbar-text{ font-size:12.5px; }
  .fz-listbar-actions{ flex:1; min-width:0; justify-content:flex-end; }
  .fz-listbar-search{ flex:1; min-width:0; }
  .fz-listbar-search .form-control{ width:auto; flex:1; min-width:48px; }
}
@media (max-width:480px){
  .fz-listbar-text .fz-word{ display:none; }
  .fz-listbar-search .btn{ padding:7px 10px; }
}

/* 面板 */
#content .panel{
  background:var(--mc-card);
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-radius) !important;
  box-shadow:var(--mc-shadow) !important;
  margin-bottom:22px;
  overflow:hidden;
}
#content .panel.panel-default,
#content .panel.panel-info,
#content .panel.panel-success,
#content .panel.panel-warning,
#content .panel.panel-danger,
#content .panel.panel-primary{ border-color:var(--mc-border) !important; }
#content .panel-heading{
  background:#fff !important;
  border-bottom:1px solid var(--mc-border) !important;
  color:var(--mc-text) !important;
  padding:14px 20px;
}
#content .panel-title,
#content .panel-heading .panel-title{ color:var(--mc-text) !important; font-weight:700; font-size:15px; }
#content .panel-heading i{ color:var(--mc-accent); }
#content .panel-heading .pull-right a{ color:var(--mc-muted); }
#content .panel-heading .pull-right a:hover{ color:var(--mc-accent); }
#content .panel-body{ padding:16px 20px; color:#334155; }
#content .panel-footer{
  background:#f8fafc !important;
  border-top:1px solid var(--mc-border) !important;
  color:var(--mc-muted);
  padding:12px 20px;
}

/* 表格 */
#content .table{ margin-bottom:0; }
#content .table>thead>tr>th{
  background:#f8fafc !important;
  color:var(--mc-muted) !important;
  font-weight:600; font-size:13px;
  border-bottom:1px solid var(--mc-border) !important;
  border-top:none !important;
  padding:12px 14px;
}
#content .table>tbody>tr>td{
  border-color:var(--mc-border) !important;
  padding:11px 14px; color:#334155; vertical-align:middle;
}
#content .table-bordered{ border:1px solid var(--mc-border) !important; }
#content .table-bordered>tbody>tr>td,
#content .table-bordered>thead>tr>th{ border-color:var(--mc-border) !important; }
#content .table-striped>tbody>tr:nth-of-type(odd){ background:#fbfcfe; }
#content .table-hover>tbody>tr:hover{ background:var(--mc-accent-soft) !important; }
#content .table>tbody>tr.info>td,
#content .table>tbody>tr>td.info{ background:#e0f2fe !important; }

/* 按钮 */
#content .btn{
  border-radius:10px !important; font-weight:600; padding:7px 15px;
  border:1px solid transparent; transition:background .15s ease, box-shadow .15s ease, transform .1s ease;
}
#content .btn:active{ transform:translateY(1px); }
#content .btn-xs{ padding:3px 10px; font-size:12px; border-radius:8px !important; }
#content .btn-sm{ padding:5px 12px; }
#content .btn-primary{ background:var(--mc-accent) !important; border-color:var(--mc-accent) !important; color:#fff !important; }
#content .btn-primary:hover,#content .btn-primary:focus{ background:var(--mc-accent-2) !important; border-color:var(--mc-accent-2) !important; }
#content .btn-info{ background:#0ea5e9 !important; border-color:#0ea5e9 !important; color:#fff !important; }
#content .btn-info:hover{ background:#0284c7 !important; }
#content .btn-success{ background:#10b981 !important; border-color:#10b981 !important; color:#fff !important; }
#content .btn-success:hover{ background:#059669 !important; }
#content .btn-warning{ background:#f59e0b !important; border-color:#f59e0b !important; color:#fff !important; }
#content .btn-warning:hover{ background:#d97706 !important; }
#content .btn-danger{ background:#ef4444 !important; border-color:#ef4444 !important; color:#fff !important; }
#content .btn-danger:hover{ background:#dc2626 !important; }
#content .btn-default{ background:#fff !important; border-color:var(--mc-border) !important; color:#475569 !important; }
#content .btn-default:hover{ border-color:var(--mc-accent) !important; color:var(--mc-accent) !important; }

/* 表单 */
#content .form-control{
  border:1px solid var(--mc-border) !important; border-radius:10px !important;
  box-shadow:none !important; padding:8px 12px; color:var(--mc-text); height:auto;
}
#content .form-control:focus{
  border-color:var(--mc-accent) !important;
  box-shadow:0 0 0 3px var(--mc-accent-soft) !important;
}
#content textarea.form-control{ min-height:90px; }
#content .input-group-addon{
  background:#f8fafc !important; border:1px solid var(--mc-border) !important;
  color:var(--mc-muted); font-weight:600; border-radius:10px 0 0 10px !important;
}
#content .input-group .form-control:first-child{ border-radius:0; }
#content label{ color:#475569; font-weight:600; }

/* 分页 */
#content .pagination{ border-radius:10px; }
#content .pagination>li>a,
#content .pagination>li>span{
  border:1px solid var(--mc-border) !important; color:var(--mc-muted);
  background:#fff; margin-left:-1px; padding:6px 12px;
}
#content .pagination>li:first-child>a,
#content .pagination>li:first-child>span{ border-radius:10px 0 0 10px; }
#content .pagination>li:last-child>a,
#content .pagination>li:last-child>span{ border-radius:0 10px 10px 0; }
#content .pagination>li>a:hover{ background:var(--mc-accent-soft) !important; color:var(--mc-accent) !important; border-color:var(--mc-accent) !important; }
#content .pagination>li.active>a,
#content .pagination>li.active>span{ background:var(--mc-accent) !important; border-color:var(--mc-accent) !important; color:#fff !important; }
#content .pagination>li.disabled>a,
#content .pagination>li.disabled>span{ color:#cbd5e1 !important; background:#fff !important; }

/* 标签/徽章 */
#content .label{ border-radius:999px; font-weight:600; padding:3px 9px; font-size:11.5px; }
#content .label-primary{ background:var(--mc-accent) !important; }
#content .label-success{ background:#10b981 !important; }
#content .label-warning{ background:#f59e0b !important; }
#content .label-danger{ background:#ef4444 !important; }

/* 提示消息(showmsg/sysmsg 常用) */
#content .alert{ border:none !important; border-radius:14px; box-shadow:var(--mc-shadow); }
#content .alert-success{ background:#ecfdf5 !important; color:#047857 !important; }
#content .alert-info{ background:#eff6ff !important; color:#1d4ed8 !important; }
#content .alert-warning{ background:#fffbeb !important; color:#b45309 !important; }
#content .alert-danger{ background:#fef2f2 !important; color:#b91c1c !important; }

/* 工单沟通记录(自定义 gdan_*)轻度现代化 */
#content .gdan_txt{ color:var(--mc-text); border-bottom:1px solid var(--mc-border); }
#content .gdan_huifu1{ background-color:var(--mc-accent) !important; border-radius:10px; }
#content .gdan_srk{ border:1px solid var(--mc-border) !important; border-radius:12px; padding:10px 12px; }

/* ============================================================
   右上角头像下拉菜单 —— 悬停高亮 + 右侧图标
   ============================================================ */
#header .navbar-right .dropdown-menu{
  border:1px solid var(--mc-border); border-radius:12px; padding:6px;
  box-shadow:0 12px 32px rgba(31,41,55,.14);
}
#header .navbar-right .dropdown-menu > li > a{
  display:flex; align-items:center; justify-content:space-between;
  padding:9px 14px; border-radius:9px; color:var(--mc-text); font-size:14px;
  transition:background .15s ease, color .15s ease;
}
#header .navbar-right .dropdown-menu > li > a > i{
  margin-left:16px; color:var(--mc-muted); transition:color .15s ease;
}
#header .navbar-right .dropdown-menu > li > a:hover,
#header .navbar-right .dropdown-menu > li > a:focus{
  background:var(--mc-accent-soft) !important; color:var(--mc-accent) !important;
}
#header .navbar-right .dropdown-menu > li > a:hover > i,
#header .navbar-right .dropdown-menu > li > a:focus > i{ color:var(--mc-accent) !important; }
#header .navbar-right .dropdown-menu > .divider{ margin:5px 6px; background:var(--mc-border); }

/* ============================================================
   内页移动端留白收紧（仅 ≤768px 生效）
   对齐「会员中心首页 .mc-page(16px/12px)」与「个人资料页(内页 wrapper 收到 10~12px、
   满宽列内边距清零)」的紧凑节奏；放在全局组件层(#content .wrapper padding:22px 等)之后，
   靠源码顺序覆盖桌面间距。工单/开通分站/消息/订单/设置/充值/提现…一次全部生效。
   ============================================================ */
@media (max-width:768px){
  /* 外层：22px → 上下 16 / 左右 12（与首页一致） */
  #content .wrapper{ padding:10px 8px; }
  /* 行：取消负边距，避免下面清零满宽列内边距时溢出到 wrapper 之外造成横向滚动 */
  #content .row{ margin-left:0; margin-right:0; }
  /* 只把「满宽列」(col-*-12)的左右栅格内边距清零，让侧留白由 wrapper 的 12px 统一控制；
     非满宽列(col-*-6/4/8 等)保持原样，多列并排仍有间距，不会贴在一起 */
  #content [class*="col-"].col-xs-12,
  #content [class*="col-"].col-sm-12,
  #content [class*="col-"].col-md-12,
  #content [class*="col-"].col-lg-12{ padding-left:0; padding-right:0; }
  /* 卡片/面板纵向间距与内边距整体收紧一档 */
  #content .panel{ margin-bottom:10px; }
  #content .panel-heading{ padding:10px 12px; }
  #content .panel-body{ padding:10px 12px; }
  #content .panel-footer{ padding:10px 12px; }
  /* 表格页(订单/用户/商品等)左右单元内边距收窄，减少空档 */
  #content .table>thead>tr>th,
  #content .table>tbody>tr>td{ padding-left:10px; padding-right:10px; }
}

/* ============================================================
   移动端底部固定 Tab 栏（仅 ≤768px 显示）
   桌面隐藏；手机端固定在屏幕底部，5 等分：首页/下单/订单/工单(or消息)/我的。
   由 user/head.php 输出 <nav class="mc-tabbar"> 标记，active 态用 .mc-tab.on。
   同时给 body 预留底部空间(含 iPhone 安全区)，避免内容被 Tab 栏遮挡。
   ============================================================ */
.mc-tabbar{ display:none; }
@media (max-width:768px){
  .mc-tabbar{
    position:fixed; left:0; right:0; bottom:0; z-index:1050;
    display:flex; align-items:stretch; height:52px;
    padding-bottom:env(safe-area-inset-bottom,0px);
    background:#fff; border-top:1px solid var(--mc-border);
    box-shadow:0 -2px 12px rgba(31,41,66,.06);
  }
  .mc-tabbar .mc-tab{
    flex:1 1 0; min-width:0;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    color:var(--mc-muted); font-size:11px; line-height:1.25; text-decoration:none;
    -webkit-tap-highlight-color:transparent;
  }
  .mc-tabbar .mc-tab .mc-ico{ width:20px; height:20px; margin-bottom:3px; }
  .mc-tabbar .mc-tab i{ font-size:18px; margin-bottom:3px; }
  .mc-tabbar .mc-tab.on{ color:var(--mc-accent); }
  .mc-tabbar .mc-tab:hover,
  .mc-tabbar .mc-tab:focus{ color:var(--mc-accent); text-decoration:none; }
  body{ padding-bottom:calc(52px + env(safe-area-inset-bottom,0px)); }
  /* app.css 把 body 高度固定为 100%，内容超出一屏时 body 上的 padding 不会出现在滚动末尾，
     底部留白必须加在内容容器上，最后一屏(如站点公告)才能完整滚出 Tab 栏。 */
  #content .app-content-body{ padding-bottom:calc(62px + env(safe-area-inset-bottom,0px)); }
}

/* ============================================================
   会员中心现代图标 .mc-ico（内联 SVG，描边=currentColor）
   替代原 Font Awesome 4 老字形；stroke 属性写在 <svg> 上，这里只管尺寸/颜色/对齐。
   ============================================================ */
.mc-ico{ display:inline-block; vertical-align:middle; width:1em; height:1em; flex:0 0 auto; }
.mc-btn .mc-ico{ width:15px; height:15px; margin-right:2px; }
.mc-section-title .mc-ico{ width:18px; height:18px; color:var(--mc-accent); }
.mc-card-head .mc-ico{ width:16px; height:16px; color:var(--mc-accent); }
.mc-tile-ico .mc-ico{ width:22px; height:22px; }

/* ============================================================
   订单详情弹窗（卡片式）· .odm-*
   会员中心订单查询(user/list.php) 与 自助下单(user/shop.php+usershop.js) 共用
   ============================================================ */
.odm{padding:14px 16px 16px;background:#f5f6fa;}
.odm-hero{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:linear-gradient(135deg,#5b6abf,#7b6fd0);border-radius:12px;color:#fff;margin-bottom:12px;}
.odm-goods{font-size:16px;font-weight:600;line-height:1.45;word-break:break-all;}
.odm-badge{flex:0 0 auto;background:#fff;padding:4px 12px;border-radius:14px;font-size:12px;font-weight:600;white-space:nowrap;}
.odm-badge-proc{color:#2f7ed8;}
.odm-badge-done{color:#28a745;}
.odm-badge-run{color:#e8a33d;}
.odm-badge-err,.odm-badge-refund{color:#e0554f;}
.odm-badge-revoke{color:#17a2b8;}
.odm-badge-unknown{color:#909399;}
.odm-card{background:#fff;border-radius:12px;padding:2px 16px 12px;margin-bottom:12px;box-shadow:0 1px 3px rgba(0,0,0,.05);}
.odm-card-hd{font-size:13px;font-weight:600;color:#5b6abf;padding:13px 0 9px;margin-bottom:2px;border-bottom:1px solid #eef0f6;}
.odm-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;font-size:13px;border-bottom:1px dashed #f0f2f5;}
.odm-row:last-child{border-bottom:0;}
.odm-k{color:#8a94a6;flex:0 0 auto;}
.odm-v{color:#2c3345;text-align:right;word-break:break-all;}
.odm-money{color:#e6a23c;font-weight:600;}
.odm-nums{display:flex;gap:12px;padding:14px 0 4px;}
.odm-num{flex:1;background:#f7f8fc;border-radius:10px;padding:12px;text-align:center;}
.odm-num b{display:block;font-size:12px;color:#8a94a6;font-weight:400;margin-bottom:6px;}
.odm-num i{display:block;font-size:22px;font-weight:700;color:#5b6abf;font-style:normal;}
.odm-body{padding:11px 0 2px;font-size:13px;color:#2c3345;line-height:1.75;word-break:break-all;}
.odm-body img{max-width:100%;}
.odm-desc{color:#6b7280;}
.odm-actions{display:flex;gap:10px;}
.odm-btn{flex:1;text-align:center;font-size:13px;padding:10px 0;border-radius:8px;text-decoration:none;transition:opacity .15s;}
.odm-btn:hover{opacity:.85;text-decoration:none;}
.odm-btn-complain{background:#eef0f6;color:#5b6abf;}
.odm-btn-refund{background:#e6544f;color:#fff;}
.odm-params{padding-top:2px;}
.odm-param{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed #f0f2f5;}
.odm-param:last-child{border-bottom:0;}
.odm-param-k{flex:0 0 auto;max-width:38%;color:#8a94a6;font-size:13px;word-break:break-all;-webkit-user-select:none;-moz-user-select:none;user-select:none;}
.odm-param-v{flex:1 1 auto;min-width:0;color:#2c3345;font-size:13px;line-height:1.5;background:#eef1fb;border-radius:6px;padding:5px 9px;text-align:right;word-break:break-all;-webkit-user-select:all;-moz-user-select:all;user-select:all;}
.odm-copy{flex:0 0 auto;border:1px solid #dfe3ec;background:#fff;color:#5b6abf;font-size:12px;line-height:1;padding:5px 9px;border-radius:6px;cursor:pointer;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:all .15s;}
.odm-copy:hover{background:#eef0f6;border-color:#c7cdf0;}
.odm-copy.odm-copy-ok{color:#28a745;border-color:#b7e4c1;background:#f0fbf3;}

/* 手机端隐藏顶部「会员控制台」导航条，并收回其预留的 50px 顶距让内容贴顶；电脑端保持原样 */
@media (max-width: 767px){
  #header.app-header{ display: none !important; }
  .app.app-header-fixed{ padding-top: 0 !important; }
}

/* ---------- 会员等级升级弹窗 ---------- */
#mcLevelModal .modal-dialog,
#mcLevelPayModal .modal-dialog{ width:400px; max-width:calc(100vw - 24px); margin:64px auto 24px; }
#mcLevelModal .modal-content,
#mcLevelPayModal .modal-content{
  border:0; border-radius:18px; overflow:hidden;
  box-shadow:0 24px 64px rgba(15,23,42,.28);
}
/* 支付弹窗叠加在升级弹窗之上：支付层与新遮罩都要压住下层弹窗 */
#mcLevelPayModal{ z-index:1060; }
.modal-backdrop.mc-pay-backdrop{ z-index:1055; }
.mc-lv-modal{ padding:22px 20px 18px; background:var(--mc-card); }
.mc-lv-head{ margin-bottom:14px; }
.mc-lv-title{ font-size:17px; font-weight:800; color:var(--mc-text); letter-spacing:.2px; }
.mc-lv-meta{ margin-top:6px; font-size:12.5px; color:var(--mc-muted); }
.mc-lv-meta b{ color:var(--mc-accent); font-weight:800; }
.mc-lv-sep{ display:inline-block; width:1px; height:10px; background:rgba(15,23,42,.12); margin:0 8px; vertical-align:-1px; }
.mc-lv-prog{ margin:0 0 14px; }
.mc-lv-prog-track{ display:flex; align-items:center; gap:8px; }
.mc-lv-prog-cur,.mc-lv-prog-next{ flex:none; max-width:96px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px; line-height:1.4; }
.mc-lv-prog-cur{ color:var(--mc-muted); }
.mc-lv-prog-next{ color:var(--mc-accent); font-weight:700; }
.mc-lv-prog-bar{ flex:1 1 auto; min-width:0; height:6px; border-radius:999px; background:#e6ebf4; overflow:hidden; }
.mc-lv-prog-bar i{ display:block; height:100%; border-radius:999px; background:var(--mc-grad); transition:width .3s ease; }
.mc-lv-prog-txt{ margin-top:8px; font-size:12.5px; line-height:1.55; color:var(--mc-muted); }
.mc-lv-prog-txt b{ color:var(--mc-accent); font-weight:800; }
.mc-lv-prog-note{ margin-top:4px; font-size:11px; line-height:1.6; color:#94a3b8; }
.mc-lv-sec-title{ margin:2px 0 10px; text-align:center; font-size:13px; font-weight:700; color:var(--mc-text); letter-spacing:.2px; }
.mc-lv-list{ display:flex; flex-direction:column; gap:8px; max-height:360px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.mc-lv-card{ display:block; position:relative; margin:0; cursor:pointer; }
.mc-lv-card input{ position:absolute; opacity:0; pointer-events:none; }
.mc-lv-card.is-locked{ cursor:not-allowed; }
.mc-lv-card.is-locked .mc-lv-in{ background:#f7f8fb; border-color:var(--mc-border); box-shadow:none; }
.mc-lv-card.is-locked .mc-lv-name{ color:#94a3b8; }
.mc-lv-card.is-locked .mc-lv-desc{ color:#b6bfcc; }
.mc-lv-card.is-locked .mc-lv-check{ border-color:#e2e8f0; background:#f1f5f9; }
.mc-lv-in{
  display:flex; align-items:center; gap:10px; padding:10px 12px;
  border:1.5px solid var(--mc-border); border-radius:12px; background:#fff;
  transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.mc-lv-card input:checked + .mc-lv-in{
  border-color:var(--mc-accent); background:var(--mc-accent-soft);
  box-shadow:0 0 0 3px rgba(79,70,229,.08);
}
.mc-lv-main{ flex:1 1 auto; min-width:0; }
.mc-lv-name{ display:block; font-size:13.5px; font-weight:700; color:var(--mc-text); }
.mc-lv-desc{ display:block; margin-top:2px; font-size:11.5px; color:var(--mc-muted); line-height:1.5; }
.mc-lv-price{ margin-left:auto; font-size:14px; font-weight:800; color:var(--mc-accent); white-space:nowrap; }
.mc-lv-tag{ margin-left:auto; flex:0 0 auto; padding:2px 7px; border-radius:6px; background:#f1f5f9; color:#94a3b8; font-size:11px; font-weight:600; white-space:nowrap; }
.mc-lv-check{
  flex:0 0 auto; width:17px; height:17px; border-radius:50%;
  border:1.5px solid #cbd5e1; position:relative; background:#fff;
  transition:border-color .15s ease, background-color .15s ease;
}
.mc-lv-card input:checked + .mc-lv-in .mc-lv-check{ border-color:var(--mc-accent); background:var(--mc-accent); }
.mc-lv-card input:checked + .mc-lv-in .mc-lv-check::after{
  content:""; position:absolute; left:5px; top:2px; width:4px; height:8px;
  border:solid #fff; border-width:0 1.8px 1.8px 0; transform:rotate(45deg);
}
.mc-lv-tip{ margin-top:11px; font-size:11.5px; color:var(--mc-muted); line-height:1.6; }
.mc-lv-err{
  display:none; margin-top:10px; padding:8px 10px; border-radius:9px;
  background:#fef2f2; color:#b91c1c; font-size:12px; line-height:1.5;
}
.mc-lv-foot{ display:flex; gap:10px; margin-top:16px; }
.mc-lv-btn{
  flex:1; height:38px; border:0; border-radius:11px;
  font-size:13.5px; font-weight:700; cursor:pointer;
  transition:opacity .15s ease, transform .15s ease;
}
.mc-lv-btn.ghost{ background:#f1f5f9; color:#475569; }
.mc-lv-btn.primary{ background:var(--mc-grad); color:#fff; box-shadow:0 6px 16px rgba(91,108,255,.28); }
.mc-lv-btn.primary:hover{ opacity:.92; }
.mc-lv-btn:disabled{ opacity:.55; cursor:not-allowed; }
.mc-lv-empty{ padding:26px 10px; text-align:center; color:var(--mc-muted); font-size:13px; }
.mc-lv-empty b{ display:block; color:var(--mc-text); font-size:14px; margin-bottom:6px; }
.mc-pay-label{ margin:2px 0 8px; font-size:12px; color:var(--mc-muted); }
.mc-pay-method{
  display:flex; align-items:center; gap:10px; position:relative; margin:0; padding:12px;
  border:1.5px solid var(--mc-accent); border-radius:12px; background:var(--mc-accent-soft); cursor:pointer;
}
.mc-pay-method input{ position:absolute; opacity:0; pointer-events:none; }
.mc-pay-ico{
  flex:0 0 auto; width:34px; height:34px; border-radius:10px; background:#fff;
  color:var(--mc-accent); display:flex; align-items:center; justify-content:center;
}
.mc-pay-ico svg{ width:19px; height:19px; }
.mc-pay-main{ flex:1 1 auto; min-width:0; }
.mc-pay-name{ display:block; font-size:13.5px; font-weight:700; color:var(--mc-text); }
.mc-pay-sub{ display:block; margin-top:2px; font-size:11.5px; color:var(--mc-muted); }
.mc-pay-method .mc-lv-check{ border-color:var(--mc-accent); background:var(--mc-accent); }
.mc-pay-method .mc-lv-check::after{
  content:""; position:absolute; left:5px; top:2px; width:4px; height:8px;
  border:solid #fff; border-width:0 1.8px 1.8px 0; transform:rotate(45deg);
}
.mc-pay-warn{
  display:none; margin-top:10px; padding:8px 10px; border-radius:9px;
  background:#fff7ed; color:#c2410c; font-size:12px; line-height:1.6;
}
.mc-pay-warn b{ font-weight:800; }
.mc-pay-warn a{ color:var(--mc-accent); font-weight:700; text-decoration:none; }
.mc-pay-warn a:hover{ text-decoration:underline; }