/* Page Immobilier, côté client : avancement du dossier, vérifications publiées, échanges avec l'équipe.
   Même langage que les cartes « aurore » : une lumière de la couleur du sens, un contour fin, jamais de barre sur le côté.
   Jetons du design system seulement. */

.immo-suivi { --suivi-bord: rgba(94, 83, 152, .18); max-width: 1000px; margin: 0 auto var(--space-xxl); display: grid; gap: var(--space-lg); }
.immo-suivi [data-ton="rose"]    { --t: #c0203f; --tf: #fdeef2; --tb: rgba(210, 38, 79, .32); }
.immo-suivi [data-ton="ambre"]   { --t: #94590a; --tf: #fbf3e6; --tb: rgba(176, 112, 11, .34); }
.immo-suivi [data-ton="vert"]    { --t: #0d705c; --tf: #e9f6f3; --tb: rgba(18, 135, 111, .34); }
.immo-suivi [data-ton="violet"]  { --t: #4d4285; --tf: #f0eefb; --tb: rgba(94, 83, 152, .32); }
.immo-suivi [data-ton="lavande"] { --t: #655b82; --tf: #f3f0f9; --tb: rgba(120, 108, 150, .32); }

.immo-reserve { margin: 0 0 var(--space-md); padding: 14px 18px; border-radius: 16px; font-size: 15px; line-height: 1.55; color: #4d4285; background: var(--action-tint); box-shadow: inset 0 0 0 1.5px rgba(94, 83, 152, .3); }
.immo-reserve a { font-weight: 600; color: var(--brand-3); }
.immo-actif__ref { margin: -4px 0 var(--space-sm); font-size: 13px; letter-spacing: .3px; color: rgba(255, 255, 255, .72); }

/* Avancement */
.immo-etapes { list-style: none; margin: 0; padding: 18px 22px; display: flex; border-radius: 22px; background: #fff; box-shadow: 0 0 0 1px var(--suivi-bord), 0 18px 36px -28px rgba(45, 33, 92, .5); }
.immo-etape { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; position: relative; text-align: center; }
.immo-etape + .immo-etape::before { content: ""; position: absolute; top: 16px; right: 50%; width: 100%; height: 3px; border-radius: 3px; background: rgba(94, 83, 152, .18); }
.immo-etape--fait + .immo-etape::before, .immo-etape--fait + .immo-etape--courant::before { background: var(--brand-5); }
.immo-etape__rond { position: relative; z-index: 1; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; font-weight: 700; color: #655b82; background: #fff; box-shadow: inset 0 0 0 2px rgba(94, 83, 152, .3); }
.immo-etape--fait .immo-etape__rond { color: #fff; background: var(--brand-5); box-shadow: none; }
.immo-etape--courant .immo-etape__rond { color: #fff; background: linear-gradient(135deg, var(--brand-3), var(--brand-5)); box-shadow: 0 0 0 5px rgba(115, 111, 182, .22); }
.immo-etape__nom { font-size: 13.5px; font-weight: 600; color: #4a4170; }

/* Ce qui se passe maintenant */
.immo-situation { padding: 18px 22px; border-radius: 22px; color: var(--t); background: radial-gradient(110% 130% at 0% 0%, color-mix(in srgb, var(--t) 12%, transparent), transparent 62%), var(--tf); box-shadow: inset 0 0 0 1.5px var(--tb); }
.immo-situation strong { display: block; font-family: var(--font-display); font-size: 18px; color: var(--brand-1); }
.immo-situation p { margin: 6px 0 0; font-size: 15px; line-height: 1.6; color: #3a3162; }

.immo-suivi__grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); align-items: start; }
.immo-suivi__bloc { padding: 22px; border-radius: 24px; background: radial-gradient(110% 80% at 0% 0%, rgba(196, 170, 255, .16), transparent 60%), #fff; box-shadow: 0 0 0 1px var(--suivi-bord), 0 22px 42px -30px rgba(45, 33, 92, .55); }
.immo-suivi__titre { margin: 0 0 var(--space-md); font-family: var(--font-display); font-size: 17px; font-weight: 600; color: var(--brand-1); }
.immo-vide { margin: 0; padding: 18px; border-radius: 16px; font-size: 14.5px; line-height: 1.6; color: #4a4170; border: 1.5px dashed rgba(94, 83, 152, .3); }

/* Vérifications */
.immo-constat { margin-bottom: 12px; padding: 16px 18px; border-radius: 20px; background: radial-gradient(110% 120% at 0% 0%, color-mix(in srgb, var(--t) 12%, transparent), transparent 60%), #fff; box-shadow: inset 0 0 0 1.5px var(--tb); }
.immo-constat header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 6px; }
.immo-constat__type { font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #655b82; }
.immo-constat time { margin-left: auto; font-size: 12.5px; color: #655b82; }
.immo-constat h4 { margin: 0 0 6px; font-size: 16px; line-height: 1.35; color: var(--brand-1); }
.immo-constat p { margin: 0 0 8px; font-size: 14.5px; line-height: 1.6; color: #3a3162; overflow-wrap: anywhere; }
.immo-constat__sources { font-size: 13px !important; color: #655b82 !important; }
.immo-constat__vu { font-size: 13px !important; font-weight: 600; color: #0d705c !important; }
.immo-badge { display: inline-flex; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--t); background: var(--tf); box-shadow: inset 0 0 0 1px var(--tb); }

/* Échanges */
.immo-echanges { display: flex; flex-direction: column; gap: 10px; max-height: 360px; overflow-y: auto; padding: 4px 2px; }
.immo-bulle { max-width: 88%; padding: 11px 15px; border-radius: 18px; }
.immo-bulle p { margin: 0; font-size: 14.5px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.immo-bulle span { display: block; margin-top: 5px; font-size: 11.5px; opacity: .75; }
.immo-bulle--equipe { align-self: flex-start; background: #f3f0fc; color: #2d215c; border-bottom-left-radius: 5px; }
.immo-bulle--moi { align-self: flex-end; color: #fff; background: linear-gradient(135deg, var(--brand-3), var(--brand-5)); border-bottom-right-radius: 5px; }
.immo-reponse { margin-top: var(--space-md); display: grid; gap: 10px; }
.immo-reponse textarea { width: 100%; min-height: 84px; padding: 12px 14px; border: 0; border-radius: 16px; font: inherit; font-size: 15px; line-height: 1.5; resize: vertical; background: #fff; box-shadow: inset 0 0 0 1.5px rgba(94, 83, 152, .3); }
.immo-reponse textarea:focus { outline: none; box-shadow: inset 0 0 0 2px var(--action-focus); }
.immo-bouton { justify-self: start; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; border: 0; border-radius: 999px; font: inherit; font-size: 14.5px; font-weight: 600; color: #fff; cursor: pointer; background: linear-gradient(135deg, var(--brand-3), var(--brand-5)); box-shadow: 0 12px 22px -14px rgba(66, 55, 122, .9); }
.immo-bouton:disabled { opacity: .6; cursor: progress; }
.immo-bouton--discret { min-height: 38px; padding: 0 16px; color: var(--brand-3); background: #fff; box-shadow: inset 0 0 0 1.5px rgba(94, 83, 152, .35); }
.immo-bouton:focus-visible { outline: 2px solid var(--action-focus); outline-offset: 2px; }

.immo-suivi__info { border-radius: 18px; background: #fff; box-shadow: 0 0 0 1px var(--suivi-bord); }
.immo-suivi__info summary { padding: 15px 20px; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--brand-3); }
.immo-suivi__info ul { margin: 0; padding: 0 22px 18px 40px; display: grid; gap: 8px; font-size: 14.5px; line-height: 1.6; color: #3a3162; }

@media (max-width: 860px) {
  .immo-suivi__grille { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .immo-etapes { padding: 14px 8px; }
  .immo-etape__nom { font-size: 11.5px; }
  .immo-suivi__bloc { padding: 18px 16px; }
  .immo-bulle { max-width: 94%; }
  .immo-constat time { margin-left: 0; width: 100%; }
}