:root{
  --bg:#0b0d12;
  --panel:#0f121a;
  --card:#101521;
  --text:#e7eaf3;
  --muted:#9aa3b2;
  --line:#2a3143;
  --danger:#ff4d4d;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:inherit}
.container{max-width:1200px;margin:0 auto;padding:16px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.brand{font-weight:1000;font-size:18px}
#top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.row{display:flex;gap:10px;align-items:center}
.grid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}
.grid2{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}

.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.cardHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.cardTitle{font-weight:1000;font-size:16px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:12px}
.hr{height:1px;background:var(--line);margin:12px 0}

.input{width:100%;background:#0b0f18;border:1px solid var(--line);color:var(--text);border-radius:12px;padding:10px 12px;outline:none}
.textarea{min-height:92px;resize:vertical}
.label{font-size:12px;color:var(--muted);margin-bottom:6px}
.field{display:flex;flex-direction:column;gap:6px}
.small{font-size:12px}
.muted{color:var(--muted)}
.error{margin-top:10px;color:var(--danger);font-weight:800}

.btn{background:#1d4ed8;border:0;color:white;border-radius:12px;padding:10px 12px;font-weight:900;cursor:pointer}
.btn:hover{filter:brightness(1.05)}
.btnGhost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btnDanger{background:var(--danger);color:white}

.badgeRow{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.badge{border:1px solid var(--line);border-radius:999px;padding:6px 10px;font-size:12px;color:var(--muted)}
.cardPhoto{margin-top:10px;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.cardPhoto img{width:100%;height:180px;object-fit:cover;display:block}
.cardPhotoEmpty{margin-top:10px;border-radius:16px;border:1px dashed var(--line);padding:26px;text-align:center;color:var(--muted)}

.modalOverlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:14px;z-index:9999}
.modalOverlay.open{display:flex}
.modal{background:var(--card);border:1px solid var(--line);border-radius:18px;width:min(960px,100%);max-height:90vh;display:flex;flex-direction:column}
.modalHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.modalTitle{font-weight:1000}
.modalBody{padding:12px 14px;overflow:auto}
.modalFooter{display:flex;gap:10px;justify-content:flex-end;padding:12px 14px;border-top:1px solid var(--line)}

.prospectRecapWrap{margin-top:8px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.prospectChip{padding:6px 10px;border-radius:999px;border:1px solid var(--line);font-weight:900;font-size:14px;line-height:1}
.prospectChipOpt{border-color:var(--danger);color:var(--danger)}
.prospectChipNormal{color:var(--text)}

@media (max-width: 720px){
  .container{padding:12px}
  .grid{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .row{flex-wrap:wrap}
  .btn{width:100%}
  .modal{width:100%;max-height:100%;height:100%;border-radius:0}
}
@media (min-width: 721px) and (max-width: 1024px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* --- PATCH v2.2 (photos menu + prospects popup + prix PDF + photo PDF) --- */
.prospectChipClickable{ cursor:pointer; }
.prospectChipClickable:hover{ filter:brightness(1.05); }

.photoViewer{ display:flex; align-items:center; gap:10px; }
.photoFrame{
  flex:1; min-height:260px;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#0b0d12;
}
.photoFrame img{ max-width:100%; max-height:420px; object-fit:contain; display:block; }
.thumbRow{ margin-top:10px; display:flex; gap:8px; flex-wrap:wrap; }
.thumb{
  border:1px solid var(--line);
  background:transparent;
  border-radius:10px;
  padding:0;
  overflow:hidden;
  width:78px; height:60px;
  cursor:pointer;
}
.thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.thumb.active{ border-color:#6ea8ff; }

.pdfThumbRow{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.pdfThumb{
  border:1px solid var(--line);
  background:transparent;
  border-radius:10px;
  padding:0;
  overflow:hidden;
  width:52px; height:40px;
  cursor:pointer;
}
.pdfThumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.pdfThumb.active{ border-color:#6ea8ff; }


/* --- PATCH v2.2.7 (popup prospects lisible + anti écran noir) --- */
.modal .panel{ color:#111; }
.modal .muted, .modal .small{ color:#444; }
.modal .input{ color:#111; background:#fff; }
#appErrorOverlay pre{ font-size:13px; line-height:1.35; }


/* --- PATCH v2.2.8 (clic prospect onglet Prospects ouvre popup) --- */
.prospectTitle{ cursor:pointer; }


/* --- PATCH v2.3 : carte prospect entièrement cliquable --- */
.prospectCard { cursor: pointer; }
.prospectCard button,
.prospectCard textarea,
.prospectCard input,
.prospectCard select { cursor: default; }


/* --- PATCH v2.3.1 : photos plein écran mobile --- */
.photoFrame{
  width: 100%;
  height: 60vh;
  min-height: 240px;
  max-height: 520px;
}
.photoFrame img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Sur petits écrans, on passe les boutons dessous pour éviter d'écraser l'image */
@media (max-width: 520px){
  .photoViewer{ flex-direction: column; align-items: stretch; }
  .photoViewer > .btn.btnGhost{ width: 100%; }
  .photoViewer > .btn.btnGhost#prev{ order: 2; }
  .photoViewer > .photoFrame{ order: 1; }
  .photoViewer > .btn.btnGhost#next{ order: 3; }
}


/* --- PATCH v2.3.2 : boutons transparents sur la photo + swipe --- */
.photoViewer{
  position: relative;
  align-items: stretch;
}
.photoNavBtn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(0,0,0,.35);
  color: #fff;
  border: 1px solid rgba(255,255,255,.22);
  display: grid;
  place-items: center;
  font-size: 26px;
  line-height: 1;
  padding: 0;
  z-index: 5;
  backdrop-filter: blur(6px);
}
.photoNavPrev{ left: 10px; }
.photoNavNext{ right: 10px; }

.photoFrame{ position: relative; }

@media (max-width: 520px){
  .photoNavBtn{ width: 42px; height: 42px; }
  .photoNavPrev{ left: 8px; }
  .photoNavNext{ right: 8px; }
}

@media (max-width: 520px){
  .photoViewer{ flex-direction: row !important; }
}


/* --- PATCH v2.3.4 : boutons sous la photo (swipe conservé) --- */
.photoNavRow{
  display:flex;
  gap:10px;
  justify-content:center;
  margin-top:10px;
  flex-wrap:wrap;
}

.photoNavBtn{ position: static !important; width:auto !important; height:auto !important; background: transparent !important; color: inherit !important; border: 1px solid rgba(0,0,0,.15) !important; backdrop-filter:none !important; }
.photoNavPrev, .photoNavNext{ left:auto !important; right:auto !important; top:auto !important; transform:none !important; }