/* ImmoScan V3.2 — import d'annonce et photos. Uniquement les variables du Design C. */

#importCard.li-collapsed .li-body { display: none; }
.li-body { margin-top: var(--s3); }

.li-form { display: flex; flex-direction: column; gap: var(--s3); }
.li-label { font-size: 12.5px; color: var(--ink-3); }
.li-inline { display: flex; gap: var(--s2); flex-wrap: wrap; align-items: center; }
.li-inline input[type=url] { flex: 1 1 320px; min-width: 220px; }
.li-step { font-size: 12.5px; color: var(--ink-3); font-style: italic; }
.li-note { font-size: 12.5px; color: var(--ink-3); margin: 0; }
.li-error, .li-warn {
  border-left: 3px solid var(--bronze); background: var(--warn-bg);
  padding: var(--s3) var(--s4); border-radius: 0 var(--r-sm) var(--r-sm) 0; font-size: 13px;
}
.li-done { font-size: 12.5px; color: var(--ink-3); border-top: 1px solid var(--line); padding-top: var(--s3); }
.li-paste { border: 1px solid var(--line); border-radius: var(--r-sm); padding: var(--s3) var(--s4); background: var(--surface-2); }
.li-paste > summary { cursor: pointer; font-size: 12.5px; color: var(--brand-deep); }
.li-paste textarea { width: 100%; margin: var(--s3) 0; font-family: inherit; font-size: 12.5px; }

/* ---------- écran de validation ---------- */
.li-panel { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface-2); padding: var(--s4); }
.li-panel-hd { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s3); }
.li-panel-hd h3 { font-family: 'Fraunces', Georgia, serif; font-size: 16px; margin: 0; }
.li-row { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr); gap: var(--s2) var(--s4);
  align-items: center; padding: 7px 0; border-bottom: 1px dotted var(--line); }
@media (max-width: 720px) { .li-row { grid-template-columns: 1fr; } }
.li-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin: 0; }
.li-check input { width: 16px; height: 16px; accent-color: var(--brand); }
.li-value { display: flex; align-items: center; gap: 8px; }
.li-value input, .li-value select { max-width: 200px; }
.li-unit { font-size: 12px; color: var(--ink-3); }
.li-flag { font-size: 11px; padding: 1px 8px; border-radius: var(--r-pill); background: var(--warn-bg);
  border: 1px solid var(--warn-line); color: var(--warn); }
.li-conflict { grid-column: 1 / -1; font-size: 12px; color: var(--ink-3); }
.li-missing { font-size: 12.5px; color: var(--ink-3); margin-top: var(--s3); }
.li-actions { display: flex; gap: var(--s2); margin-top: var(--s4); flex-wrap: wrap; }

/* ---------- galeries ---------- */
.li-photos { margin-top: var(--s4); border-top: 1px solid var(--line); padding-top: var(--s3); }
.li-photos-hd { display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s3); }
.li-photo-actions { display: flex; gap: var(--s2); margin-left: auto; }
.li-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--s3); }
.li-thumb { margin: 0; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; background: var(--sand); }
.li-thumb.is-main { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; }
.li-thumb img { display: block; width: 100%; height: 104px; object-fit: cover; background: var(--sand); cursor: zoom-in; }
.li-thumb img.li-broken { display: none; }
.li-thumb.li-unavailable::before {
  content: "Photo source indisponible"; display: flex; align-items: center; justify-content: center;
  height: 104px; font-size: 11.5px; color: var(--ink-3); background: var(--sand); text-align: center; padding: 0 8px;
}
.li-thumb figcaption { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 6px 8px; font-size: 11.5px; color: var(--ink-3); background: var(--surface); }
.li-thumb figcaption label { display: flex; align-items: center; gap: 4px; margin: 0; }
.li-thumb figcaption input { width: 14px; height: 14px; accent-color: var(--brand); }
.li-main-btn { background: none; border: 0; padding: 0; margin-left: auto; cursor: pointer;
  font: inherit; font-size: 11.5px; color: var(--brand-deep); }

/* ---------- espace photos du projet ---------- */
.li-space { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--sh); padding: var(--s6); margin-bottom: var(--s4); }
.li-space-hd { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3);
  flex-wrap: wrap; margin-bottom: var(--s4); }
.li-space-hd h3 { font-family: 'Fraunces', Georgia, serif; font-size: 17px; margin: 0; }
.li-main-photo { position: relative; border: 1px solid var(--line); border-radius: var(--r-sm);
  overflow: hidden; margin-bottom: var(--s3); background: var(--sand); }
.li-main-photo img { display: block; width: 100%; max-height: 320px; object-fit: cover; }
.li-main-photo .li-cap { position: absolute; left: 10px; bottom: 10px; font-size: 11.5px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 2px 10px; }
.li-grid-space .li-thumb img { height: 88px; }

.li-lightbox { position: fixed; inset: 0; background: rgba(29, 27, 23, .82); display: none;
  align-items: center; justify-content: center; z-index: 200; padding: 24px; }
.li-lightbox.open { display: flex; }
.li-lightbox img { max-width: 92vw; max-height: 88vh; border-radius: var(--r-sm); box-shadow: var(--sh-2); }

/* ---------- dossier bancaire ---------- */
@media print {
  .li-cover { margin: 0 0 10px; }
  .li-cover img { width: 100%; height: 150px; object-fit: cover; border-radius: 4px; }
  .li-report-main img { width: 100%; height: 190px; object-fit: cover; border-radius: 4px; }
  .li-report-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 6px; }
  .li-report-grid img { width: 100%; height: 86px; object-fit: cover; border-radius: 4px; }
}
.li-cover img, .li-report-main img { width: 100%; height: 170px; object-fit: cover; border-radius: 4px; }
.li-report-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 6px; }
.li-report-grid img { width: 100%; height: 86px; object-fit: cover; border-radius: 4px; }

.li-main-photo.li-unavailable::before {
  content: "Photo source indisponible"; display: flex; align-items: center; justify-content: center;
  height: 160px; font-size: 12px; color: var(--ink-3); background: var(--sand);
}

/* ---------- import depuis l'extension navigateur ---------- */
.li-ext { border-top: 1px solid var(--line); margin-top: var(--s3); padding-top: var(--s3); }
.li-ext-hd { display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap; margin-bottom: 4px; }
.li-ext-hd b { font-size: 13.5px; }
.li-ext-status { font-size: 11.5px; padding: 2px 9px; border-radius: var(--r-pill);
  border: 1px solid var(--line-2); background: var(--surface-2); color: var(--ink-3); }
.li-ext-status.on { background: var(--pos-bg); border-color: var(--pos-line); color: var(--pos); }
.li-steps { margin: 4px 0 8px 18px; padding: 0; font-size: 12.5px; color: var(--ink-3); }
.li-steps li { margin: 2px 0; }
.li-ext code { font-size: 11.5px; background: var(--sand); padding: 1px 5px; border-radius: 4px; }
