.imotive-context-locked { background:#f1f5f9 !important; color:#334155 !important; cursor:not-allowed; }
.imotive-vhc-check-row { gap:14px; align-items:flex-start !important; }
.imotive-vhc-check-controls { width:min(520px, 64%); display:grid; grid-template-columns:140px minmax(180px,1fr); gap:8px; }
.imotive-vhc-check-note { min-width:0; width:100% !important; padding:.55rem .7rem !important; }
.imotive-vhc-work-row { border:1px solid #dbe5ef; border-radius:14px; padding:16px; margin-bottom:14px; background:#fff; position:relative; }
.imotive-vhc-repair-media { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.imotive-vhc-file-button { display:inline-flex; align-items:center; padding:8px 12px; border:1px dashed #0ea5e9; border-radius:8px; color:#0284c7; cursor:pointer; font-size:.85rem; font-weight:700; }
.imotive-vhc-file-button input { display:none; }
.imotive-vhc-repair-preview { display:flex; align-items:center; gap:9px; color:#64748b; font-size:.8rem; }
.imotive-vhc-repair-preview img { width:72px; height:54px; object-fit:cover; border-radius:8px; border:1px solid #dbe5ef; }
#inspPhotoPreview { display:grid !important; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:10px; width:100%; }
#inspPhotoPreview figure { margin:0; min-width:0; }
#inspPhotoPreview img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; border:1px solid #dbe5ef; display:block; }
#inspPhotoPreview figcaption { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#64748b; font-size:.72rem; margin-top:4px; }
.imotive-mot-vat-toggle { display:flex; align-items:center; gap:6px; width:100%; color:#92400e; font-size:.78rem; font-weight:700; margin-top:4px; }
.imotive-mot-vat-toggle input { width:auto !important; }
.imotive-labour-ledger-line { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid #f1f5f9; padding:8px 0; align-items:center; }
.imotive-labour-ledger-line > span:last-child { white-space:nowrap; }
.imotive-labour-ledger-line em,.imotive-vat-exempt { display:inline-block; margin-left:7px; padding:2px 6px; border-radius:999px; background:#fff7ed; color:#9a3412; font-size:.7rem; font-style:normal; font-weight:700; }
.imotive-invoice-loading,.imotive-invoice-error { text-align:center; padding:40px; color:#64748b; }
.imotive-workshop-invoice { font-family:Arial,sans-serif; padding:28px; color:#111827; background:#fff; }
.imotive-workshop-invoice header { display:flex; justify-content:space-between; gap:20px; border-bottom:2px solid #111; padding-bottom:20px; margin-bottom:24px; }
.imotive-workshop-invoice header h1,.imotive-workshop-invoice header h2 { margin:0; }
.imotive-workshop-invoice header p { margin:4px 0; }
.imotive-workshop-invoice header > div:last-child { text-align:right; }
.imotive-invoice-parties { display:flex; justify-content:space-between; gap:30px; margin-bottom:28px; }
.imotive-invoice-parties > div:last-child { text-align:right; }
.imotive-invoice-parties span,.imotive-invoice-parties strong { display:block; }
.imotive-invoice-parties span { color:#6b7280; margin-bottom:7px; }
.imotive-invoice-parties p { margin:4px 0; }
.imotive-workshop-invoice table { width:100%; border-collapse:collapse; margin-bottom:26px; }
.imotive-workshop-invoice th,.imotive-workshop-invoice td { padding:11px; border-bottom:1px solid #e5e7eb; text-align:right; vertical-align:top; }
.imotive-workshop-invoice th:first-child,.imotive-workshop-invoice td:first-child { text-align:left; }
.imotive-workshop-invoice td small { display:block; color:#6b7280; margin-top:4px; }
.imotive-invoice-totals { width:min(360px,100%); margin-left:auto; display:grid; gap:7px; }
.imotive-invoice-totals > div { display:flex; justify-content:space-between; gap:20px; padding:4px 0; }
.imotive-invoice-totals .is-total { border-top:2px solid #111; font-size:1.15rem; padding-top:10px; }
.imotive-workshop-invoice footer { margin-top:38px; border-top:1px solid #e5e7eb; padding-top:18px; text-align:center; color:#6b7280; font-size:.85rem; }
@media(max-width:720px){
  .imotive-vhc-check-row { flex-direction:column; }
  .imotive-vhc-check-controls { width:100%; grid-template-columns:1fr; }
  .imotive-labour-ledger-line { align-items:flex-start; flex-direction:column; }
  .imotive-workshop-invoice { padding:16px; }
  .imotive-workshop-invoice header,.imotive-invoice-parties { flex-direction:column; }
  .imotive-workshop-invoice header > div:last-child,.imotive-invoice-parties > div:last-child { text-align:left; }
  .imotive-workshop-invoice { overflow-x:auto; }
  .imotive-workshop-invoice table { min-width:620px; }
}
@media print {
  .imotive-workshop-invoice { padding:0; }
}


/* 5.1.4 VHC integrity and tablet modal corrections */
#inspectionFormModal,
#reportViewModal {
    align-items: flex-start !important;
    justify-content: center !important;
    overflow: hidden !important;
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
}
#inspectionFormModal > .modal-content,
#reportViewModal > .modal-content {
    margin: 0 auto !important;
    max-height: calc(100dvh - max(24px, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}
#inspectionFormModal .modal-header,
#reportViewModal .modal-header {
    flex: 0 0 auto;
    position: relative;
    z-index: 2;
    flex-wrap: wrap;
    gap: 10px;
}
#inspectionFormModal .modal-body,
#reportViewModal .modal-body {
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
#reportViewModal .modal-header > div:last-child {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
@media (max-width: 1024px) {
    #inspectionFormModal,
    #reportViewModal { padding-left: 8px !important; padding-right: 8px !important; }
    #inspectionFormModal > .modal-content,
    #reportViewModal > .modal-content { border-radius: 14px !important; }
    #reportViewModal .modal-header { padding: 12px !important; }
    #reportViewModal .modal-header > div:first-child { width: 100%; }
    #reportViewModal .modal-header > div:last-child { width: 100%; justify-content: flex-start; }
    #reportViewModal .modal-header .btn-primary { flex: 1 1 auto; min-height: 42px; }
    #reportViewModal .modal-body { padding: 14px !important; }
}