/* Styles for paradista modal (optimized & scoped)
   - consolidated duplicates, local variables, minimal !important usage
*/

.paradista-modal-content {
  /* local tokens */
  --pm-photo-w: 75vw;
  --pm-photo-max: 640px;
  --pm-close-size: 2.1rem;
  --pm-close-icon: 1.4rem;
  --pm-close-bg: rgba(255,255,255,0.22);
  --pm-close-border: rgba(255,255,255,0.38);
  background: transparent;
  border: none;
  box-shadow: none;
  position: relative;
}

.paradista-modal-body {
  min-height: 60vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:0.5rem;
}

.paradista-modal-photo{
  width:var(--pm-photo-w);
  height:var(--pm-photo-w);
  max-width:var(--pm-photo-max);
  max-height:var(--pm-photo-max);
  border-radius:50%;
  object-fit:cover;
  margin-inline:auto;
  box-shadow:0 6px 22px rgba(0,0,0,0.25);
  display:block;
}

.paradista-modal-name{ font-size:1.6rem; font-weight:800; color:#fff; text-align:center; text-shadow:0 1px 2px rgba(0,0,0,0.45); margin:0 0 .25rem 0; max-width:92%; }
.paradista-modal-parada{ font-size:1.15rem; font-weight:700; color:rgba(255,255,255,0.9); text-align:center; max-width:92%; margin:0; padding:.05rem 0 1rem 0; }

.paradista-modal-actions{ margin-top:1.25rem; gap:2rem !important; display:flex; justify-content:center; align-items:center; flex-wrap:nowrap; }
.paradista-modal-actions .btn{ min-width:110px; }
.paradista-modal-actions > a { margin-inline: .35rem; }

.paradista-contact-large{ width:4rem !important; height:4rem !important; border-radius:50% !important; display:inline-flex !important; align-items:center; justify-content:center; padding:0 !important; font-size:1.4rem; background:rgba(255,255,255,0.18) !important; border:1px solid rgba(255,255,255,0.26) !important; color:#fff !important; box-shadow:0 8px 20px rgba(0,0,0,0.32); transition:transform .12s ease; }
.paradista-contact-large i{ line-height:1; }
.paradista-contact-large:hover{ transform:scale(1.04); }
.paradista-contact-large:focus{ outline:3px solid rgba(255,255,255,0.12); outline-offset:3px; }

/* Page-scoped overrides (keep specificity minimal) */
body.parada-page .paradista-modal-actions, body.productes-page .paradista-modal-actions{ gap:2rem; }
body.parada-page .paradista-contact-large, body.productes-page .paradista-contact-large{ width:4rem !important; height:4rem !important; font-size:1.4rem !important; }

.modal-backdrop.show{ background-color:rgba(0,0,0,0.75) !important; opacity:1 !important; }

@media (min-width:768px){ .paradista-modal-body{ min-height:50vh; } }

/* Trigger link visuals kept neutral */
.paradista-open{ color:inherit; text-decoration:none; }
.paradista-open:hover,.paradista-open:focus{ text-decoration:none; color:inherit; }
.paradista-open:focus{ outline:none !important; box-shadow:none !important; }

/* Ensure modal overlays sticky navbar */
body.productes-page .modal, body.parada-page .modal, .modal.show{ position:fixed !important; z-index:99999 !important; }
body.productes-page .modal-backdrop, body.parada-page .modal-backdrop, .modal-backdrop.show{ z-index:99990 !important; }

/* Close button (compact, no effects). Use local vars and embedded SVG for crisp white X */
.paradista-close{
  position:absolute;
  top:calc(8px - 1cm);
  right:12px;
  width:var(--pm-close-size);
  height:var(--pm-close-size);
  display:inline-flex; align-items:center; justify-content:center; padding:0;
  background:var(--pm-close-bg) !important;
  border:1px solid var(--pm-close-border) !important;
  color:#fff !important; font-size:0.95rem; border-radius:50% !important; z-index:60;
  transition:none !important; transform:none !important; box-shadow:0 6px 18px rgba(0,0,0,0.28);
  isolation:isolate !important; opacity:1 !important; mix-blend-mode:normal !important;
}
.paradista-close i{ display:none; }
.paradista-close:focus{ outline:3px solid rgba(255,255,255,0.12); outline-offset:3px; }

.paradista-close::before{
  content:""; display:inline-block; width:var(--pm-close-icon); height:var(--pm-close-icon); background-repeat:no-repeat; background-position:center; background-size:68% 68%;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><line x1='4' y1='4' x2='20' y2='20' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round'/><line x1='20' y1='4' x2='4' y2='20' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round'/></svg>");
  mix-blend-mode:normal !important; opacity:1 !important; filter:none !important;
}

@media (max-width:480px){ .paradista-close{ top:calc(6px - 1cm); right:12px; width:1.9rem; height:1.9rem; font-size:0.9rem; } }