/* ============================================================
   NAMA ERP — Fleet / Weekly inspection (Area B)
   واجهة السائق موبايل أولاً (أهداف لمس كبيرة) + شاشات المدير (قائمة، تفاصيل، مقارنة، لوحة الالتزام)
   ============================================================ */

/* ---------------- مشترك ---------------- */
.ins-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ins-head h2{margin:0;font-size:20px}
.ins-head .tb-spacer{flex:1}
.ins-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.ins-hint{font-size:12.5px;color:var(--text-dim);margin:6px 0 10px;display:flex;align-items:center;gap:6px;line-height:1.6}
.ins-hint svg{width:16px;height:16px;flex:none}
.ins-hint.warn{color:var(--warn)}
.ins-q{font-weight:800;color:var(--maroon);font-size:16px;margin:16px 0 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ins-q.sm{font-size:13.5px;margin:14px 0 7px}
.ins-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.ins-charts{margin-bottom:16px}
.ins-charts .card{padding:14px 16px}
.ins-tbl{padding:0;overflow:hidden}
.ins-hist{padding:0;overflow:hidden;margin-bottom:16px}

.tone-ok{color:#0F7A3D}
.tone-low{color:#8A6100}
.tone-warn{color:var(--warn)}
.tone-critical{color:var(--danger)}
.tone-neutral{color:var(--text-dim)}

/* ---------------- مبدّل اللغة (بارز فوق شاشة السائق) ---------------- */
.ins-langbar{display:flex;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:6px;margin-bottom:14px;box-shadow:var(--sh-1);overflow-x:auto}
.ins-langbar button{flex:1;min-width:78px;min-height:46px;border:0;border-radius:var(--r-xs);background:transparent;
  color:var(--text-dim);font-weight:800;font-size:15px;cursor:pointer;transition:.18s}
.ins-langbar button:hover{background:var(--maroon-tint);color:var(--maroon)}
.ins-langbar button.on{background:var(--maroon);color:#fff;box-shadow:var(--sh-2)}

/* ---------------- شاشة السائق ---------------- */
.ins-mobile{max-width:760px;margin:0 auto}
.ins-week{display:grid;gap:6px;padding:14px 16px;margin-bottom:16px;border-inline-start:5px solid var(--ok)}
.ins-week.pending{border-inline-start-color:var(--warn)}
.ins-week.late{border-inline-start-color:var(--danger)}
.ins-week .w-k{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px;color:var(--maroon)}
.ins-week .w-k svg{width:19px;height:19px}
.ins-week .w-due{font-size:13.5px;color:var(--text-dim)}
.ins-week .w-note{font-size:14px;font-weight:700}
.ins-week.ok .w-note{color:#0F7A3D}
.ins-week.pending .w-note{color:var(--warn)}
.ins-week.late .w-note{color:var(--danger)}

.ins-vcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-bottom:8px}
.ins-vcard{display:grid;gap:8px;text-align:start;padding:16px;border:1px solid var(--line);cursor:pointer;
  font:inherit;color:inherit;background:var(--card);transition:.18s}
.ins-vcard:hover{box-shadow:var(--raise-hover);transform:translateY(-2px)}
.ins-vcard .vc-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ins-vcard .vc-name{font-weight:800;font-size:16px}
.ins-vcard .vc-plate{font-size:19px;font-weight:800;letter-spacing:.5px;color:var(--maroon)}
.ins-vcard .vc-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:12.5px;color:var(--text-dim)}
.ins-vcard .vc-meta span{display:inline-flex;align-items:center;gap:4px}
.ins-vcard .vc-meta svg{width:15px;height:15px}
.ins-vcard .vc-go{margin-top:4px;justify-content:center;pointer-events:none}
.ins-vcard.st-late{border-color:var(--danger)}
.ins-vcard.st-pending{border-color:var(--warn)}

/* ---------------- المعالج ---------------- */
.ins-steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.ins-steps .s{font-size:12px;font-weight:700;color:var(--muted);background:var(--paper-2);border-radius:99px;padding:5px 11px}
.ins-steps .s.done{color:#0F7A3D;background:var(--ok-bg)}
.ins-steps .s.on{color:#fff;background:var(--maroon)}
.ins-step-of{font-size:12px;color:var(--muted);margin-bottom:10px}
.ins-wz-head{font-size:15px;margin-bottom:12px}
.ins-pane{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--sh-1)}

.ins-big-input{width:100%;min-height:64px;font-size:30px;font-weight:800;text-align:center;direction:ltr;
  border:2px solid var(--line-2);border-radius:var(--r-sm);background:var(--card-2);color:var(--ink);padding:8px 12px}
.ins-big-input:focus{outline:none;border-color:var(--maroon);box-shadow:var(--ring)}
.ins-ta{width:100%;font:inherit;font-size:15px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  padding:11px 13px;background:var(--card-2);color:var(--text);resize:vertical}
.ins-ta:focus{outline:none;border-color:var(--maroon);box-shadow:var(--ring)}

.ins-item{padding:12px 0;border-bottom:1px dashed var(--line)}
.ins-item:last-child{border-bottom:0}
.ins-item .it-label{font-weight:700;font-size:15px;margin-bottom:8px}
.ins-item .it-label .req{color:var(--danger);font-style:normal}
.ins-item .it-seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px}
.ins-item .seg{min-height:56px;border:2px solid var(--line-2);border-radius:var(--r-sm);background:var(--card-2);
  font:inherit;font-size:14px;font-weight:700;color:var(--text-dim);cursor:pointer;padding:8px 6px;transition:.15s}
.ins-item .seg:active{transform:scale(.97)}
.ins-item .seg.on{color:#fff;border-color:transparent;box-shadow:var(--sh-2)}
.ins-item .seg-ok.on,.ins-item .seg-no.on{background:#12A150}
.ins-item .seg-low.on{background:#D9A400}
.ins-item .seg-needs_attention.on,.ins-item .seg-fail.on{background:#E08A00}
.ins-item .seg-critical.on,.ins-item .seg-yes.on{background:var(--danger)}
.ins-item .seg-ok:hover{border-color:#12A150} .ins-item .seg-low:hover{border-color:#D9A400}
.ins-item .seg-needs_attention:hover,.ins-item .seg-fail:hover{border-color:#E08A00}
.ins-item .seg-critical:hover,.ins-item .seg-yes:hover{border-color:var(--danger)}

/* الصور */
.ins-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:6px}
.ins-photo{display:grid;gap:6px;cursor:pointer;text-align:center}
.ins-photo .ph-box{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;overflow:hidden;
  border:2px dashed var(--line-2);border-radius:var(--r-sm);background:var(--card-2);color:var(--muted)}
.ins-photo .ph-box svg{width:38px;height:38px}
.ins-photo .ph-box img{width:100%;height:100%;object-fit:cover}
.ins-photo.has .ph-box{border-style:solid;border-color:#12A150}
.ins-photo .ph-cap{font-size:13.5px;font-weight:700}
.ins-photo .ph-cap .req{color:var(--danger);font-style:normal}
.ins-photo .ph-act{font-size:12px;color:var(--maroon);font-weight:700}
.ins-extra{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:12px}
.ins-extra .btn{justify-content:center;cursor:pointer}

/* الملخّص + المقارنة */
.ins-sum{display:grid;gap:2px}
.ins-sum .sum-row{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 2px;border-bottom:1px dashed var(--line);font-size:14px}
.ins-sum .sum-row:last-child{border-bottom:0}

.ins-cmp{padding:14px 16px}
.ins-cmp .cmp-head{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--text-dim);margin-bottom:10px;flex-wrap:wrap}
.ins-cmp-row{padding:10px 0;border-bottom:1px dashed var(--line)}
.ins-cmp-row:last-child{border-bottom:0}
.ins-cmp-row .cmp-tag{font-weight:800;font-size:13.5px;margin-bottom:6px;color:var(--maroon)}
.ins-cmp-row .cmp-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cmp-cell{display:grid;gap:4px}
.cmp-cell .cmp-lb{font-size:11.5px;color:var(--muted);font-weight:700}
.cmp-cell img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line);cursor:zoom-in}
.cmp-cell .cmp-none{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;border:1px dashed var(--line-2);
  border-radius:var(--r-sm);color:var(--muted);font-size:12px;background:var(--card-2)}
.cmp-flag{margin-top:8px}

.ins-wz-actions{display:grid;grid-template-columns:1fr 2fr;gap:10px;margin-top:16px;position:sticky;bottom:0;
  padding:12px 0;background:linear-gradient(to top,var(--paper) 70%,transparent)}
.ins-wz-actions .btn{justify-content:center}
.btn.big{min-height:54px;font-size:16px;font-weight:800;border-radius:var(--r-sm)}

/* ---------------- تفاصيل الفحص (مدير) ---------------- */
.ins-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding:16px;margin-bottom:14px}
.ins-kv .k{font-size:11.5px;color:var(--muted);font-weight:700;margin-bottom:3px}
.ins-kv .v{font-size:14px;font-weight:700}
.ins-note{padding:14px 16px;margin-bottom:14px}
.ins-note b{color:var(--maroon);font-size:13px}
.ins-note p{margin:6px 0 0;white-space:pre-line;font-size:14px;line-height:1.7}
.ins-note.warn{border-inline-start:4px solid var(--warn)}

.ins-res{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;padding:14px 16px;margin-bottom:14px}
.ins-res .res-cell{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 11px;border-radius:var(--r-xs);background:var(--card-2);border:1px solid var(--line);font-size:13px}
.ins-res .res-cell .r-l{color:var(--text-dim)}
.ins-res .res-cell .r-v{font-weight:800}
.ins-res .res-cell.tone-ok{background:var(--ok-bg);border-color:#BFE9D0}
.ins-res .res-cell.tone-low{background:var(--gold-tint);border-color:var(--gold-soft)}
.ins-res .res-cell.tone-warn{background:var(--warn-bg);border-color:#F3DDAE}
.ins-res .res-cell.tone-critical{background:var(--danger-bg);border-color:#F6C4CD}

.ins-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:14px}
.ins-gallery .g-cell{display:grid;gap:4px;padding:0;border:0;background:transparent;cursor:zoom-in;font:inherit;color:inherit}
.ins-gallery .g-cell img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line)}
.ins-gallery .g-vid{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;border-radius:var(--r-sm);
  background:var(--maroon-ink);color:#fff}
.ins-gallery .g-vid svg{width:34px;height:34px}
.ins-gallery .g-cap{font-size:11.5px;color:var(--text-dim);font-weight:700}

.ins-lb{text-align:center}
.ins-lb img,.ins-lb video{max-width:100%;max-height:66vh;border-radius:var(--r-sm)}
.ins-lb-cap{margin-top:8px;font-size:12.5px;color:var(--text-dim)}
.ins-lb-n{font-size:12.5px;color:var(--text-dim);align-self:center}

/* ---------------- موبايل ---------------- */
@media (max-width:720px){
  .ins-head h2{font-size:18px}
  .ins-stats{grid-template-columns:repeat(2,1fr)}
  .ins-vcards{grid-template-columns:1fr}
  .ins-item .it-seg{grid-template-columns:repeat(2,1fr)}
  .ins-photos{grid-template-columns:repeat(2,1fr)}
  .ins-big-input{font-size:26px;min-height:58px}
  .ins-wz-actions{grid-template-columns:1fr 1.6fr}
  .ins-kv{grid-template-columns:repeat(2,1fr)}
  .ins-res{grid-template-columns:1fr}
  .ins-toolbar .select,.ins-toolbar .search{flex:1;min-width:130px;max-width:none}
}