/* 中标通 · 网页版 —— 新增功能样式（会员/客服/工单/提示）+ 手机端适配
   与 app.css 并存：base.html 里在 app.css 之后再引本文件，可覆盖默认样式。 */

/* ---------- 提示条 ---------- */
.alert{max-width:1080px;margin:0 auto 12px;padding:10px 14px;border-radius:8px;
  background:#eaf3ff;border:1px solid #bcd8ff;color:#1f4e8c;font-size:14px}
.alert.ok{background:#eafaf0;border-color:#b7e3c6;color:#1c6b3c}
.alert.warn{background:#fff8e8;border-color:#f2d9a0;color:#8a5a00}
.tag-mem{color:#1F6FEB}

/* ---------- 小按钮 ---------- */
.btn.tiny{padding:3px 8px;font-size:12px;line-height:1.4;border-radius:6px}
.btn.danger{background:#fff1f0;border-color:#ffc9c4;color:#c0392b}
.btn.danger:hover{background:#ffe4e1}

/* ---------- 客服悬浮按钮 + 弹窗 ---------- */
.support-fab{position:fixed;right:18px;bottom:22px;z-index:60;
  padding:10px 16px;border:0;border-radius:22px;cursor:pointer;
  background:#1F6FEB;color:#fff;font-size:14px;box-shadow:0 6px 18px rgba(31,111,235,.35)}
.support-fab:hover{background:#1a5fce}
.support-modal .box{max-width:480px}
.support-modal .kv{grid-template-columns:78px 1fr}
.support-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.support-line b{font-size:15px}
textarea{width:100%;min-height:88px;padding:8px 10px;border:1px solid #cfd8e3;border-radius:8px;
  font-family:inherit;font-size:14px;resize:vertical;background:#fff}
textarea:focus{outline:none;border-color:#1F6FEB;box-shadow:0 0 0 3px rgba(31,111,235,.12)}

/* ---------- 会员套餐 ---------- */
.plans{display:flex;gap:16px;flex-wrap:wrap;align-items:stretch}
.plan{flex:1 1 260px;border:1px solid #e2e8f0;border-radius:12px;padding:16px 18px;background:#fff;
  display:flex;flex-direction:column}
.plan.best{border-color:#1F6FEB;box-shadow:0 8px 22px rgba(31,111,235,.14);position:relative}
.plan.best:before{content:"最划算";position:absolute;top:-11px;left:16px;background:#1F6FEB;color:#fff;
  font-size:12px;padding:2px 10px;border-radius:10px}
.plan h4{margin:0 0 6px;font-size:16px}
.plan .price{font-size:26px;font-weight:700;color:#1F6FEB}
.plan .price small{font-size:13px;color:#8a97a8;font-weight:400;margin-left:4px}
.plan ul{margin:12px 0 16px;padding-left:18px;line-height:1.9;font-size:13.5px;color:#3b4a5a}
.plan .foot{margin-top:auto}

/* ---------- 工单 ---------- */
.tk{border:1px solid #e6ecf3;border-radius:10px;padding:12px 14px;margin-bottom:12px;background:#fff}
.tk .head{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.tk .sub{font-size:12.5px;color:#7b8794}
.tk .body{margin:8px 0;white-space:pre-wrap;line-height:1.7}
.tk .done{border-left:3px solid #34a853}
.tk .done .body{background:#f7fbf8;border-radius:8px;padding:8px 10px}

/* ---------- 常用卡片/表格微调 ---------- */
.card .row{gap:8px;flex-wrap:wrap}
.stat{display:flex;gap:18px;flex-wrap:wrap}
.hint-mobile{display:none;color:#8a97a8;font-size:12.5px;margin:6px 0}

/* ---------- 手机端 ---------- */
@media (max-width: 860px){
  body{font-size:15px}
  .wrap{padding:10px 12px 90px}
  .topbar{padding:10px 12px}
  .topbar nav{gap:10px;flex-wrap:wrap;row-gap:6px}
  .topbar .brand{font-size:15px}
  .topbar .who{display:none}
  .card{padding:12px 12px;margin-bottom:12px;border-radius:10px}
  .card h3{font-size:16px}
  .row > .field{flex:1 1 100%}
  .kv{grid-template-columns:88px 1fr}
  .tablebox{max-height:none !important}
  table th,table td{padding:7px 8px;font-size:13px;white-space:nowrap}
  .hint-mobile{display:block}
  .plans{flex-direction:column}
  .support-fab{right:12px;bottom:12px;padding:9px 14px}
  .support-modal .box{width:calc(100vw - 24px);max-height:88vh;overflow:auto}
  .modal .box{width:calc(100vw - 20px)}
  .btn{padding:7px 12px}
}