.ic-form-root{max-width:900px;margin:16px auto;padding:0 12px}
.ic-loading{padding:14px;background:#fff;border:1px solid #e5e7eb;border-radius:12px}
.ic-error{padding:14px;background:#fee2e2;border:1px solid #fecaca;border-radius:12px;color:#991b1b}
.ic-form{display:block}
.ic-section{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:12px;margin:12px 0}
.ic-section h3{margin:0 0 10px}
.ic-field{margin:10px 0}
/* Only the field title label (direct child). Avoid affecting option labels. */
.ic-field > label{display:block;margin:0 0 6px;font-weight:600}

/* Apply full width only to text-like inputs. Checkbox/Radio must remain native size. */
.ic-field select,
.ic-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.ic-field textarea{
  width:100%;
  padding:10px;
  border:1px solid #e5e7eb;
  border-radius:10px;
}
.ic-btn{margin-top:10px;padding:10px 12px;border:0;border-radius:10px;background:var(--inspecto-primary,var(--ic-green-dark,#16a34a));color:#fff;font-weight:700;cursor:pointer}
.ic-output{margin-top:10px;background:#0b1220;color:#e5e7eb;border-radius:12px;padding:10px;overflow:auto}


/* ==============================
   Inspecto Form (MVP)
================================= */
.ic-form { display:block; max-width: 980px; margin: 0 auto; }
.ic-form .ic-card { margin:16px 0; padding:16px; border:1px solid #e5e7eb; border-radius:14px; background:#fff; }
.ic-form .ic-title { font-size: 18px; font-weight: 700; margin-bottom: 10px; }
.ic-form .ic-muted { color:#6b7280; font-size: 13px; }
.ic-form .ic-h1 { font-size: 22px; font-weight: 800; }
.ic-form .ic-form-head { display:flex; justify-content: space-between; gap:12px; align-items:center; margin-bottom: 14px; }
.ic-form .ic-form-body { display:block; }
.ic-form .ic-fields { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ic-form .ic-field { display:block; }
.ic-form .ic-field > label { display:block; font-weight:600; margin-bottom:6px; }
.ic-form input[type="text"], .ic-form select, .ic-form textarea { width:100%; padding:10px 12px; border:1px solid #d1d5db; border-radius:10px; }
.ic-form textarea { min-height: 90px; }
.ic-form .ic-options { display:flex; flex-wrap:wrap; gap:10px; }
.ic-form .ic-opt { display:flex; gap:8px; align-items:center; padding:8px 10px; border:1px solid #e5e7eb; border-radius:999px; }
.ic-form .ic-btn { display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid var(--inspecto-primary,var(--ic-green-dark,#16a34a)); background:var(--inspecto-primary,var(--ic-green-dark,#16a34a)); color:#fff; cursor:pointer; text-decoration:none; }
.ic-form .ic-form-foot { display:flex; gap:10px; align-items:center; margin-top: 14px; }
.ic-form .ic-req { color:#dc2626; font-weight:700; margin-left:6px; }
.ic-preview img { width:100%; max-height: 220px; object-fit: cover; border-radius: 12px; border:1px solid #e5e7eb; margin-top:10px; }

@media (max-width: 780px) {
  .ic-form .ic-fields { grid-template-columns: 1fr; }
  .ic-form .ic-form-head { flex-direction: column; align-items: flex-start; }
}

/* Body map */
.ic-bodymap { grid-column: 1 / -1; }
.ic-bodymap-canvas { position: relative; height: 360px; border:1px solid #e5e7eb; border-radius: 14px; background: linear-gradient(180deg, #f8fafc, #fff); overflow:hidden; }
.ic-bodymap-canvas:before {
  content:"";
  position:absolute; inset: 18% 18% 18% 18%;
  border:2px dashed #cbd5e1;
  border-radius: 22px;
}
.ic-point {
  position:absolute;
  transform: translate(-50%,-50%);
  width: 28px; height: 28px;
  border-radius: 999px;
  border:1px solid #111827;
  background:#fff;
  font-size: 22px;
  line-height: 22px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.ic-point[data-status="pass"] { background:#dcfce7; border-color:#16a34a; }
.ic-point[data-status="weak"] { background:#ffedd5; border-color:#f97316; }
.ic-point[data-status="fail"] { background:#fee2e2; border-color:#dc2626; }
.ic-point[data-status="na"] { background:#e5e7eb; border-color:#6b7280; }
.ic-bodymap-legend { margin-top: 10px; display:flex; gap:10px; flex-wrap:wrap; }
.ic-chip { display:inline-flex; padding:6px 10px; border:1px solid #e5e7eb; border-radius:999px; font-size: 12px; }
/* ===== Inspecto Form + Report Polish ===== */
.ic-wrap, .ic-report-wrap{
  max-width: 1100px;
  margin: 18px auto;
  padding: 14px;
}

.ic-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  padding: 16px;
  margin-bottom: 14px;
}

.ic-title{
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 10px 0;
}

.ic-subtitle{
  font-size: 13px;
  opacity: .75;
  margin: 0;
}

.ic-grid{
  display: grid;
  gap: 12px;
}
.ic-grid.cols-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.ic-grid.cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }

@media (max-width: 820px){
  .ic-grid.cols-2, .ic-grid.cols-3{ grid-template-columns: 1fr; }
}

.ic-field > label{
  font-weight: 600;
  display: block;
  margin-bottom: 6px;
}
.ic-field input[type="text"],
.ic-field input[type="number"],
.ic-field textarea,
.ic-field select{
  width: 100%;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 10px;
  padding: 10px 12px;
  outline: none;
}
.ic-field input:focus,
.ic-field textarea:focus,
.ic-field select:focus{
  border-color: rgba(0,0,0,.35);
}

.ic-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 12px;
  border: 0;
  cursor: pointer;
  font-weight: 700;
}
.ic-btn.primary{ background: var(--inspecto-primary,var(--ic-green-dark,#16a34a)); color: #fff; }
.ic-btn.secondary{ background: #F3F4F6; color: #111827; }

.ic-badge{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  background:#F3F4F6;
  font-weight:700;
  font-size:12px;
}

.ic-photo-grid img{
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.08);
}

/* Print friendly */
@media print{
  .ic-btn, .ic-actions, .ic-nav{ display:none !important; }
  .ic-card{ box-shadow:none; }
}



/* ===== Admin Forms UI ===== */
.ic-forms-toolbar{
  display:flex;
  gap:10px;
  margin: 16px 0;
}
.ic-forms-toolbar .ic-filter{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background:#fff;
  text-decoration:none;
  font-weight:700;
  color:#111827;
}
.ic-forms-toolbar .ic-filter .count{
  font-weight:800;
  opacity:.7;
}
.ic-forms-toolbar .ic-filter.is-active{
  border-color: rgba(34,197,94,.35);
  box-shadow: 0 0 0 3px rgba(34,197,94,.12);
}
.ic-pill{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight:800;
  font-size: 12px;
}
.ic-pill-green{ background: rgba(34,197,94,.12); color:#166534; border:1px solid rgba(34,197,94,.25); }
.ic-pill-gray{ background: rgba(107,114,128,.12); color:#374151; border:1px solid rgba(107,114,128,.25); }
.ic-forms-table .ic-actions .button{ margin-right: 6px; }
.ic-col-actions{ width: 260px; }

/* === IC MOBILE CENTER + STOP HORIZONTAL PAN (ZAID PATCH) === */
html, body {
  max-width: 100% !important;
  /* `overflow-x:hidden` chupke se ek scroll-container bana deta hai, aur us
     ke andar `position:sticky` viewport ke bajaye USI dabbe se chipakti hai
     — dabba poore content jitna lamba hai, is liye kuchh chipakta hi nahi
     tha (form ki sticky nav bar isi wajah se scroll ho kar gayab ho jati).
     `clip` wahi horizontal clamp deta hai magar scroll-container nahi banata.
     Pehli line purane browsers ke liye fallback hai. */
  overflow-x: hidden !important;
  overflow-x: clip !important;
}

.ic-wrap,
.ic-form-wrap,
.ic-public-form,
.ic-container,
.ic-report-wrap,
.ic-report-container,
.ic-main,
.ic-page,
.ic-root {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  /* clip, hidden nahi — warna ye wrappers scroll-container ban kar apne
     andar ki sticky cheezein bekaar kar dete hain (ooper wali wazahat). */
  overflow-x: hidden !important;
  overflow-x: clip !important;
}

.ic-wrap input,
.ic-wrap select,
.ic-wrap textarea,
.ic-wrap .ic-field,
.ic-wrap .ic-row,
.ic-wrap .ic-col,
.ic-wrap .ic-dropzone,
.ic-wrap .ic-uploader,
.ic-wrap img,
.ic-wrap svg {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {
  .ic-wrap, .ic-form-wrap, .ic-public-form, .ic-container, .ic-report-wrap {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}