/* ==========================================================================
   ImmoDem V2 : présentation de la certification « Bien visité par ImmoDem »
   Partagée par le site public (cartes, fiche annonce) et l'espace agence.
   ========================================================================== */
:root{ --cert:#0f7a4a; --cert-ink:#0b5a37; --cert-tint:#e7f4ec; --cert-line:#bfe0cc; --cert-gold:#c99a2e; }

/* Rosette : sceau dessiné en SVG, couleur pilotée par currentColor */
.cert-rosette{ display:inline-block; flex:none; color:var(--cert); }
.cert-rosette svg{ display:block; width:100%; height:100%; }

/* Badge en ligne : liste des annonces, fiche, aperçu */
.cert-badge{ display:inline-flex; align-items:center; gap:.4rem; padding:.22rem .6rem .22rem .3rem; border-radius:999px; background:var(--cert-tint); color:var(--cert-ink); border:1px solid var(--cert-line); font-size:.76rem; font-weight:600; line-height:1.2; white-space:nowrap; }
.cert-badge .cert-rosette{ width:18px; height:18px; }
.cert-badge .cert-sub{ font-weight:500; color:var(--cert); opacity:.85; }
.cert-badge.is-warn{ background:#fdf3e1; color:#7a4e09; border-color:#f0d39b; }
.cert-badge.is-warn .cert-rosette, .cert-badge.is-warn .cert-sub{ color:#a86c0d; }
.cert-badge.is-off{ background:#f1efeb; color:#6a6a6f; border-color:#dedad2; }
.cert-badge.is-off .cert-rosette, .cert-badge.is-off .cert-sub{ color:#9a978f; }
.cert-badge.is-lg{ font-size:.86rem; padding:.32rem .8rem .32rem .38rem; }
.cert-badge.is-lg .cert-rosette{ width:22px; height:22px; }

/* Sceau posé sur la photo des cartes d'annonce */
.cert-seal{ position:absolute; left:12px; bottom:12px; z-index:2; display:inline-flex; align-items:center; gap:.4rem; padding:.28rem .7rem .28rem .32rem; border-radius:999px; background:rgba(255,255,255,.96); color:var(--cert-ink); font-size:.76rem; font-weight:700; box-shadow:0 4px 14px rgba(15,40,25,.18); }
.cert-seal .cert-rosette{ width:20px; height:20px; }

/* Panneau détaillé de certification */
.cert-panel{ position:relative; display:grid; grid-template-columns:88px minmax(0,1fr); gap:20px; padding:22px 24px; border-radius:18px; background:linear-gradient(135deg, #f3faf6 0%, #ffffff 60%); border:1px solid var(--cert-line); overflow:hidden; }
.cert-panel::after{ content:""; position:absolute; right:-40px; top:-40px; width:160px; height:160px; border-radius:50%; border:22px solid rgba(15,122,74,.05); pointer-events:none; }
.cert-medal{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.cert-medal .cert-rosette{ width:76px; height:76px; filter:drop-shadow(0 6px 12px rgba(15,122,74,.25)); }
.cert-medal .cert-year{ font-size:.7rem; font-weight:700; letter-spacing:.08em; color:var(--cert); text-transform:uppercase; }
.cert-kicker{ font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--cert); }
.cert-panel h3{ font-size:1.15rem; margin:4px 0 6px; color:#16181d; }
.cert-lede{ font-size:.9rem; color:#3d3d42; line-height:1.6; max-width:640px; }
.cert-checks{ list-style:none; padding:0; margin:14px 0 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 22px; }
.cert-checks li{ display:flex; gap:10px; align-items:flex-start; font-size:.86rem; line-height:1.45; }
.cert-checks li i{ flex:none; width:20px; height:20px; border-radius:50%; background:var(--cert); color:#fff; display:grid; place-items:center; font-size:.62rem; margin-top:1px; }
.cert-checks li b{ display:block; font-size:.86rem; color:#16181d; }
.cert-checks li span{ color:#6a6a6f; font-size:.8rem; }
.cert-reserve{ margin-top:14px; padding:10px 12px; border-radius:10px; background:#fdf6e6; color:#6b4a0e; font-size:.84rem; line-height:1.5; }
.cert-reserve i{ color:var(--cert-gold); margin-right:4px; }
.cert-meta{ display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:16px; padding-top:14px; border-top:1px dashed var(--cert-line); font-size:.8rem; color:#6a6a6f; }
.cert-meta b{ color:#16181d; font-weight:600; }
.cert-links{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; font-size:.82rem; }
.cert-links a, .cert-links button{ color:var(--cert-ink); font-weight:600; text-decoration:none; background:none; border:0; padding:0; cursor:pointer; font:inherit; font-size:.82rem; }
.cert-links a:hover, .cert-links button:hover{ text-decoration:underline; }
.cert-state{ display:flex; align-items:center; gap:10px; margin:0 0 14px; padding:10px 12px; border-radius:10px; font-size:.85rem; line-height:1.45; }
.cert-state.is-warn{ background:#fdf3e1; color:#6b4a0e; }
.cert-state.is-off{ background:#f1efeb; color:#4a4a4f; }
.cert-state.is-info{ background:#e8f0fb; color:#23385c; }
.cert-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }

/* Panneau d'invitation quand le bien n'est pas certifié (espace agence) */
.cert-empty{ display:grid; grid-template-columns:56px minmax(0,1fr); gap:16px; align-items:center; padding:18px 20px; border-radius:16px; border:1px dashed #dedad2; background:#faf8f4; }
.cert-empty .cert-rosette{ width:52px; height:52px; color:#c9c4b8; }
.cert-empty b{ display:block; font-size:.95rem; margin-bottom:2px; }
.cert-empty p{ font-size:.85rem; color:#6a6a6f; line-height:1.5; }

@media (max-width:640px){
  .cert-panel{ grid-template-columns:1fr; padding:18px; }
  .cert-medal{ flex-direction:row; }
  .cert-medal .cert-rosette{ width:56px; height:56px; }
  .cert-checks{ grid-template-columns:1fr; }
}

/* Fiche publique et espace agence : intégration */
.d-cert{ margin:28px 0 36px; }
.ag-verified{ color:#0a66c2; font-weight:600; white-space:nowrap; }
.ag-verified i{ font-size:.8em; }
.mt-cert{ margin-top:6px; }
.ann-prev-media .cert-seal{ left:12px; bottom:12px; top:auto; }
.cert-sec-h{ font-size:.95rem; font-weight:700; margin:22px 0 10px; }
.cert-state .cert-rosette{ width:22px; height:22px; }
