/* Poster details — shared by the full page (Home/Poster) and the wall popup */
.detail{padding:2rem 0 3rem;position:relative;}
.detail-card{position:relative;background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 10px 30px rgba(0,0,0,.18);}
.detail-poster{border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.18);}
.detail-poster img{width:100%;display:block;}
.detail-back{color:#fff;font-size:.9rem;display:inline-flex;align-items:center;gap:.35rem;margin-bottom:1rem;}
.detail-back:hover{color:#fff;text-decoration:underline;}
.detail-card h1{font-weight:800;font-size:1.8rem;margin-bottom:.35rem;}
.detail-title{display:flex;align-items:center;gap:.85rem;margin-bottom:.35rem;}
.detail-title h1{margin-bottom:0;}
.detail-logo{width:56px;height:56px;flex-shrink:0;object-fit:contain;background:#fff;border:1px solid #e4e4e7;border-radius:10px;padding:4px;}

/* ---------- Poster detail page: a normal page, not a dialog ----------
   No dimmed overlay or floating card: flat sections and a clear way back to the wall. */
.poster-page .detail-back{
  color:#161616;font-weight:600;
  background:#fff;border:1px solid #e4e4e7;border-radius:999px;
  padding:.4rem .95rem;margin-bottom:1.25rem;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.poster-page .detail-back:hover{background:#e21f26;border-color:#e21f26;color:#fff;text-decoration:none;}
.poster-page .detail-card{border-radius:8px;box-shadow:none;border:1px solid #e4e4e7;}
.poster-page .detail-poster{border-radius:8px;box-shadow:none;border:1px solid #e4e4e7;}
.detail-close{
  position:absolute;top:.9rem;right:.9rem;
  width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#f4f4f5;color:#161616;border:1px solid #e4e4e7;
  transition:background .2s ease,color .2s ease;
}
.detail-close:hover,.detail-close:focus-visible{background:#e21f26;border-color:#e21f26;color:#fff;}
.detail-crumb{color:#6b6b6f;font-size:.85rem;margin-bottom:1rem;}
.detail-crumb .sep{margin:0 .35rem;}
.detail-keyword{display:inline-block;background:#f4f4f5;border-radius:999px;padding:.15rem .7rem;font-size:.78rem;margin:0 .3rem .3rem 0;}
.detail-desc{white-space:pre-line;line-height:1.6;margin:1rem 0;}
.detail-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.25rem 0;}
.detail-actions a{border-radius:6px;padding:.55rem 1rem;font-size:.85rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem;}
.act-call{background:#e21f26;color:#fff;}
.act-call:hover{background:#b8161c;color:#fff;}
.act-wa{background:#25d366;color:#fff;}
.act-wa:hover{background:#1da851;color:#fff;}
.act-outline{border:1px solid #161616;color:#161616;}
.act-outline:hover{background:#161616;color:#fff;}
.detail-section{border-top:1px solid #e4e4e7;padding-top:1rem;margin-top:1rem;}
.detail-section h2{font-size:1rem;font-weight:700;margin-bottom:.6rem;}
.detail-section dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;font-size:.9rem;}
.detail-section dt{color:#6b6b6f;font-weight:500;}
.detail-section dd{margin:0;white-space:pre-line;word-break:break-word;}
.detail-socials{display:flex;flex-direction:column;gap:.3rem;font-size:.9rem;word-break:break-all;}
.detail-socials a{color:#e21f26;}

/* ---------- Wall cards: show the whole uploaded image ----------
   Cards are 3:4, but uploads can be any shape (wide banners, square logos).
   The image is fitted inside the card instead of cropped, and a blurred,
   enlarged copy of it fills the leftover space. 3:4 posters fill the card as before. */
.poster-art.has-img::before{
  content:"";
  position:absolute;inset:-12%;
  background:var(--poster-img) center/cover no-repeat;
  filter:blur(14px) brightness(.8);
}
.poster-art.has-img img{
  position:relative;z-index:1;
  object-fit:contain;
  object-position:center;
}

/* ---------- Wall popup ----------
   One white panel holding both the poster image and the details. */
.poster-modal .modal-content{
  background:#fff;border:none;border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
}
.poster-modal .modal-body{padding:1.75rem;}
.poster-modal .detail-card{padding:0;border-radius:0;box-shadow:none;}
.poster-modal .detail-close{top:0;right:0;}
.poster-modal .detail-poster{box-shadow:none;border:1px solid #e4e4e7;border-radius:10px;}
.poster-modal-status{padding:3rem 1.5rem;text-align:center;}
.poster-modal-status .spinner-border{color:#e21f26;}
.poster-modal-status a{color:#e21f26;}
@media (max-width:767.98px){
  .poster-modal .modal-body{padding:1.25rem;}
  .poster-modal .detail-poster{max-width:360px;margin:0 auto;}
}