/* Sidebar shape remains rounded regardless of the optional dashboard card radius. */
#sidebar-menu #side-menu{padding:8px 8px 20px!important}
#sidebar-menu #side-menu li>a{border-radius:5px!important;margin:3px 0!important;width:auto!important;border-left:0!important}
#sidebar-menu #side-menu>li>a{padding:11px 12px!important}
#sidebar-menu #side-menu li>a:before{border-left:0!important}
.mdy-dashboard{display:grid;grid-template-columns:minmax(0,2.05fr) minmax(290px,1fr);gap:22px;align-items:start;color:#344054;font-size:13px;line-height:1.6;padding:0 0 24px}
.mdy-dashboard-main,.mdy-dashboard-aside{display:grid;gap:22px;min-width:0}
.mdy-dashboard .mdy-panel{min-width:0;background:#fff;border:1px solid #f0f2f5;border-radius:var(--mdy-card-radius,2px)!important;padding:18px;box-shadow:0 1px 2px rgba(25,40,70,.025);overflow:hidden}
.mdy-dashboard h2{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px;font-size:14px;font-weight:600;line-height:1.2;color:#253449;border-left:3px solid var(--theme-color-3);padding-left:7px}
.mdy-dashboard a{text-decoration:none}
.mdy-dashboard .mdy-more{font-size:11px;font-weight:400;color:#8792a2;white-space:nowrap}
.mdy-dashboard a:hover,.mdy-dashboard .mdy-more:hover{color:var(--theme-color-3)}
.mdy-caption{display:block;margin:12px 0 8px;font-size:11px;color:#939dab}
.mdy-quick-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.mdy-quick-links a{border:1px solid #edf0f4;border-radius:3px;padding:6px 9px;font-size:12px;color:#637083;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mdy-recent-chip{display:flex;min-width:0;border:1px solid #edf0f4;border-radius:3px;align-items:center}
.mdy-recent-chip a{flex:1;min-width:0;border:0}
.mdy-recent-chip form{margin:0;flex:none}
.mdy-recent-chip button{border:0;background:transparent;color:#9099a8;padding:6px 8px;cursor:pointer}
.mdy-quick-links a:hover,.mdy-recent-chip:hover a,.mdy-recent-chip button:hover{color:var(--theme-color-3)}
.mdy-recent-chip button:disabled{color:#c9ced6;cursor:not-allowed}
.mdy-nav-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#cad1db;margin-right:7px;vertical-align:middle}
.mdy-quick-editor{margin-top:8px}
.mdy-quick-editor summary{display:inline-block;cursor:pointer;border:1px dashed #dbe1e9;border-radius:3px;padding:6px 14px;min-width:130px;font-size:12px;color:#6b7787}
.mdy-quick-editor summary::marker{content:''}
.mdy-quick-editor[open] summary{color:var(--theme-color-3)}
.mdy-quick-editor form{margin-top:14px;border-top:1px solid #edf0f4;padding-top:4px}
.mdy-navigation-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0 18px}
.mdy-navigation-options label{margin:0;cursor:pointer}.mdy-navigation-options input{accent-color:var(--theme-color-3)}
.mdy-save-notice{font-size:12px;margin:10px 0 0}
.mdy-dashboard .mdy-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:14px}
.mdy-stat{border:1px solid #edf0f4;border-radius:var(--mdy-card-radius,2px);padding:14px 14px 8px;min-width:0}
.mdy-stat>span{font-size:11px;color:#909aa9;display:flex;justify-content:space-between;gap:5px}.mdy-stat i{font-size:16px;color:#bdc6d2}
.mdy-stat>strong{position:relative;display:block;margin-top:12px;font-size:26px;line-height:1.25;color:#233044;font-weight:600}
.mdy-stat>strong:before{content:'';position:absolute;top:-6px;width:21px;height:2px;background:var(--theme-color-3)}
.mdy-stat:nth-child(2)>strong:before{background:#ff9a41}.mdy-stat:nth-child(3)>strong:before{background:#37bd84}.mdy-stat:nth-child(4)>strong:before{background:#f27e8b}
.mdy-stat strong small{font-size:10px;font-weight:400;color:#8590a0;margin-left:5px}
.mdy-stat footer{display:flex;flex-wrap:wrap;gap:10px;border-top:1px solid #f1f3f6;margin-top:8px;padding-top:8px;font-size:10px}.mdy-stat footer a{color:#7c8796}
.mdy-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mdy-products>a{display:flex;align-items:center;gap:9px;border:1px solid #edf0f4;border-radius:3px;padding:10px;color:#647185;font-size:12px;min-width:0}
.mdy-products>a>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mdy-products i,.mdy-help i{color:var(--theme-color-3);font-size:16px}.mdy-products small{margin-left:auto;color:#919bad}
.mdy-dashboard .mdy-account{padding:16px}.mdy-account-head{display:flex;align-items:center;gap:10px;position:relative}
.mdy-account-head .avatar{width:44px;height:44px;flex:0 0 44px;overflow:hidden}.mdy-account-head img{width:100%;height:100%;object-fit:cover}
.mdy-dashboard .mdy-account-head .avatar,.mdy-dashboard .mdy-account-head .avatar img{border-radius:var(--mdy-avatar-radius,50%)!important;background:none!important;border:0!important;box-shadow:none!important;outline:0;padding:0;display:block}
.mdy-account-name{min-width:0;flex:1}.mdy-account-name>strong{font-size:12px;font-weight:500;word-break:break-all}.mdy-account-name>small{font-size:10px;color:#929bab;margin-left:8px}
.mdy-account-name>small{display:inline-block;background:#f3f5f8;padding:2px 5px;border-radius:2px}.mdy-account-name>.mdy-account-group{color:var(--theme-color-3)}
.mdy-account-head>.mdy-more{align-self:flex-start;font-size:10px}.mdy-verification{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.mdy-verification a{font-size:9px;padding:1px 5px;background:#f1f3f6;color:#8490a0;border-radius:2px}.mdy-verification a.is-verified{color:#35ab66;background:#eafbef}
.mdy-account-totals{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #edf0f4;margin-top:16px;padding-top:14px;text-align:center}
.mdy-account-totals strong{display:block;color:#28364a;font-size:16px;font-weight:600}.mdy-account-totals span{font-size:10px;color:#939daa}
.mdy-balance{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.mdy-balance .mdy-caption{margin:0 0 3px}.mdy-balance strong{display:block;font-size:21px;line-height:1.5;color:#263348}
.mdy-dashboard .btn-primary{background:var(--theme-color-3)!important;border-color:var(--theme-color-3)!important;color:white!important}
.mdy-finance-totals{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mdy-finance-totals a{display:block;background:#f6f7fa;padding:10px;border-radius:3px}
.mdy-finance-totals span{display:block;color:#919baa;font-size:10px}.mdy-finance-totals strong{color:#3c495c;font-size:13px;font-weight:500}
.mdy-feed{list-style:none;margin:0;padding:0}.mdy-feed li{display:flex;align-items:center;gap:8px;border-bottom:1px solid #f1f3f6;padding:10px 0;font-size:12px;min-width:0}.mdy-feed li:last-child{border:0}
.mdy-feed li>a{color:#647083;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mdy-feed time{color:#919cac;font-size:10px;white-space:nowrap}
.mdy-feed-tag{background:#f2f4f7;color:#8b95a2;font-size:9px;padding:1px 5px;white-space:nowrap}.mdy-help .mdy-feed-tag{color:var(--theme-color-3);background:color-mix(in srgb,var(--theme-color-3) 7%,white)}
.mdy-empty{color:#929cac;padding:16px 0;margin:0;font-size:12px;grid-column:1/-1}
.mdy-resources .card-title{font-size:14px;margin:0 0 16px!important;border-left:3px solid var(--theme-color-3);padding-left:7px}.mdy-resources .user-center_resources{overflow-x:auto}
.mdy-resources table{min-width:580px;border:0!important;font-size:12px;table-layout:auto}.mdy-resources .table td,.mdy-resources .table th{border:0!important;border-bottom:1px solid #edf0f4!important;padding:10px 12px!important}
.mdy-resources .table th{background:#f2f4f7;color:#556172;font-size:11px;font-weight:600;white-space:nowrap}.mdy-resources .table td{color:#576479}
.page-content .table-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:16px;font-size:11px}.page-content .table-pagination{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}.page-content .table-pagination .pagination{margin:0}
.mdy-resources .page-item.active .page-link{background:var(--theme-color-3);border-color:var(--theme-color-3)}
#sourceListBox .table-footer{display:flex!important}
#sourceListBox.mdy-resources .user-center_resources{height:auto;max-height:none}
.mdy-host-status{padding:2px 6px;background:#fff3e8;color:#c68034;font-size:10px;white-space:nowrap}.mdy-host-status.is-active{background:#eafbef;color:#35ad66}
.footer.mdy-client-footer{height:auto;min-height:45px;padding:14px 20px;background:#fff;text-align:left;font-size:11px;line-height:1.7;color:#939dac;overflow-wrap:anywhere}
.mdy-client-footer .mdy-footer-line{margin:0}.mdy-client-footer span+span:before{content:' | ';white-space:pre;color:#b0b7c2}
/* Readable dashboard scale, without scaling the entire page or changing sidebar colors. */
.mdy-dashboard{font-size:14px}
.mdy-dashboard h2,.mdy-resources .card-title{font-size:16px}
.mdy-dashboard .mdy-panel{padding:22px}
.mdy-dashboard .mdy-caption,.mdy-stat>span,.mdy-stat footer,.mdy-account-totals span,.mdy-finance-totals span{font-size:13px}
.mdy-quick-links a,.mdy-quick-editor summary,.mdy-products>a,.mdy-feed li,.mdy-resources table,.mdy-resources .table th{font-size:14px}
.mdy-dashboard .mdy-more,.mdy-feed time,.page-content .table-footer{font-size:12px}
.mdy-feed li{padding:12px 0}.mdy-feed-tag,.mdy-pin-tag{font-size:11px;max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}
.mdy-pin-tag{color:#e46b77;background:#fff0f2;padding:2px 5px}
.mdy-stat>strong{font-size:30px}.mdy-stat strong small{font-size:12px}.mdy-account-name>strong{font-size:14px}.mdy-account-name>small{font-size:12px}.mdy-verification a{font-size:11px}
.mdy-finance-totals strong{font-size:15px}.mdy-balance strong{font-size:24px}
.mdy-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;height:120px;width:100%;grid-column:1/-1;padding:6px 12px;box-sizing:border-box;color:#969ca6;text-align:center}
.mdy-empty-state img{width:78px;height:78px;object-fit:contain;flex:0 0 auto}.mdy-empty-state p{font-size:13px;margin:0}.mdy-feed li.mdy-feed-empty{display:block;padding:0;border:0}
@media(max-width:1200px){.mdy-dashboard{gap:16px;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr)}.mdy-dashboard-main,.mdy-dashboard-aside{gap:16px}.mdy-quick-links{grid-template-columns:repeat(3,minmax(0,1fr))}.mdy-dashboard .mdy-stats{gap:8px}.mdy-stat{padding:10px 8px}.mdy-products{grid-template-columns:repeat(2,minmax(0,1fr))}.mdy-account-head>.mdy-more{display:none}}
@media(max-width:991px){.mdy-dashboard{grid-template-columns:1fr}.mdy-dashboard-aside{grid-template-columns:repeat(2,minmax(0,1fr))}.mdy-account-head>.mdy-more{display:block}}
@media(max-width:575px){.mdy-dashboard-aside{grid-template-columns:1fr}.mdy-dashboard .mdy-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.mdy-quick-links{grid-template-columns:repeat(2,minmax(0,1fr))}.mdy-navigation-options{grid-template-columns:repeat(2,minmax(0,1fr))}.mdy-dashboard .mdy-panel{padding:14px}.mdy-products{grid-template-columns:1fr}.footer.mdy-client-footer{text-align:center;padding:12px}}
/* 登录/注册/找回密码等页面的页脚：与会员中心页脚同一套排版 */
.mdy-light-footer{padding:14px 20px;background:#fff;text-align:center;font-size:11px;line-height:1.7;color:#939dac;overflow-wrap:anywhere}
.mdy-light-footer .mdy-footer-line{margin:0}
.mdy-light-footer .mdy-footer-line>*+*:before{content:' | ';white-space:pre;color:#b0b7c2}
.mdy-light-footer a{color:#939dac;text-decoration:none}
.mdy-light-footer a:hover{color:#606266}

/* ===== 用户信息卡（融合版：头像 + 账号资料 + 快捷入口） ===== */
.mdy-dashboard .mdy-profile{display:flex;flex-wrap:wrap;align-items:flex-start;gap:18px}
/* 头像：保持原来的大尺寸 64×64，但不再是圆形 —— 圆角取 header 那颗的 1px */
/* 尺寸照参考站用户卡实测：98×98 / 圆角 1px（img 撑满 + cover） */
.mdy-profile-avatar{width:98px;height:98px;flex:0 0 98px;border-radius:4px;overflow:hidden}
.mdy-profile-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.mdy-profile-body{flex:1 1 340px;min-width:0}
.mdy-profile-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mdy-profile-name strong{font-size:16px;color:#253449}
.mdy-badge{font-style:normal;font-size:12px;padding:2px 7px;border-radius:3px;background:#f2f4f7;color:#7b8698}
.mdy-badge.is-ok{background:#eafbef;color:#2fa35f}
.mdy-profile-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 18px;margin:14px 0 0}
.mdy-profile-meta>div{min-width:0}
.mdy-profile-meta dt{font-size:12px;font-weight:400;color:#98a1b0}
.mdy-profile-meta dd{margin:2px 0 0;font-size:13px;color:#3c495c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mdy-profile-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.mdy-bound{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:400;padding:3px 9px;border-radius:3px;background:#f2f4f7;color:#8b95a2;text-decoration:none;cursor:default;user-select:none}
.mdy-bound::before{content:"";flex:0 0 14px;width:14px;height:14px;display:block;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:14px 14px;mask-size:14px 14px}
.mdy-bound--cert::before{-webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/shield-check.svg");mask-image:url("/themes/clientarea/mdy/assets/images/icons/shield-check.svg")}
.mdy-bound--phone::before{-webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/smartphone.svg");mask-image:url("/themes/clientarea/mdy/assets/images/icons/smartphone.svg")}
.mdy-bound--mail::before{-webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/mail.svg");mask-image:url("/themes/clientarea/mdy/assets/images/icons/mail.svg")}
.mdy-bound.is-ok{background:#eafbef;color:#2fa35f}
/* hover 时什么都不变（不改色、不加粗、不加深底色），只是可点 */
.mdy-bound,.mdy-bound:hover,.mdy-bound:focus{text-decoration:none!important;font-weight:400!important}
/* hover 只让文字/图标颜色变深一档（和顶栏「首页」链接同一个写法），底色不动 */
.mdy-bound{transition:color .2s ease}
.mdy-bound:hover,.mdy-bound:focus{color:#5b6577!important}
.mdy-bound.is-ok:hover,.mdy-bound.is-ok:focus{color:#1f8a4d!important}
.mdy-finance-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;margin-top:14px;border-top:1px solid #f1f3f6;padding:14px 0 2px;text-align:center;align-items:center}
.mdy-finance-stats a{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;justify-self:center;width:auto;padding:6px 6px;border-radius:3px}
.mdy-finance-stats strong{display:block;font-size:20px;font-weight:600;color:#253449;line-height:1.4}
.mdy-finance-stats span{font-size:12px;color:#939daa}
.mdy-finance-stats a:hover{background:transparent!important}
.mdy-profile-actions{display:flex;flex-wrap:wrap;gap:8px;width:100%;margin-top:16px;padding-top:14px;border-top:1px solid #f1f3f6}
.mdy-profile-actions a{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--theme-color-3);border-radius:3px;padding:7px 12px;font-size:13px;color:var(--theme-color-3);background:#fff;transition:border-color .2s ease,color .2s ease,background-color .2s ease}
.mdy-profile-actions a:hover{border-color:var(--theme-color-3);background:var(--theme-color-3);color:#fff}
.mdy-profile-actions i{font-size:15px;line-height:1}
/* 统计卡顶部色条 */
.mdy-stat--ticket>strong:before{background:#4a8cff}
.mdy-stat--order>strong:before{background:#ff9a41}
.mdy-stat--run>strong:before{background:#37bd84}
.mdy-stat--expire>strong:before{background:#f27e8b}
/* 「累计消费」占满一行 */
.mdy-finance-totals a.is-wide{grid-column:1/-1}
@media(max-width:575px){
  .mdy-profile-avatar{width:72px;height:72px;flex:0 0 72px}
  .mdy-profile-actions a{padding:6px 10px;font-size:12px}
}

/* 统计区：外层不再套一层框，只有 4 张卡自己有边 */
.mdy-dashboard .mdy-stats{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.mdy-dashboard .mdy-stat{background:#fff;border:1px solid #edf0f4;box-shadow:0 1px 2px rgba(25,40,70,.025)}

/* 费用小卡：hover 背景变灰、金额变蓝 */
.mdy-finance-totals a{transition:background-color .2s ease}
.mdy-finance-totals a:hover{background:#eceef2}
.mdy-finance-totals a:hover strong{color:var(--theme-color-3)}
.mdy-unit{font-style:normal;font-size:.75em;margin-left:2px;color:#919baa;font-weight:400}
.mdy-finance-totals a:hover .mdy-unit{color:var(--theme-color-3)}

/* 待办三宫格：独立卡片 */
.mdy-dashboard .mdy-quickstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:0;padding:16px 10px;text-align:center}
.mdy-quickstats>a{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;justify-self:center;padding:6px 10px;border-radius:3px;text-decoration:none;transition:none}
.mdy-quickstats>a:hover,.mdy-quickstats>a:focus{background:transparent!important}
.mdy-quickstats strong{display:block;font-size:22px;font-weight:600;line-height:1.35;color:#253449}
.mdy-quickstats span{font-size:13px;color:#939daa}
.mdy-quickstats>a:hover strong{color:#253449!important}

/* 资源列表标题 hover 不要变蓝（change.mdy.css 里有 .card-title:hover 的规则） */
.mdy-dashboard .mdy-resources .card-title:hover,
.mdy-dashboard .mdy-resources .card-title *{color:#253449!important;border-color:var(--theme-color-3)!important}
.mdy-dashboard .mdy-resources .card-title a,
.mdy-dashboard .mdy-resources .card-title a:hover{color:var(--theme-color-3)!important}

/* 资源列表：状态圆点 + 轻量表格（对齐官方模板的观感） */
.mdy-resources .mdy-host-status{display:inline-flex;align-items:center;gap:6px;background:transparent;padding:0;color:#576479;font-size:13px;white-space:nowrap}
.mdy-status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#c9ced6;flex:0 0 7px}
.mdy-host-status.is-active{color:#35ad66}
.mdy-host-status.is-active .mdy-status-dot{background:#35ad66}
.mdy-host-status.is-inactive .mdy-status-dot{background:#c9ced6}
.mdy-resources .table td,.mdy-resources .table th{padding:12px 12px!important}
.mdy-resources .table td{font-size:13px;color:#5a6678}
.mdy-resources .table th{background:#f5f6f8;color:#4a5566;font-weight:600}
.mdy-resources .table td a.text-dark{color:#3c495c!important}
.mdy-resources .table td a.text-dark:hover{color:var(--theme-color-3)!important}

/* 每页条数下拉：去阴影，改成我们自己的描边 + 外部 chevron 样式 */
.page-content .table-pagination,
.page-content .table-pageinfo,
.page-content .table-pagination .pagination { box-shadow: none !important; }
.page-content .table-pageinfo select,
.page-content .table-pageinfo select.mdy-dd-native, .page-content #sourcelimitSel{
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    height: 32px;
    min-width: 64px;
    padding: 0 26px 0 10px !important;
    background-color: #fff !important;
    border: 1px solid #e8ecf4 !important;
    border-radius: 4px !important;
    color: #253449 !important;
    font-size: 13px !important;
    line-height: 1.2;
    box-shadow: none !important;
    outline: none !important;
    background-image: url("/themes/clientarea/mdy/assets/images/icons/chevron-down.svg");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 10px 10px;
    transition: border-color .2s ease;
    cursor: pointer;
}
.page-content .table-pageinfo select:hover,
.page-content .table-pageinfo select.mdy-dd-native, .page-content #sourcelimitSel:hover{
    border-color: #c9d3e3 !important;
}
.page-content .table-pageinfo select:focus,
.page-content .table-pageinfo select.mdy-dd-native, .page-content #sourcelimitSel:focus{
    border-color: #0052d9 !important;
    box-shadow: none !important;
}
/* 分页按钮也去掉阴影，保持同一个「描边」语言 */
.page-content .table-pagination .pagination .page-link{
    box-shadow: none !important;
    border-color: #e8ecf4 !important;
    color: #5a6678;
}
.page-content .table-pagination .pagination .page-item.active .page-link{
    border-color: var(--theme-color-3) !important;
    color: #fff !important;
}

/* 每页条数：购物车同款自绘下拉 .mdy-dd */
.page-content .table-pageinfo select.mdy-dd-native, .page-content #sourcelimitSel.mdy-dd-native{
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    opacity: 0 !important; pointer-events: none !important;
    margin: -1px !important; padding: 0 !important; border: 0 !important;
}
.mdy-dd{position:relative;display:inline-block;vertical-align:middle}
.mdy-dd__display{
    display:inline-flex;align-items:center;justify-content:space-between;gap:8px;
    position:relative;min-width:50px;height:30px;padding:0 22px 0 8px;
    background:#fff;border:1px solid #e8ecf4;border-radius:4px;
    font-size:13px;color:#253449;line-height:1;cursor:pointer;
    transition:border-color .2s ease,box-shadow .2s ease;
}
.mdy-dd__display:hover{border-color:#c9d3e3}
.mdy-dd.is-open .mdy-dd__display{
    border-color:#0052d9;
    box-shadow:0 0 0 2px rgba(0,82,217,.04), 0 4px 12px rgba(0,82,217,.06);
}
.mdy-dd__text{flex:1 1 auto;min-width:0;text-align:left}
/* 面板内搜索框（可搜索下拉：选项上方的过滤输入） */
.mdy-dd__searchbox{padding:5px 4px 7px;border-bottom:1px solid #eff2f7}
.mdy-dd__search{
    width:100%;height:30px;box-sizing:border-box;
    border:1px solid #e8ecf4;border-radius:4px;padding:0 10px;
    font-size:13px;color:#253449;background:#fff;outline:0;
    transition:border-color .2s ease, box-shadow .2s ease;
}
.mdy-dd__search:focus{
    border-color:#0052d9;
    box-shadow:0 0 0 2px rgba(0,82,217,.04), 0 4px 12px rgba(0,82,217,.06);
}
.mdy-dd__search::placeholder{color:#98a2b3}
.mdy-dd__arrow{
    position:absolute;right:8px;top:50%;
    width:10px;height:10px;display:block;
    background-color:#8792a8;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/chevron-down.svg");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/chevron-down.svg");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:10px 10px;mask-size:10px 10px;
    transform:translateY(-50%);
    transition:transform .2s ease,background-color .2s ease;
}
.mdy-dd.is-open .mdy-dd__arrow{transform:translateY(-50%) rotate(180deg);background-color:#0052d9}
.mdy-dd__panel{
    position:absolute;left:0;top:calc(100% + 4px);z-index:90;
    min-width:100%;width:max-content;max-width:220px;max-height:220px;overflow-y:auto;overflow-x:hidden;
    padding:4px;background:#fff;border:1px solid #e8ecf4;border-radius:4px;
    box-shadow:0 6px 20px rgba(20,30,55,.1);
    opacity:0;visibility:hidden;transform:translateY(-4px);
    transition:opacity .15s ease,transform .15s ease,visibility .15s;
}
.mdy-dd.is-open .mdy-dd__panel{opacity:1;visibility:visible;transform:translateY(0)}
.mdy-dd__list{display:flex;flex-direction:column}
.mdy-dd__item{
    display:block;width:100%;padding:7px 10px;border:0;border-radius:2px;
    background:transparent;font-size:13px;color:#1f2b3d;text-align:left;white-space:nowrap;
    cursor:pointer;transition:background-color .15s ease,color .15s ease;
}
.mdy-dd__item:hover{background:#f2f6ff;color:#0052d9}
.mdy-dd__item.is-on{background:#eef4ff;color:#0052d9;font-weight:500}

/* 分页区文字与下拉：字大一点、框窄一点 */
.page-content .table-pageinfo{font-size:14px;color:#5a6678;display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.page-content .table-pageinfo span{font-size:14px;color:#5a6678}
.page-content .table-pageinfo .mdy-dd{margin:0 2px}
.page-content .mdy-dd__display{font-size:14px}
.page-content .table-pagination{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

/* 徽标 hover 提示：淡入淡出（不做位移弹出），带下三角指向徽标 */
.mdy-bound{position:relative}
.mdy-tip{
    position:absolute;
    left:50%;
    bottom:calc(100% + 8px);
    transform:translateX(-50%);
    padding:6px 9px;
    background:#20293a;
    color:#fff;
    font-size:12px;
    font-style:normal;
    font-weight:400;
    line-height:1;
    white-space:nowrap;
    border-radius:3px;
    box-shadow:0 4px 12px rgba(20,30,55,.18);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .18s ease, visibility .18s ease;
    z-index:20;
}
/* 下三角 */
.mdy-tip::after{
    content:"";
    position:absolute;
    left:50%;
    top:100%;
    margin-left:-5px;
    width:0;
    height:0;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid #20293a;
}
.mdy-bound:hover .mdy-tip{
    opacity:1;
    visibility:visible;
}

/* 分页按钮：圆角和下拉框一致（4px） */
.page-content .table-pagination .pagination{display:flex;align-items:center;gap:6px;margin:0}
.page-content .table-pagination .pagination .page-item+.page-item{margin-left:0}
.page-content .table-pagination .pagination .page-link{
    display:flex;align-items:center;justify-content:center;
    min-width:30px;height:30px;padding:0 8px;
    border:1px solid #e8ecf4!important;
    border-radius:4px!important;
    background:#fff;color:#5a6678;
    font-size:13px;line-height:1;
    box-shadow:none!important;
    transition:border-color .2s ease,color .2s ease,background-color .2s ease;
}
.page-content .table-pagination .pagination .page-link:hover{border-color:#c9d3e3!important;color:#0052d9}
.page-content .table-pagination .pagination .page-item.active .page-link{
    background:var(--theme-color-3)!important;border-color:var(--theme-color-3)!important;color:#fff!important;
}
.page-content .table-pagination .pagination .page-item.disabled .page-link{
    background:#f7f8fa!important;border-color:#eef0f4!important;color:#c2c8d2!important;
}

/* 统一圆角 4px（面板 / 统计卡 / 产品项 / 快捷按钮 / 费用块 / 徽标 / 按钮） */
.mdy-dashboard .mdy-panel,
.mdy-dashboard .mdy-stat,
.mdy-dashboard .mdy-products a,
.mdy-dashboard .mdy-profile-actions a,
.mdy-dashboard .mdy-bound,
.mdy-dashboard .mdy-dd__display,
.mdy-dashboard .mdy-dd__item,
.mdy-dashboard .btn,
.mdy-dashboard .btn-sm,
.page-content .table-pageinfo select,
.page-content .table-pageinfo select.mdy-dd-native, .page-content #sourcelimitSel,
.page-content .table-pagination .pagination .page-link{
    border-radius:4px!important;
}

/* 费用三块（未支付/本月/累计消费）不要圆角 */
.mdy-dashboard .mdy-finance-totals a{border-radius:0!important}

/* 充值按钮：做大一点 + 带图标 */
.mdy-dashboard .mdy-btn-recharge{
    display:inline-flex;align-items:center;justify-content:center;gap:3px;
    height:36px;min-width:88px;padding:0 14px;
    font-size:14px;font-weight:500;line-height:1;
    border-radius:4px!important;
    box-shadow:none!important;
}
.mdy-btn-ic{
    flex:0 0 15px;width:15px;height:15px;display:block;margin-top:-1px;
    background-color:currentColor;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:15px 15px;mask-size:15px 15px;
}
.mdy-btn-ic--recharge{
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/recharge.svg");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/recharge.svg");
}
@media(max-width:575px){
    .mdy-dashboard .mdy-btn-recharge{height:34px;min-width:84px;padding:0 14px;font-size:13px}
}

/* 充值按钮 hover 加深 */
.mdy-dashboard .mdy-btn-recharge{transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.mdy-dashboard .mdy-btn-recharge:hover,
.mdy-dashboard .mdy-btn-recharge:focus{
    background:#0a51cc!important;
    border-color:#0a51cc!important;
    color:#fff!important;
    box-shadow:none!important;
}

/* 分页「上一页/下一页」：丢掉 « » 文字，用两个 CSS chevron 画成 « / » */
.page-content .table-pagination .pagination .page-item:first-child .page-link,
.page-content .table-pagination .pagination .page-item:last-child .page-link{
    font-size:0!important;
    line-height:0!important;
    position:relative;
}
.page-content .table-pagination .pagination .page-item:first-child .page-link::before,
.page-content .table-pagination .pagination .page-item:first-child .page-link::after,
.page-content .table-pagination .pagination .page-item:last-child .page-link::before,
.page-content .table-pagination .pagination .page-item:last-child .page-link::after{
    content:"";
    position:absolute;
    top:calc(50% + 1.5px);
    width:5px;
    height:5px;
    margin-top:-4px;
    border-left:1.7px solid currentColor;
    border-bottom:1.7px solid currentColor;
}
/* « */
/* 上一页 « （每组两个 5px 方块，旋转后外接框约 7px，整组宽 12px，起点 10px 时才在 30px 按钮正中间） */
.page-content .table-pagination .pagination .page-item:first-child .page-link::before{ left:10px; transform:rotate(45deg) }
.page-content .table-pagination .pagination .page-item:first-child .page-link::after { left:15px; transform:rotate(45deg) }
/* 下一页 » */
.page-content .table-pagination .pagination .page-item:last-child .page-link::before{ left:7px; transform:rotate(-135deg) }
.page-content .table-pagination .pagination .page-item:last-child .page-link::after { left:12px; transform:rotate(-135deg) }

/* 二级菜单选中态：和一级一样蓝底白字（否则被 .sub-menu 的白底规则压掉） */
html body #sidebar-menu li ul.sub-menu li a.active,
html body #sidebar-menu li ul li a.active,
html body #sidebar-menu li a.active{
    background:var(--theme-color-2)!important;
    color:#fff!important;
    border-radius:5px!important;
}
#sidebar-menu .sub-menu li a.active span,
#sidebar-menu li ul li a.active span{color:#fff!important}

/* 已开通产品项：hover 时边框和文字一起变蓝 */
.mdy-dashboard .mdy-products>a{transition:border-color .2s ease,color .2s ease,background-color .2s ease}
.mdy-dashboard .mdy-products>a:hover{border-color:var(--theme-color-3);color:var(--theme-color-3)}
.mdy-dashboard .mdy-products>a:hover i{color:var(--theme-color-3)}
.mdy-dashboard .mdy-products>a:hover small{color:var(--theme-color-3)}

/* 产品管理页（/service）：工具栏上的方块统一 4px 圆角 */
.Product-table .btn,
.Product-table .btn-sm,
.Product-table .btn-group>.btn,
.Product-table .bootstrap-select>.dropdown-toggle,
.Product-table .bootstrap-select .dropdown-menu,
.Product-table .selectpicker,
.Product-table .form-control,
.Product-table input.form-control,
.Product-table .dropdown-menu,
.Product-table .table thead th:first-child,
.Product-table .table thead th:last-child{
    border-radius:4px!important;
}
/* 按钮组：外角 4px，中间保持相接 */
.Product-table .btn-group>.btn:first-child{border-radius:4px 0 0 4px!important}
.Product-table .btn-group>.btn:last-child{border-radius:0 4px 4px 0!important}
.Product-table .btn-group>.btn:only-child{border-radius:4px!important}
/* 下拉菜单项也统一 */
.Product-table .dropdown-menu .dropdown-item{border-radius:4px!important}

/* 产品管理页：去掉按钮/输入框的选中发光（focus/active 阴影） */
.Product-table .btn,
.Product-table .btn:focus,
.Product-table .btn:active,
.Product-table .btn.active,
.Product-table .btn.focus,

.Product-table .bootstrap-select>.dropdown-toggle:focus,
.Product-table .bootstrap-select>.dropdown-toggle:active,
.Product-table .dropdown-toggle:focus,
.Product-table .selectpicker:focus{
    box-shadow:none!important;
    outline:none!important;
    -webkit-tap-highlight-color:transparent;
}
/* 单按钮的 btn-group（批量操作）四角都是 4px */
.Product-table .btn-group>.btn.dropdown-toggle{border-radius:4px!important}

/* 产品管理页「状态」多选：自绘下拉，展开时和购物车输入框同款发光 */
.Product-table .bootstrap-select.mdy-ms-hidden{display:none!important}
.mdy-ms{position:relative;display:inline-block;vertical-align:middle;max-width:100%}
.mdy-ms__display{
    display:inline-flex;align-items:center;justify-content:space-between;gap:8px;
    min-width:400px;max-width:100%;height:37px;padding:0 26px 0 12px;
    position:relative;
    background:#fff;border:1px solid #e8ecf4;border-radius:4px;
    font-size:13px;color:#253449;line-height:1;cursor:pointer;text-align:left;
    transition:border-color .18s ease,box-shadow .18s ease;
}
.mdy-ms__display:hover{border-color:#c9d3e3}
/* 展开时：购物车配置输入框那圈发光 */
.mdy-ms.is-open .mdy-ms__display{
    border-color:#0052d9;
    box-shadow:0 0 0 2px rgba(0,82,217,.10);
}
.mdy-ms__text{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mdy-ms__display.is-placeholder .mdy-ms__text{color:#9aa4b2}
.mdy-ms__arrow{
    position:absolute;right:10px;top:50%;width:10px;height:10px;display:block;
    background-color:#8792a8;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/chevron-down.svg");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/chevron-down.svg");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:10px 10px;mask-size:10px 10px;
    transform:translateY(-50%);
    transition:transform .18s ease,background-color .18s ease;
}
.mdy-ms.is-open .mdy-ms__arrow{transform:translateY(-50%) rotate(180deg);background-color:#0052d9}
.mdy-ms__panel{
    position:absolute;left:0;top:calc(100% + 4px);z-index:95;
    min-width:100%;max-height:280px;overflow-y:auto;overflow-x:hidden;
    padding:4px;background:#fff;border:1px solid #e8ecf4;border-radius:4px;
    box-shadow:0 6px 20px rgba(20,30,55,.1);
    opacity:0;visibility:hidden;
    transform:translateY(-4px);
    transition:opacity .15s ease,transform .15s ease,visibility .15s;
}
.mdy-ms.is-open .mdy-ms__panel{opacity:1;visibility:visible;transform:translateY(0)}
.mdy-ms__list{display:flex;flex-direction:column;gap:4px}
.mdy-ms__item{
    display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
    padding:9px 10px;border:0;border-radius:4px;background:transparent;
    font-size:13px;color:#1f2b3d;text-align:left;cursor:pointer;
    transition:background-color .15s ease,color .15s ease;
}
.mdy-ms__item:hover{background:#f2f6ff;color:#0052d9}
.mdy-ms__item.is-on{background:#eef4ff;color:#0052d9;font-weight:500}
/* 勾选：CSS 画的对勾（右边+底边，长短臂不同，旋转 45° 才是 ✓ 而不是 ∨） */
.mdy-ms__check{
    flex:0 0 auto;width:5px;height:9px;margin:0 4px 0 0;opacity:0;
    border-right:2px solid #0052d9;border-bottom:2px solid #0052d9;
    transform:rotate(45deg) translate(-1px,-2px);
    transition:opacity .15s ease;
}
.mdy-ms__item.is-on .mdy-ms__check{opacity:1}

/* 产品管理页「状态」列：描边徽章 + 左上角圆点（对齐参考站样式） */
.Product-table .productIstatus,
.Product-table .badge[class*="-status-"]{
    position:relative;
    display:inline-block;
    padding:3px 10px!important;
    background:transparent!important;
    border:1px solid currentColor!important;
    border-radius:4px!important;
    font-size:12px!important;
    font-weight:500;
    line-height:1.5;
    color:#98a2b3;
}
/* 状态点由模板里的 .dots + getStatus() 实时电源状态逻辑负责，这里不再画装饰圆点 */
/* 已激活 / 已付款 — 绿 */
.Product-table [class*="-status-active"],
.Product-table [class*="-status-paid"],
.Product-table [class*="-status-success"]{color:#35ad66!important;background:transparent!important}
/* 待开通 / 未付款 — 橙 */
.Product-table [class*="-status-pending"],
.Product-table [class*="-status-unpaid"]{color:#f5a623!important;background:transparent!important}
/* 已暂停 — 红 */
.Product-table [class*="-status-suspended"]{color:#e5484d!important;background:transparent!important}
/* 被取消 / 被删除 / 已退款 / 有欺诈 — 灰 */
.Product-table [class*="-status-cancelled"],
.Product-table [class*="-status-deleted"],
.Product-table [class*="-status-refunded"],
.Product-table [class*="-status-fraud"]{color:#98a2b3!important;background:transparent!important}

/* ================= 产品详情页：1:1 复刻 tryidc.com 的 servicedetail 排版 =================
   取值来源：tryidc 主题 typo.css 的 .sky-card / .sky-flex-container / .sky-flex-33 / .sky-flex-66
   以及 module.css 的 .instance-itme-name / .instance-itme-desc（都已实测确认）：
     .sky-flex-container{display:flex;flex-wrap:nowrap;gap:20px;justify-content:space-between}
     .sky-flex-33{flex:1 1 33.3333%;width:33.3333%}
     .sky-flex-66{flex:1 1 66.6666%;width:66.6666%}
     .sky-card{background:#fff;border-radius:1px;box-shadow:0 0 20px rgba(0,0,0,.06);padding:20px;margin-bottom:20px}
     .sky-card .sky-title{font-size:14px;font-weight:700;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}
     .instance-itme-name{min-width:88px;color:#999;font-size:14px;font-weight:400}
     .instance-itme-desc{display:flex;gap:6px;align-items:center;color:#040f67;font-size:14px}
   页面底色实测为 #fff（卡片靠柔和投影分层，不靠灰底）。
   这里只做样式映射，DOM 与 JS 保持原样。 */

.page-content:has(.row.bottom-box) { background: #fff !important; }

@media (min-width: 992px) {
    /* 两列容器 = .sky-flex-container */
    .page-content .row.bottom-box {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 20px;
        justify-content: space-between;
        align-items: flex-start;
        margin-left: 0;
        margin-right: 0;
    }
    .page-content .row.bottom-box > .col-md-12 {
        width: auto !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /* 左 33.3333%，右 66.6666%（与 .sky-flex-33 / .sky-flex-66 完全一致） */
    .page-content .row.bottom-box > .col-md-12:first-child {
        flex: 1 1 33.3333% !important;
        width: 33.3333% !important;
    }
    .page-content .row.bottom-box > .col-md-12:nth-child(2) {
        flex: 1 1 66.6666% !important;
        width: 66.6666% !important;
        min-width: 0;
    }
    /* 左列：外层容器透明，内部每个信息块 = 一张 .sky-card */
    .page-content .row.bottom-box > .col-md-12:first-child > .card,
    .page-content .row.bottom-box > .col-md-12:first-child > .card > .card-body {
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin-bottom: 0 !important;
    }
    .page-content .row.bottom-box > .col-md-12:first-child .col-12.mb-2,
    .page-content .row.bottom-box > .col-md-12:first-child .row > [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 0 !important;
    }
}

/* 卡片：完全按 .sky-card 的实测值 */
.page-content .row.bottom-box > .col-md-12 > .card,
.page-content .row.bottom-box > .col-md-12:first-child .bg-light.card-body,
.page-content .row.bottom-box > .col-md-12:first-child .bg-gray.card-body,
.page-content .row.bottom-box > .col-md-12:first-child .user-center_product_grid {
    background: #fff !important;
    border: 0 !important;
    border-radius: 1px !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, .06) !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}
.page-content .row.bottom-box > .col-md-12 > .card > .card-body {
    padding: 20px !important;
}

/* 卡片标题 = .sky-title */
.page-content .row.bottom-box .card h1,
.page-content .row.bottom-box .card h2,
.page-content .row.bottom-box .card h3,
.page-content .row.bottom-box .card h4,
.page-content .row.bottom-box .card h5,
.page-content .row.bottom-box > .col-md-12:first-child .bg-light.card-body > p.text-gray:first-child,
.page-content .row.bottom-box > .col-md-12:first-child .bg-gray.card-body > p.text-gray:first-child {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #040f67 !important;
    margin-bottom: 20px !important;
}

/* 字段行 = .instanceInformation-itme（标签 88px 灰、值深蓝） */
.page-content .mdy-sd-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 0;
    border-bottom: 0;
    margin-bottom: 10px;
}
.page-content .mdy-sd-row > .text-gray:first-child,
.page-content .mdy-sd-row > span:first-child {
    flex: 0 0 auto;
    min-width: 88px;
    font-size: 14px !important;
    font-weight: 400;
    color: #999 !important;
}
.page-content .mdy-sd-row .mdy-sd-val {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 400;
    color: #040f67 !important;
    white-space: normal;
    word-break: break-all;
}
.page-content .mdy-sd-row .mdy-sd-val .restall-btn,
.page-content .mdy-sd-row .restall-btn {
    order: 9;
    margin-left: 6px;
    font-size: 12px !important;
    line-height: 20px;
    padding: 0 10px !important;
    border-radius: 1px !important;
    border: 1px solid #e9ecf1 !important;
    background: #fff !important;
    color: #165dff !important;
}

/* 左列其余字段（登录信息/价格/配置/备注里的 p） */
.page-content .row.bottom-box > .col-md-12:first-child .bg-light.card-body p,
.page-content .row.bottom-box > .col-md-12:first-child .bg-gray.card-body p {
    font-size: 14px !important;
    color: #040f67 !important;
    margin-bottom: 8px;
}

/* 顶部信息条也做成 .sky-card（白卡 + 柔和投影） */
.page-content .server_header_box {
    background: #fff !important;
    border-radius: 1px !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, .06) !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}
.page-content .server_header_box h4,
.page-content .server_header_box .text-white { color: #040f67 !important; }

/* 顶部切换栏 */

@media (max-width: 991.98px) {
    .page-content .row.bottom-box { display: block !important; }
    .page-content .row.bottom-box > .col-md-12 { width: 100% !important; max-width: 100% !important; }
}

/* 详情页右上角操作按钮：平铺一行，灰描边按钮 + 蓝色 VNC */
.page-content .mdy-sd-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
}
.page-content .mdy-sd-actions .mdy-sd-act{
    background:#fff!important;
    border:1px solid #e9ecf1!important;
    color:#3c495c!important;
    font-size:14px;
    line-height:1.4;
    padding:6px 16px!important;
    border-radius:4px!important;
    box-shadow:none!important;
    transition:border-color .2s ease,color .2s ease;
}
.page-content .mdy-sd-actions .mdy-sd-act:hover{
    border-color:var(--theme-color-3)!important;
    color:var(--theme-color-3)!important;
}
/* VNC / 控制台 单个按钮保持蓝色实心，尺寸和左边一致 */
.page-content .server_header_box .custom-button,
.page-content .server_header_box .btn-primary{
    font-size:14px;
    padding:6px 16px!important;
    border-radius:4px!important;
    box-shadow:none!important;
    line-height:1.4;
}
.page-content .server_header_box .btn-group.ml-2.mr-2.mt-2{margin:0 0 0 8px!important}

/* 实例状态：圆点 + 文字（颜色由 JS 按电源状态写入） */
.page-content .mdy-sd-power{display:inline-flex;align-items:center;font-size:14px;color:#98a2b3}
.page-content .mdy-sd-dot{
    display:inline-block;width:14px;height:14px;border-radius:50%;
    background:transparent;border:2px solid currentColor;
    margin-right:6px;flex:0 0 14px;box-sizing:border-box;
}
.page-content .mdy-sd-refresh{
    display:inline-block;width:15px;height:15px;margin-left:10px;cursor:pointer;
    background-color:currentColor;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/refresh.svg?v=20261027b");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/refresh.svg?v=20261027b");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:15px 15px;mask-size:15px 15px;
    color:#98a2b3;
    transition:color .2s ease;
}
.page-content .mdy-sd-refresh:hover{color:#98a2b3}


/* 实例状态：加载中 = 登录页按钮同款转圈（2px 亮弧、0.8s 匀速） */
.page-content .mdy-sd-power.is-loading .mdy-sd-dot{
    width:14px!important;
    height:14px!important;
    flex:0 0 14px!important;
    background:transparent!important;
    border:2px solid rgba(22,93,255,.25)!important;
    border-top-color:#165dff!important;
    animation:mdy-sd-spin .8s linear infinite;
}
@keyframes mdy-sd-spin{ to { transform:rotate(360deg); } }

/* 实例信息卡右上角状态徽章：不加粗 */
.page-content .mdy-sd-state{
    display:inline-block;
    margin-left:8px;
    padding:1px 8px;
    font-size:12px;
    font-weight:400!important;
    line-height:1.6;
    color:#fff;
    background:#35ad66;
    border-radius:3px;
    vertical-align:middle;
}
.page-content .mdy-sd-state.status-suspended{background:#e5484d}
.page-content .mdy-sd-state.status-pending{background:#f5a623}
.page-content .mdy-sd-state.status-cancelled,
.page-content .mdy-sd-state.status-deleted{background:#98a2b3}

/* 刷新按钮的提示气泡：白底、出现在右侧 */
.page-content .mdy-sd-tip{position:relative;display:inline-flex;align-items:center}
.page-content .mdy-sd-tip::after{
    content:attr(data-tip);
    position:absolute;
    left:calc(100% + 10px);
    top:50%;
    transform:translateY(-50%);
    padding:6px 10px;
    background:#fff;
    color:#3c495c;
    font-size:12px;
    font-weight:400;
    line-height:1;
    white-space:nowrap;
    border:1px solid #e9ecf1;
    border-radius:4px;
    box-shadow:0 4px 14px rgba(20,30,55,.10);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .18s ease,visibility .18s ease;
    z-index:30;
}
.page-content .mdy-sd-tip::before{
    content:"";
    position:absolute;
    left:calc(100% + 3px);
    top:50%;
    margin-top:-4px;
    width:0;height:0;
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
    border-right:5px solid #fff;
    filter:drop-shadow(-1px 0 0 #e9ecf1);
    opacity:0;
    visibility:hidden;
    transition:opacity .18s ease,visibility .18s ease;
    z-index:31;
}
.page-content .mdy-sd-tip:hover::after,
.page-content .mdy-sd-tip:hover::before{opacity:1;visibility:visible}

/* 实例ID：蓝色可点，点击复制 */
.page-content .mdy-sd-copy{color:#165dff;cursor:pointer;text-decoration:none}
.page-content .mdy-sd-copy:hover{color:#0a51cc;text-decoration:none}

/* 实例名称后的复制图标（取自参考站 icon-fuzhi1 轮廓） */
.page-content .mdy-sd-copy-mini{
    display:inline-block;
    width:14px;height:14px;
    margin-left:8px;
    vertical-align:-2px;
    cursor:pointer;
    background-color:#98a2b3;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/copy.svg?v=20261027b");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/copy.svg?v=20261027b");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:14px 14px;mask-size:14px 14px;
}

/* 详情页左列：OS 小图标 / 行内小按钮 / IP 文本 */
.page-content .mdy-sd-osicon{width:16px;height:16px;margin-right:6px;vertical-align:-2px}
.page-content .mdy-sd-ip{font-size:14px;color:#040f67}
.page-content .mdy-sd-btn{
    margin-left:10px;
    padding:1px 8px!important;
    font-size:12px!important;
    line-height:1.7;
    border:1px solid #e9ecf1!important;
    border-radius:4px!important;
    background:#fff!important;
    color:#165dff!important;
    box-shadow:none!important;
}
.page-content .mdy-sd-btn:hover{border-color:#165dff!important}

/* 重置密码：蓝色链接 + 铅笔图标（参考站样式） */
.page-content .mdy-sd-linkbtn{
    display:inline-flex!important;
    align-items:center;
    gap:4px;
    margin-left:10px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#165dff!important;
    font-size:14px!important;
    line-height:1.4;
    white-space:nowrap;
}
.page-content .mdy-sd-linkbtn .bx{
    font-size:14px;
    line-height:1;
}
.page-content .mdy-sd-linkbtn:hover{color:#0a51cc!important}

/* 登录信息：密码文字用黑字（点击仍可复制） */
.page-content #copyPwdContent,
.page-content .btnCopyPwd{
    color:#040f67!important;
    cursor:pointer;
}

/* 计费信息卡：标签 + 值 行式（参考图二） */
.page-content .mdy-bill-row{
    display:flex;
    align-items:center;
    padding:5px 0;
}
.page-content .mdy-bill-label{
    width:110px;
    flex:0 0 110px;
    color:#98a2b3;
    font-size:14px;
}
.page-content .mdy-bill-value{
    color:#040f67;
    font-size:14px;
    font-weight:600;
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}
.page-content .mdy-bill-remain{
    color:#35ad66;
    font-style:normal;
    font-weight:400;
    font-size:13px;
}
.page-content .mdy-bill-row .custom-switch{padding-left:2.5rem;min-height:1.4rem}
.page-content .mdy-bill-row .custom-control-label::before{top:.1rem}
.page-content .mdy-bill-row .custom-control-label::after{top:.1rem}

/* 配置项条带：一行内多对「标签 值」，超出换行，且不超出卡片 */
.page-content .user-center_product_grid{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center;
    gap:4px 22px;
    margin:0!important;
    padding:10px 0!important;
    width:100%!important;
    max-width:100%;
    box-sizing:border-box;
}
.page-content .user-center_product_grid .configuration{
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    border-bottom:0!important;
    line-height:24px;
}
.page-content .user-center_product_grid .configuration > div{
    display:flex!important;
    align-items:center;
    gap:6px;
    width:auto!important;
    margin:0!important;
    padding:0!important;
}
.page-content .user-center_product_grid .configuration p{
    margin:0!important;
    padding:0!important;
    font-size:14px;
    line-height:24px;
    white-space:nowrap;
}
.page-content .user-center_product_grid .configuration .text-gray{color:#98a2b3}

/* 详情页 hero 行：左侧状态环 + 实例名称，右侧操作按钮 */
.page-content .mdy-sd-hero-left{
    gap:10px;
    padding-right:12px;
}
.page-content .mdy-sd-hero-name{
    font-size:24px;
    font-weight:700;
    color:#040F43;
    line-height:1.3;
}
/* 参考站同款：hero 名称后的公网 IP（与登录信息卡的实例 IP 同源） */
.page-content .mdy-sd-hero-left{align-items:baseline}
.page-content .mdy-sd-hero-ip{
    font-size:14px;
    font-weight:400;
    color:#999;
    white-space:nowrap;
}
.page-content .mdy-sd-hero-ip .mdy-copy{margin-left:6px}
/* 运行状态胶囊（服务卡片版与详情页共用，样式与详情页一致） */
.mdy-product-power-state {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        margin-top: 7px;
        padding: 3px 9px;
        color: #075985;
        background: linear-gradient(135deg, #e0f2fe 0%, #dbeafe 100%);
        border: 1px solid #7dd3fc;
        border-radius: 12px;
        box-shadow: 0 3px 10px rgba(14, 165, 233, .18);
        font-size: 12px;
        line-height: 18px;
        transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
    }
    .mdy-product-power-state[data-power-status="on"] {
        color: #067647;
        background: linear-gradient(135deg, #ecfdf3 0%, #d1fadf 100%);
        border-color: #75e0a7;
        box-shadow: 0 3px 10px rgba(18, 183, 106, .18);
    }
    .mdy-product-power-state[data-power-status="off"],
    .mdy-product-power-state[data-power-status="suspend"] {
        color: #b42318;
        background: linear-gradient(135deg, #fef3f2 0%, #fee4e2 100%);
        border-color: #fda29b;
        box-shadow: 0 3px 10px rgba(240, 68, 56, .14);
    }
    .mdy-product-power-state[data-power-status="process"],
    .mdy-product-power-state[data-power-status="waiting"],
    .mdy-product-power-state[data-power-status="wait"],
    .mdy-product-power-state[data-power-status="wait_reboot"],
    .mdy-product-power-state[data-power-status="cold_migrate"],
    .mdy-product-power-state[data-power-status="hot_migrate"] {
        color: #93370d;
        background: linear-gradient(135deg, #fffaeb 0%, #fef0c7 100%);
        border-color: #fec84b;
        box-shadow: 0 3px 10px rgba(247, 144, 9, .14);
    }
    .mdy-product-power-state [data-mdy-power-state-value] {
        font-weight: 600;
    }

/* 列表：产品名 hover 变蓝（主机名/域名在链接外保持灰色不变） */
.page-content a.text-dark:hover,
.page-content a.text-dark:hover strong{color:#165dff}
/* 复制图标 hover 变蓝 */
.page-content .btnCopy:hover{color:#165dff;cursor:pointer}

/* 多 IP 的 (N) 计数：蓝色可点，hover/点击弹出全部 IP */
.mdy-ip-count{color:#165dff;cursor:pointer;font-weight:500}
.mdy-ip-count:hover{color:#0e4fe1}
.mdy-ip-list .mdy-ip-row{display:flex;align-items:center;gap:6px;padding:10px 2px;font-size:14px;color:#1f2b3d}
.mdy-ip-list .mdy-ip-row .mdy-copy{color:#999;font-size:16px;line-height:1}
.mdy-ip-list .mdy-ip-row .mdy-copy:hover{color:#666}
.page-content .mdy-sd-hero-left .mdy-sd-power{
    font-size:0;      /* hero 只显示圆环，不显示文字 */
}
.page-content .mdy-sd-hero-left .mdy-sd-dot{
    width:18px;height:18px;flex:0 0 18px;margin-right:0;border-width:2px;
}

/* 参考站同款：圆形返回箭头（far fa-chevron-circle-left 轮廓） */
.page-content .mdy-sd-back{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;height:20px;
    text-decoration:none!important;
}
.page-content .mdy-sd-back-ic{
    display:inline-block;
    width:20px;height:20px;
    background-color:currentColor;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/back.svg?v=20261027a");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/back.svg?v=20261027a");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:20px 20px;mask-size:20px 20px;
}

/* 概要面板：左列(33%) 与 图表(66%) 并排；切 tab 一起切走 */
@media (min-width: 992px) {
    .page-content #home1.active {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 20px;
        align-items: flex-start;
    }
    .page-content #home1 > .mdy-sd-leftcol {
        flex: 0 0 33.3333% !important;
        width: 33.3333% !important;
        max-width: 33.3333% !important;
        min-width: 0;
    }
    .page-content #home1 > .mdy-sd-rightcol {
        flex: 1 1 66.6666% !important;
        width: 66.6666% !important;
        max-width: 66.6666% !important;
        min-width: 0;
    }
}
.page-content .mdy-sd-leftcol > .col-md-12 {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.page-content .mdy-sd-leftcol > .col-md-12 > .card,
.page-content .mdy-sd-leftcol > .col-md-12 > .card > .card-body {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}
.page-content .mdy-sd-leftcol .col-12.mb-2,
.page-content .mdy-sd-leftcol .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 0 !important;
}
.page-content .mdy-sd-leftcol .bg-light.card-body,
.page-content .mdy-sd-leftcol .bg-gray.card-body,
.page-content .mdy-sd-leftcol .user-center_product_grid {
    background: #fff !important;
    border: 0 !important;
    border-radius: 1px !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, .06) !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}

/* 非激活的概要面板必须保持隐藏（否则会被上面的 flex 规则顶出来） */
.page-content #home1:not(.active){display:none!important}

/* ====== 参考站 1:1 对齐（依据 .tmp/ref_static 实测值）====== */
/* 页面底色：参考站 body = #eff2f7（卡片是白，底色是浅灰蓝，卡片才能“浮”起来） */
.page-content,
.page-content .container-fluid,
.page-content:has(.row.bottom-box),
.page-content:has(#home1){
    background:#eff2f7!important;
}
/* 例外：tab 面板内部的 container-fluid 不铺灰（否则升级降级等 tab 内容底下多一层灰） */
.page-content .tab-content .container-fluid{
    background:transparent!important;
}
/* 例外：tab 面板内的 row 不做负边距外扩（col 的 padding 被上面的规则清零后，
   row 的 -15px 负边距会把内容顶出白框，按钮溢出白面板边缘） */
.page-content .tab-content .card-body.px-0 > .row{
    margin-left:0;
    margin-right:0;
}

/* 顶部 hero：无卡片、无阴影、无边框、无内边距（参考 .cloudServer-head 实测） */
.page-content .server_header_box{
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    padding:0!important;
    margin-bottom:10px!important;
    min-height:0!important;
}

/* tabs：容器无下边框，激活项 padding 8px 16px + 2px 蓝色下划线 */

/* 概要面板：透明、无内边距（卡片自身白底 + 20px padding） */
.page-content #home1.active{background:transparent!important;padding:0!important}

/* 左列卡片：与 .sky-card 一致 */
.page-content .mdy-sd-leftcol .bg-light.card-body,
.page-content .mdy-sd-leftcol .bg-gray.card-body,
.page-content .mdy-sd-leftcol .user-center_product_grid{
    background:#fff!important;
    border:0!important;
    border-radius:1px!important;
    box-shadow:0 0 20px rgba(0,0,0,.06)!important;
    padding:20px!important;
    margin-bottom:20px!important;
}
/* 卡片标题 */
.page-content .mdy-sd-leftcol p.text-gray{
    font-size:14px!important;
    font-weight:700!important;
    color:#040f67!important;
    margin-bottom:20px!important;
}
/* 字段行：行间距 20px、标签 88px #999、值 #040f67 */
.page-content .mdy-sd-leftcol .mdy-sd-row{margin-bottom:20px!important;gap:6px!important}
.page-content .mdy-sd-leftcol .mdy-sd-row .text-gray{font-size:14px!important;font-weight:400!important;color:#999!important}
.page-content .mdy-sd-leftcol .mdy-sd-row .mdy-sd-val{font-size:14px!important;font-weight:400!important;color:#040f67!important}
/* 列宽 33.33% / 66.66%，间隙 20px */
@media (min-width: 992px){
    .page-content #home1.active{gap:20px!important}
    .page-content #home1 > .mdy-sd-leftcol{flex:0 0 33.3333%!important;width:33.3333%!important;max-width:33.3333%!important}
    .page-content #home1 > .mdy-sd-rightcol{flex:1 1 66.6666%!important;width:66.6666%!important;max-width:66.6666%!important}
}

/* 右列（实例监控）：白卡片，与左侧卡片同规格 */
.page-content .mdy-sd-rightcol{
    background:#fff!important;
    border-radius:1px!important;
    box-shadow:0 0 20px rgba(0,0,0,.06)!important;
    padding:20px!important;
    margin-bottom:20px!important;
}
.page-content .mdy-sd-rightcol .chartbox{padding:0 10px 10px 0}

/* 新结构：状态圆环 / 状态文字 / 剩余天数 */
.page-content #home1.active{display:flex!important;gap:20px;align-items:flex-start}
.page-content #home1 > .mdy-col-left{flex:0 0 33.3333%!important;width:33.3333%!important;max-width:33.3333%!important;min-width:0}
.page-content #home1 > .mdy-col-right{flex:1 1 66.6666%!important;width:66.6666%!important;max-width:66.6666%!important;min-width:0}

/* 状态圆环（空心，加载中旋转） */
.page-content .mdy-sd-dot{
    display:inline-block;
    width:12px;height:12px;
    border:2px solid #98a2b3;
    border-radius:50%;
    background:transparent;
    box-sizing:border-box;
    vertical-align:middle;
}
.page-content .mdy-sd-dot.is-loading{
    border-color:rgba(22,93,255,.25)!important;
    border-top-color:#165dff!important;
    animation:mdy-sd-spin .8s linear infinite;
}
@keyframes mdy-sd-spin{ to { transform:rotate(360deg); } }
.page-content .mdy-instance-state{display:inline-flex;align-items:center;margin-right:6px}
.page-content .mdy-status-text{font-size:14px;color:#3c495c;margin-right:8px}
.page-content .mdy-refresh-status{color:#999;font-size:12px;cursor:pointer}
.page-content .mdy-refresh-status:hover{color:#165dff}
.page-content .mdy-bill-remain{color:#35ad66;font-style:normal;margin-left:6px;font-size:13px}
.page-content .mdy-copy{cursor:pointer}

/* 重装系统图标（取自参考站 Uicon icon-duogemoban1 / 0xE681） */
.page-content .mdy-ic-reinstall{
    display:inline-block;
    width:14px;height:14px;
    margin-right:4px;
    vertical-align:-2px;
    background-color:currentColor;
    -webkit-mask-image:url("/themes/clientarea/mdy/assets/images/icons/reinstall.svg?v=20261027a");
    mask-image:url("/themes/clientarea/mdy/assets/images/icons/reinstall.svg?v=20261027a");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:14px 14px;mask-size:14px 14px;
}

/* API 信息：浅底行 + 左侧绿条 + 右侧"已激活"（照参考稿） */
.mdy-api-list{display:grid;gap:14px;border-top:1px dashed #e3e8ef;padding-top:16px}
.mdy-api-list a{display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:0 14px;background:#f3f6fb;border-left:3px solid #27cc85;border-radius:2px;color:#040f43;font-size:14px}
.mdy-dashboard .mdy-api-list a:hover{background:#eaf0f8;color:#040f43}
.mdy-api-list em{font-style:normal;color:#27cc85;white-space:nowrap}
/* 状态：2 已激活(绿 #27cc85 / 底 #f3f6fb) · 1 未激活(红 #ff584d / 底 #fff7f6) · 0 未开启(灰) · -1 读取失败 */
.mdy-api-list a.is-2 em{color:#27cc85}
.mdy-api-list a.is-1{background:#fff7f6;border-left-color:#ff584d}
.mdy-dashboard .mdy-api-list a.is-1:hover{background:#ffefee}
.mdy-api-list a.is-1 em{color:#ff584d}
.mdy-api-list a.is-0{background:#f5f6f8;border-left-color:#cfd6df}
.mdy-dashboard .mdy-api-list a.is-0:hover{background:#eef0f3}
.mdy-api-list a.is-0 em{color:#95a0b0}
.mdy-api-list a.is--1{background:#f5f6f8;border-left-color:#cfd6df}
.mdy-api-list a.is--1 em{color:#95a0b0}

/* 推荐返利推广块（照参考站 earnCommission 布局，皮肤走我们自己的 4px 圆角/字色） */
.mdy-dashboard .mdy-earn-title{border-left:0;padding-left:0;margin-bottom:16px;display:block}
.mdy-earn-chip{display:inline-flex;align-items:center;height:34px;padding:0 20px 0 9px;background:#fff2e6;color:#ff7301;font-size:12px;font-weight:700;border-radius:4px}
.mdy-earn-chip i{margin-right:5px;font-size:15px}
.mdy-earn-intro{margin:0 0 16px;font-size:14px;line-height:1.7;color:#040f43}
.mdy-earn-brand{color:#ff7301;margin:0 2px}
.mdy-earn-btn{border-radius:4px;font-size:12px;padding:5px 15px}
/* 仪表盘里那条 `.mdy-dashboard a:hover{color:var(--theme-color-3)}`（0,2,1）会盖掉
   bootstrap `.btn-outline-primary:hover{color:#fff}`（0,2,0），导致 hover 底色变蓝而字还是蓝的 */
.mdy-dashboard .mdy-earn-btn:hover,
.mdy-dashboard .mdy-earn-btn:focus{color:#fff}
/* 图标同参考站：Uicon icon-tuichuzhanghu1（e6b4）16×16、跟随按钮色、不加粗 */
.mdy-earn-ico{margin-right:4px;vertical-align:baseline}
.mdy-earn-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:20px}
.mdy-earn-item{position:relative;background-color:#f2f4f8;background-size:contain;background-position:100% 50%;background-repeat:no-repeat;border-radius:4px;padding:16px 12px;box-shadow:0 0 0 1px rgba(235,237,241,.24)}
/* 参考站：只有第一张卡带插画（analysis.png），另外两张纯色 */
.mdy-earn-item:nth-child(1){background-image:url("../images/analysis.png")}
/* 卡片底部那道 3px 主题色：第一张常驻，其余 hover 时出现 */
.mdy-earn-item:before{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:0;background:var(--theme-color-3);transition:height .3s ease-out}
.mdy-earn-item:hover:before,.mdy-earn-item:nth-child(1):before{height:3px}
.mdy-earn-head{display:flex;align-items:center;margin-bottom:10px}
.mdy-earn-head strong{font-size:14px;font-weight:600;color:#040f43;margin-right:10px}
.mdy-earn-head em{font-style:normal;font-size:12px;line-height:18px;padding:0 8px;color:#ff9d00;background:#feeeda;border-radius:2px}
.mdy-earn-item p{margin:0;font-size:13px;line-height:1.7;color:#8187a1}
@media(max-width:991.98px){.mdy-earn-offers{grid-template-columns:1fr}}

/* 用户卡无 QQ 头像时的首字母：撑满 98×98（父级已有 4px 圆角 + overflow hidden） */
.mdy-profile-avatar .mdy-avatar-letter{width:100%;height:100%;font-size:38px;border-radius:0}

/* 手机端不显示「API信息」卡 */
@media (max-width: 991.98px) {
	.mdy-dashboard .mdy-apiinfo { display: none !important; }
}

/* 手机端：服务详情操作按钮统一在同一行流里换行（原来 .mdy-sd-actions 整块占满一行，
   VNC 明明放得下也被挤到下一行）。display:contents 让内部按钮直接参与父级 flex 换行。 */
@media (max-width: 991.98px) {
	.page-content .mdy-sd-actions { display: contents; }
}

/* 手机端：服务详情里「实例信息 + 实例监控」两栏改成上下堆叠（桌面仍左右两栏） */
@media (max-width: 991.98px) {
	.page-content #home1.active { display: block !important; }
	.page-content #home1 > .mdy-col-left,
	.page-content #home1 > .mdy-col-right {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	.page-content #home1 > .mdy-col-left { margin-bottom: 16px; }
}

/* 手机端：详情页外壳（.card + .card-body）的内边距去掉，
   里面各板块卡片直接拉满整宽，避免白底里再套一层窄卡片 */
@media (max-width: 991.98px) {
	/* 必须写到和上面那条 20px 规则同层甚至更深，否则权重不够。
	   同时把外壳的白色底/边框/投影一起去掉，让卡片直接落在页面底色上 */
	.page-content .row.bottom-box > .col-md-12 > .card.mdy-sd-shell,
	.page-content .mdy-sd-shell {
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
	}
	.page-content .mdy-sd-shell > .card-body { background: transparent !important; }
	.page-content .row.bottom-box > .col-md-12 > .card.mdy-sd-shell > .card-body,
	.page-content .mdy-sd-shell > .card-body { padding: 0 !important; }
	.page-content .mdy-sd-shell .nav-tabs { padding: 0 14px; }
	.page-content .row.bottom-box > .col-md-12 > .card.mdy-sd-shell .tab-content.p-3,
	.page-content .mdy-sd-shell .tab-content.p-3 { padding: 16px 0 !important; }
	/* zjmfcloud.css 在 ≤1367 给 .bottom-box 加了 margin-top:3rem，手机上 tab 和卡片的间距被撑到 60px；
	   去掉它，和电脑端一样保持 16px */
	.page-content .row.bottom-box { margin-top: 0 !important; }
	/* 监控图表：桌面两个一行，手机改成一个一行 */
	.page-content .mdy-col-right .chartbox { width: 100% !important; padding: 0 0 16px !important; }
	/* 各 tab 面板内容左右贴边（原来 finance 等面板自带 20px 内距，看着比卡片缩一截） */
	.page-content .mdy-sd-shell .tab-pane { padding-left: 0 !important; padding-right: 0 !important; }
	.page-content .mdy-sd-shell .tab-pane .table-responsive { margin-top: 0 !important; }
	/* 表格底部条（共 N 条 / 每页 / 页码）一行排布，和产品列表一致 */
	.page-content .mdy-sd-shell .tab-pane .table-footer {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		padding: 10px 12px;
		font-size: 12px;
	}
	.page-content .mdy-sd-shell .tab-pane .table-footer .table-pagination {
		display: flex;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center;
		justify-content: flex-end;
		gap: 6px;
		margin: 0;
	}
	.page-content .mdy-sd-shell .tab-pane .table-footer .pagination { flex-wrap: nowrap !important; margin: 0; }
	/* 「共 N 条 / 每页」那格自带 16px 下边距，会把页码顶得错位 */
	.page-content .mdy-sd-shell .tab-pane .table-footer .table-pageinfo { margin-bottom: 0 !important; margin-right: 8px !important; }
	.page-content .mdy-sd-shell .tab-pane .table-footer .pagination .page-link { padding: 2px 7px !important; font-size: 12px !important; }
	/* ===== 财务 / 日志 tab：表格转卡片（只手机端，桌面不动） ===== */
	#finance table,
	#settings1 table { display: block; width: 100% !important; border: 0; background: transparent; }
	#finance thead,
	#settings1 thead { display: none !important; }
	#finance tbody,
	#settings1 tbody { display: block; }
	#finance tbody tr,
	#settings1 tbody tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px 10px;
		border: 1px solid #e6e9ef;
		border-radius: 8px;
		padding: 14px 16px;
		margin-bottom: 12px;
		background: #fff;
	}
	#finance tbody td,
	#settings1 tbody td {
		display: block;
		border: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		white-space: normal;
		word-break: break-word;
	}
	/* 财务：首行「时间 + 金额」 */
	#finance tbody td:nth-child(1) { grid-column: 1; grid-row: 1; color: #8a94a6; font-size: 13px; }
	#finance tbody td:nth-child(3) { grid-column: 2; grid-row: 1; text-align: right; font-weight: 600; font-size: 15px; color: #1f2d3d; }
	#finance tbody td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
	#finance tbody td:nth-child(4) { grid-column: 1 / -1; grid-row: 3; }
	#finance tbody td:nth-child(5) { grid-column: 1 / -1; grid-row: 4; }
	#finance tbody td:nth-child(2),
	#finance tbody td:nth-child(4),
	#finance tbody td:nth-child(5) {
		display: flex;
		gap: 10px;
		font-size: 13px;
		color: #3c495c;
	}
	#finance tbody td:nth-child(2)::before { content: "来源"; }
	#finance tbody td:nth-child(4)::before { content: "流水单号"; }
	#finance tbody td:nth-child(5)::before { content: "支付方式"; }
	#finance tbody td:nth-child(n+2)::before { flex: 0 0 64px; color: #8a94a6; }

	/* 日志：首行「时间 + 操作人胶囊」，中间详情，底部 IP */
	#settings1 tbody td:nth-child(1) { grid-column: 1; grid-row: 1; color: #8a94a6; font-size: 13px; }
	#settings1 tbody td:nth-child(3) {
		grid-column: 2;
		grid-row: 1;
		background: #eef2ff !important;
		color: #2f54ea !important;
		border-radius: 999px;
		padding: 2px 10px !important;
		font-size: 12px;
		max-width: 120px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	#settings1 tbody td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; font-size: 14px; line-height: 1.6; color: #1f2d3d; }
	#settings1 tbody td:nth-child(4) {
		grid-column: 1 / -1;
		grid-row: 3;
		display: flex;
		gap: 10px;
		font-size: 13px;
		border-top: 1px dashed #eceef3 !important;
		padding-top: 10px !important;
		color: #3c495c;
	}
	#settings1 tbody td:nth-child(4)::before { content: "IP 地址"; flex: 0 0 auto; color: #8a94a6; }

	/* 图表的时间范围：原来 input 是 block + width:46%，两个框各占一行；
	   改成 flex 一行显示「开始 到 结束」 */
	.page-content .module_chart_date { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
	.page-content .module_chart_date .form-control {
		width: auto !important;
		flex: 1 1 0;
		min-width: 0;
		margin: 0 !important;
	}
	.page-content .module_chart_date > span { flex: 0 0 auto; margin: 0 !important; }
}

/* 「计费信息」搬到右列时套的壳：让左列那套 info-card 样式生效，同时占满整宽 */
.page-content #home1 .mdy-bill-host {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	display: block !important;
}

/* 详情页 tab 栏那条 2px 浅色底线（#f6f6f6）会拉满整行，看着像一条白线；
   激活态自己已经有下划线，这条去掉（只作用于详情页外壳，不影响其它页面 tab） */
.page-content .mdy-sd-shell .nav-tabs,
.page-content .row.bottom-box .nav-tabs { border-bottom: 0 !important; }

/* 手机端：通用表格底栏（消息中心等）——「共 N 条 / 每页 / 页码」同一行且靠左。
   权重比 .mdy-sd-shell .tab-pane .table-footer 那套低，详情页仍走自己的规则 */
@media (max-width: 991.98px) {
	.page-content .table-footer { flex-wrap: wrap; }
	.page-content .table-footer .table-pagination {
		flex-direction: row !important;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		width: 100%;
	}
	.page-content .table-footer .table-pageinfo { margin-bottom: 0 !important; margin-right: 8px !important; }
	.page-content .table-footer .pagination { flex-wrap: nowrap !important; margin: 0; }
}

/* 实名认证/结果页：卡片里那层 .container-fluid 被全站规则染成了 #eff2f7 灰底，
   白卡里套一块灰很难看，去掉（只作用于 .card.ststus-box 内部） */
.page-content .card.ststus-box .container-fluid { background: transparent !important; }

/* 手机端：页脚是 position:absolute 贴在容器底部，原来内容只留 60px 底距、页脚高 61px，
   两者几乎贴身，支付方式一多最下面那张卡就被页脚压住；这里留到 100px 做安全距离 */
@media (max-width: 991.98px) {
	.page-content { padding-bottom: 100px !important; }
}

/* ===== 工单列表：手机端表格转卡片（沿用我们自己的卡片皮肤） ===== */
@media (max-width: 991.98px) {
	.page-content .mdy-ticket-cards { display: block; border: 0; background: transparent; }
	.page-content .mdy-ticket-cards thead { display: none !important; }
	.page-content .mdy-ticket-cards tbody { display: block; }
	.page-content .mdy-ticket-cards tbody tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 6px 10px;
		border: 1px solid #e9ecf2;
		border-radius: 8px;
		padding: 14px 16px;
		margin-bottom: 12px;
		background: #fff;
	}
	.page-content .mdy-ticket-cards tbody td {
		display: block;
		border: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		white-space: normal;
		word-break: break-word;
	}
	/* 标题 + 状态 */
	.page-content .mdy-ticket-cards td:nth-child(2) { grid-column: 1; grid-row: 1; font-size: 14px; font-weight: 600; line-height: 1.5; }
	.page-content .mdy-ticket-cards td:nth-child(2) a { color: #1f2d3d !important; }
	.page-content .mdy-ticket-cards td:nth-child(5) { grid-column: 2; grid-row: 1; }
	.page-content .mdy-ticket-cards td:nth-child(5) .status { border-radius: 4px; font-size: 12px; font-weight: 400; padding: 2px 8px; }
	/* 部门 */
	.page-content .mdy-ticket-cards td:nth-child(1) { grid-column: 1 / -1; grid-row: 2; }
	.page-content .mdy-ticket-cards td:nth-child(1) .badge { background: #f2f4f8 !important; color: #7b8698 !important; font-weight: 400; font-size: 12px; padding: 2px 8px; border-radius: 4px; }
	/* 时间 */
	.page-content .mdy-ticket-cards td:nth-child(3) { grid-column: 1; grid-row: 3; font-size: 12px; color: #8a94a6; }
	.page-content .mdy-ticket-cards td:nth-child(4) { grid-column: 2; grid-row: 3; font-size: 12px; color: #8a94a6; text-align: right; }
	.page-content .mdy-ticket-cards td:nth-child(3)::before { content: "创建 "; }
	.page-content .mdy-ticket-cards td:nth-child(4)::before { content: "更新 "; }
	/* 操作 */
	.page-content .mdy-ticket-cards td:nth-child(6) { grid-column: 1 / -1; grid-row: 4; text-align: right; margin-top: 4px; }
	.page-content .mdy-ticket-cards td:nth-child(6) a {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		border: 1px solid var(--theme-color-3, #0052d9);
		color: var(--theme-color-3, #0052d9) !important;
		border-radius: 4px;
		padding: 4px 12px;
		font-size: 12px;
	}
}

/* 手机端：提交工单的步骤条横向放不下 → 改竖排，箭头转 90° 朝下 */
@media (max-width: 991.98px) {
	.page-content .custom-stepper {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 6px;
	}
	.page-content .custom-stepper .step-item { width: 100%; }
	.page-content .custom-stepper .step-arrow {
		justify-content: flex-start;
		padding-left: 12px;
		height: 14px;
	}
	.page-content .custom-stepper .step-arrow i { transform: rotate(90deg); font-size: 16px; }
}

/* 手机端：输入框组（如「推荐链接」那一条）两端补回 4px 圆角，之前是直角 */
@media (max-width: 991.98px) {
	.page-content .input-group > :first-child,
	.page-content .input-group > :first-child > .input-group-text,
	.page-content .input-group > :first-child.form-control {
		border-top-left-radius: 4px !important;
		border-bottom-left-radius: 4px !important;
	}
	.page-content .input-group > :last-child,
	.page-content .input-group > :last-child > *,
	.page-content .input-group > :last-child.form-control {
		border-top-right-radius: 4px !important;
		border-bottom-right-radius: 4px !important;
	}
}