/* ============================================================
   设备履历卡 - 样式(移动优先,电脑端双栏)
   配色沿用 ROI:#4a90d9 主色 / #f5f6f8 背景 / #2c3e50 文字
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',sans-serif;background:#f5f6f8;color:#2c3e50;font-size:14px;line-height:1.5;-webkit-text-size-adjust:100%}
a{color:#4a90d9;text-decoration:none}

/* ---------- 顶栏 ---------- */
.eq-header{background:#fff;border-bottom:2px solid #e8ecf0;padding:10px 14px;display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:50}
.eq-header img.logo{height:34px;width:auto;display:block;flex-shrink:0}
.eq-title{font-size:15px;font-weight:600;color:#1a2332;white-space:nowrap}
.eq-title span{color:#4a90d9}
.eq-header-right{margin-left:auto;display:flex;align-items:center;gap:8px;flex-shrink:0}
.eq-user{font-size:12px;color:#718096;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool-switch{font-size:12px;padding:5px 10px;border:1px solid #d1d9e0;border-radius:6px;color:#4a5568;background:#fff;white-space:nowrap}
.tool-switch:hover{border-color:#4a90d9;color:#4a90d9}

/* ---------- 按钮 ---------- */
.btn{padding:9px 14px;border:1px solid #d1d9e0;border-radius:8px;background:#fff;color:#4a5568;font-size:13.5px;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:42px;transition:all .15s}
.btn:hover{border-color:#4a90d9;color:#4a90d9;background:#f0f7ff}
.btn-primary{background:#4a90d9;color:#fff;border-color:#4a90d9}
.btn-primary:hover{background:#3a7bc8;border-color:#3a7bc8;color:#fff}
.btn-danger{color:#c53030;border-color:#f0c0c0}
.btn-danger:hover{background:#fff5f5;border-color:#e24b4a;color:#c53030}
.btn-sm{padding:5px 10px;min-height:32px;font-size:12.5px;border-radius:6px}
.btn-block{width:100%}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* ---------- 只读横幅 ---------- */
.ro-banner{display:none;background:#e6f1fb;color:#185fa5;font-size:12.5px;padding:8px 14px;border-bottom:1px solid #cfe3f7}
.ro-banner.show{display:block}

/* ---------- 主体布局 ---------- */
.eq-main{max-width:1180px;margin:0 auto;padding:12px 12px 90px}
.view{display:none}
.view.show{display:block}

/* ---------- 工具条 ---------- */
.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.toolbar input[type=text],.toolbar select{flex:1 1 140px;min-width:0;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;background:#fff;color:#2c3e50;min-height:42px}
.toolbar input[type=text]:focus,.toolbar select:focus{outline:none;border-color:#4a90d9;box-shadow:0 0 0 2px rgba(74,144,217,.12)}

/* ---------- 设备卡 ---------- */
.eq-list{display:flex;flex-direction:column;gap:8px}
.eq-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:12px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;transition:all .15s}
.eq-card:active{background:#f8fbff}
.eq-card:hover{border-color:#4a90d9}
.eq-card.active{border-color:#4a90d9;background:#f0f7ff}
.eq-card-main{flex:1;min-width:0}
.eq-card-name{font-size:14px;font-weight:500;color:#2d3748;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.eq-card-sub{font-size:12px;color:#a0aec0;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eq-card-stat{text-align:right;flex-shrink:0}
.eq-card-cost{font-size:14px;font-weight:600;color:#2d3748}
.eq-card-cost-label{font-size:11px;color:#a0aec0}
.st{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:400}
.st-active{background:#eaf3de;color:#3b6d11}
.st-idle{background:#faeeda;color:#854f0b}
.st-scrapped{background:#f1efe8;color:#5f5e5a}

/* ---------- 详情 ---------- */
.detail-head{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:14px;margin-bottom:10px}
.detail-title{font-size:17px;font-weight:600;color:#1a2332;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.detail-meta{font-size:12.5px;color:#718096;margin-top:6px;line-height:1.8}
.detail-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
.stat-box{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:10px 12px}
.stat-label{font-size:11.5px;color:#a0aec0}
.stat-value{font-size:17px;font-weight:600;color:#2d3748;margin-top:2px}

/* ---------- 时间轴 ---------- */
.sec-title{font-size:13px;color:#718096;margin:14px 2px 8px;display:flex;align-items:center;justify-content:space-between}
.mini-act{font-size:12.5px;color:#4a90d9;cursor:pointer;user-select:none}
.mini-act:hover{text-decoration:underline}
.timeline{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:6px 14px}
.tl-item{padding:12px 0;border-bottom:1px solid #f0f3f6;display:flex;gap:10px}
.tl-item:last-child{border-bottom:none}
.tl-dot{width:4px;border-radius:2px;flex-shrink:0;background:#e2e8f0}
.tl-dot.fault{background:#e24b4a}
.tl-dot.maintain{background:#4a90d9}
.tl-dot.overhaul{background:#d85a30}
.tl-dot.modify{background:#7f77dd}
.tl-dot.inspect{background:#1d9e75}
.tl-body{flex:1;min-width:0}
.tl-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tl-date{font-size:12.5px;color:#718096}
.tl-type{font-size:11px;padding:1px 7px;border-radius:4px;background:#f0f4f8;color:#4a5568}
.tl-symptom{font-size:14px;color:#2d3748;margin-top:3px;word-break:break-word}
.tl-sub{font-size:12px;color:#a0aec0;margin-top:3px;word-break:break-word}
/* 进度回应 */
.tl-update{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;font-size:12.5px;color:#3d4a5a;background:#f5f8fc;border-left:3px solid #a9c9ea;border-radius:0 6px 6px 0;padding:5px 9px;margin:5px 0 0}
.tl-update-at{font-size:11px;color:#8fa0b3;white-space:nowrap}
.tl-update-by{font-size:11.5px;color:#185fa5;white-space:nowrap;font-weight:600}
.tl-update-text{flex:1;min-width:120px;line-height:1.5;word-break:break-word}
.tl-money{font-size:13px;color:#2d3748;font-weight:600;margin-top:4px}

/* ---------- 表单 ---------- */
.form-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:14px;margin-bottom:10px}
.form-row{margin-bottom:12px}
.form-row:last-child{margin-bottom:0}
.form-row label{display:block;font-size:12.5px;color:#718096;margin-bottom:5px}
.form-row input,.form-row select,.form-row textarea{width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;color:#2c3e50;background:#fff;min-height:44px}
.form-row textarea{min-height:76px;resize:vertical;line-height:1.5}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{outline:none;border-color:#4a90d9;box-shadow:0 0 0 2px rgba(74,144,217,.12)}
.form-row input:disabled,.form-row select:disabled,.form-row textarea:disabled{background:#f0f4f8;color:#a0aec0}
.form-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.req::after{content:' *';color:#e24b4a}
.hint{font-size:11.5px;color:#a0aec0;margin-top:4px}

/* 分段/折叠 */
.fold{background:#fff;border:1px solid #e2e8f0;border-radius:10px;margin-bottom:10px;overflow:hidden}
.fold-head{padding:12px 14px;font-size:13.5px;color:#2d3748;font-weight:500;display:flex;align-items:center;justify-content:space-between;cursor:pointer;background:#fff}
.fold-head .arrow{font-size:11px;color:#a0aec0}
.fold-body{padding:0 14px 14px;display:none}
.fold.open .fold-body{display:block}
.fold.open{border-color:#cfe3f7}

/* 快捷标签 */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chip{font-size:12px;padding:5px 10px;border:1px solid #e2e8f0;border-radius:999px;background:#f8fafc;color:#4a5568;cursor:pointer}
.chip:hover{border-color:#4a90d9;color:#4a90d9}

/* 备件卡片行(手机上不用表格) */
.part-row{border:1px solid #e2e8f0;border-radius:8px;padding:10px;margin-bottom:8px;background:#fafbfc}
.part-row .part-line{display:flex;gap:8px;margin-bottom:8px}
.part-row .part-line:last-child{margin-bottom:0}
.part-row input{flex:1;min-width:0;padding:9px 10px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:inherit;min-height:42px}
.part-del{flex-shrink:0;width:42px;border:1px solid #f0c0c0;border-radius:6px;background:#fff;color:#c53030;cursor:pointer;font-size:14px}
.part-total-line{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#f0f7ff;border:1px solid #cfe3f7;border-radius:8px;font-size:13.5px;margin-top:4px}
.part-total-line b{font-size:15px;color:#185fa5}

/* ---------- 底部固定操作条(手机) ---------- */
.bottom-bar{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.97);border-top:1px solid #e2e8f0;padding:9px 12px;display:flex;gap:8px;z-index:60;box-shadow:0 -2px 10px rgba(0,0,0,.05)}
.bottom-bar .btn{flex:1}
.bottom-bar .btn-primary{flex:2}

/* ---------- 二维码标签 ---------- */
.label-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.labels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.label-card{border:1px dashed #a0aec0;border-radius:8px;padding:10px;background:#fff;display:flex;align-items:center;gap:10px;min-height:88px}
.label-qr{flex-shrink:0}
.label-qr svg{width:64px;height:64px;display:block}
.label-info{min-width:0}
.label-name{font-size:12.5px;font-weight:600;color:#2d3748;word-break:break-word}
.label-code{font-size:11.5px;color:#718096;margin-top:2px;font-family:monospace}

/* ---------- 空态 / 提示 ---------- */
.empty{background:#fff;border:1px dashed #d1d9e0;border-radius:10px;padding:36px 16px;text-align:center;color:#a0aec0;font-size:13.5px}
.toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);background:rgba(45,55,72,.95);color:#fff;font-size:13px;padding:10px 16px;border-radius:8px;z-index:200;opacity:0;pointer-events:none;transition:opacity .2s;max-width:88vw;text-align:center}
.toast.show{opacity:1}

/* ---------- 电脑端 ---------- */
@media(min-width:900px){
  .eq-header{padding:12px 24px}
  .eq-header img.logo{height:44px}
  .eq-title{font-size:17px}
  .eq-main{padding:18px 24px 40px}
  .toolbar{flex-wrap:nowrap}
  .view-list-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px;align-items:start}
  .eq-list{position:sticky;top:76px;max-height:calc(100vh - 110px);overflow-y:auto;padding-right:4px}
  .stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .labels{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bottom-bar{position:static;background:transparent;border:none;box-shadow:none;padding:0;margin-top:12px;justify-content:flex-end}
  .bottom-bar .btn{flex:0 0 auto;min-width:120px}
  .bottom-bar .btn-primary{flex:0 0 auto}
  .form-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .part-row .part-line{display:grid;grid-template-columns:2fr 1.4fr 0.8fr 1fr 42px;align-items:center}
}

/* ---------- 打印:只输出标签 ---------- */
@media print{
  .eq-header,.ro-banner,.toolbar,.bottom-bar,.label-toolbar,.detail-actions,.toast{display:none!important}
  body{background:#fff}
  .eq-main{max-width:none;padding:0}
  .view{display:none!important}
  .view.show{display:block!important}
  .labels{display:block}
  .label-card{page-break-inside:avoid;border:1px solid #999;margin:0 0 6mm 0;width:60mm;height:40mm;padding:3mm;display:flex;align-items:center;gap:3mm;border-radius:2mm}
  .label-qr svg{width:28mm;height:28mm}
  .label-name{font-size:10pt}
  .label-code{font-size:8pt}
}

/* ===== 四档角色:设备管理员 / 维修人 / 报修人 / 只读 ===== */
.role-chip{font-size:11px;padding:2px 8px;border-radius:999px;background:#f0f4f8;color:#4a5568;margin-left:4px;white-space:nowrap}
.role-admin{background:#e6f1fb;color:#185fa5}
.role-repairer{background:#eaf3de;color:#3b6d11}
.role-reporter{background:#faeeda;color:#854f0b}
.role-view{background:#f1efe8;color:#5f5e5a}
body:not(.is-manage) .manage-only{display:none}
body:not(.is-manage) .view-list-wrap{display:block}
.cat-chip{font-size:11px;padding:2px 8px;border-radius:4px;background:#f7fafc;color:#718096;border:1px solid #e2e8f0}
.st-open{background:#faeeda;color:#854f0b}
.stat-value.warn{color:#b7791f}
.tl-dot.open{background:#d69e2e}
.tl-type.tl-open{background:#faeeda;color:#854f0b}
.tl-type.tl-replied{background:#e8f1fb;color:#185fa5}
.tl-type.tl-todo{background:#fdecec;color:#a32d2d}
.btn.active{border-color:#4a90d9;background:#eaf3fb;color:#185fa5}
.tl-type.tl-delay{background:#fcebeb;color:#a32d2d}
.tl-act{font-size:12px;color:#4a90d9;cursor:pointer;margin-right:12px;font-weight:500}
.tl-act.danger{color:#c53030}
.notice{background:#fff;border:1px dashed #d1d9e0;border-radius:10px;padding:16px;color:#718096;font-size:13px;line-height:1.7;margin-top:10px}
.scan-box{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:48px 20px;text-align:center;margin-top:16px}
.scan-icon{font-size:34px;color:#4a90d9}
.scan-title{font-size:16px;font-weight:600;margin-top:10px;color:#1a2332}
.scan-sub{font-size:13px;color:#718096;margin-top:8px;line-height:1.8}
.report-info{background:#f0f7ff;border:1px solid #cfe3f7;border-radius:8px;padding:10px 12px;margin-bottom:12px}
.report-info-text{font-size:13px;color:#185fa5}

/* ===== 切换工具下拉 ===== */
.tool-menu{position:relative;flex-shrink:0}
.tool-menu-list{display:none;position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:176px;padding:5px;z-index:120}
.tool-menu-list.show{display:block}
.tool-menu-list a{display:block;padding:10px 12px;border-radius:6px;font-size:13px;color:#2d3748;text-decoration:none;white-space:nowrap}
.tool-menu-list a:hover{background:#f0f7ff;color:#4a90d9}
.tool-menu-list a.cur{color:#a0aec0;cursor:default;background:#fafbfc}
@media(max-width:430px){.eq-user{display:none}}

/* ===== 工单时间轴:报修 → 完成 成对 ===== */
.tl-flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-bottom:5px}
.tl-flow-item{display:flex;align-items:baseline;gap:6px;background:#f7fafc;border:1px solid #eef1f4;border-radius:6px;padding:3px 9px}
.tl-flow-item.done{background:#f0f9f3;border-color:#d7ecdf}
.tl-flow-item.open{background:#fffaf0;border-color:#f5e3c0}
.tl-flow-label{font-size:11px;color:#a0aec0;white-space:nowrap}
.tl-flow-date{font-size:12.5px;color:#2d3748;font-weight:500;white-space:nowrap}
.tl-flow-date.muted{color:#c0c8d0;font-weight:400}
.tl-flow-by{font-size:11.5px;color:#718096;white-space:nowrap}
.tl-arrow{color:#cbd5e0;font-size:13px;flex-shrink:0}
.tl-no{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;letter-spacing:.3px;color:#185fa5;background:#e6f1fb;border:1px solid #cfe3f7;border-radius:4px;padding:2px 6px;white-space:nowrap}
@keyframes tlHit{0%,100%{background:transparent}15%,70%{background:#fdf6e3}}
.tl-hit{border-radius:8px;animation:tlHit 2.6s ease-out}

/* ===== 下拉内分隔线 ===== */
.tool-menu-sep{height:1px;background:#eef1f4;margin:4px 6px}

/* ===== 四档角色可见性 ===== */
body.is-reporter .list-only,body.is-view .list-only{display:none}
body:not(.is-admin) .admin-only{display:none}
body.is-admin .for-repairer{display:none}
.role-view{background:#f1efe8;color:#5f5e5a}

/* ===== 报修人:我的车间 ===== */
.mine-wrap{max-width:760px;margin:0 auto}
.mine-generic{border-color:#f0d9ae;background:#fffdf7}
.mine-generic:hover{border-color:#d9a441}
.mine-generic .eq-card-name{color:#854f0b}
.mine-generic .eq-card-sub{color:#b08a52}
.mine-back{font-size:12.5px;color:#4a90d9;cursor:pointer;margin-bottom:8px;display:inline-block}
.mine-back:hover{text-decoration:underline}

/* ===== 列表按设备类别分组 ===== */
.eq-group{display:flex;align-items:center;gap:7px;padding:9px 11px;margin:2px 0 0;background:#f7fafc;border:1px solid #e6edf3;border-radius:8px;cursor:pointer;user-select:none;transition:all .12s}
.eq-group:hover{background:#eef6ff;border-color:#cfe3f7}
.eq-group.open{background:#eef6ff;border-color:#cfe3f7;border-bottom-left-radius:0;border-bottom-right-radius:0}
.eq-group-arrow{font-size:10px;color:#8fa0b3;width:10px;flex-shrink:0}
.eq-group-name{font-size:13px;font-weight:600;color:#2d3748;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eq-group-meta{margin-left:auto;font-size:11.5px;color:#a0aec0;white-space:nowrap}
.eq-group-open{color:#b7791f;font-weight:600}
.eq-card-sub-item{margin-left:10px;border-left:2px solid #e6edf3;border-top-left-radius:2px;border-bottom-left-radius:2px}

/* ===== 时间轴:按月查看 ===== */
.tl-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 8px}
.tl-filter select{padding:8px 11px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;font-family:inherit;color:#2c3e50;background:#fff;min-height:38px}
.tl-filter select:focus{outline:none;border-color:#4a90d9;box-shadow:0 0 0 2px rgba(74,144,217,.12)}
.tl-filter-cnt{font-size:12px;color:#a0aec0;white-space:nowrap}
.tl-carry{color:#b7791f;font-weight:600}
/* 汇总视图里的设备名标签(可点进设备) */
.tl-type.tl-dev{background:#eef4fb;color:#185fa5;border:1px solid #d6e4f5;cursor:pointer}
.tl-type.tl-dev:hover{background:#dceafa}
.tl-filter input[type=text]{flex:1 1 200px;min-width:0;padding:8px 11px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;font-family:inherit;color:#2c3e50;background:#fff;min-height:38px}
.tl-filter input:focus{outline:none;border-color:#4a90d9;box-shadow:0 0 0 2px rgba(74,144,217,.12)}
.tl-more{text-align:center;margin-top:10px}


