/* Dinamik popup için CSS — statik newsletter-pop1..5 davranışını ZORLA korur.
   Bazı tema CSS'leri .newsletter-popup üzerine width:100% basabiliyor, bu
   yüzden mfp-content içinde açıkça max-width override'ları yapıyoruz. */

/* MP wrapper davranışı — popup ortalı ve içerikten genişlemesin */
.mfp-content { display: inline-block !important; max-width: 95vw; margin: 0 auto; }

/* Tip 1: Sol bg image + sağ content (Demo 1) */
.mfp-content .newsletter-pop1 {
  display: flex !important;
  max-width: 72rem !important;
  width: 100%;
  min-height: 460px;
  background-position: 60% center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 1rem;
}
.mfp-content .newsletter-pop1 .newsletter-content {
  margin-left: auto;
  max-width: 41.4rem;
  padding: 7.1rem 4.2rem 5rem;
}

/* Tip 2: Üst figure + alt content (Demo 3) */
.mfp-content .newsletter-pop2 {
  display: block !important;
  max-width: 50rem !important;
  width: 100%;
  border-radius: 1rem;
  overflow: hidden;
}
.mfp-content .newsletter-pop2 > figure { margin: 0; }
.mfp-content .newsletter-pop2 > figure img { width: 100%; display: block; border-radius: 1rem 1rem 0 0; }
.mfp-content .newsletter-pop2 .newsletter-content { padding: 0 2rem 2.5rem; }

/* Tip 3: Sadece content (Demo 9) */
.mfp-content .newsletter-pop3 {
  display: block !important;
  max-width: 54rem !important;
  width: 100%;
  padding: 5.4rem 4rem 2.8rem;
  border-radius: 1rem;
}

/* Tip 4: Yuvarlak overlay (Demo 28) */
.mfp-content .newsletter-pop4 {
  position: relative;
  border-radius: 100% !important;
  width: 580px !important;
  height: 580px;
  max-width: 90vw !important;
  max-height: 90vw;
  background-size: cover;
  background-position: center;
}
.mfp-content .newsletter-pop4::before {
  position: absolute; content: ''; inset: 0;
  border-radius: 100%; background-color: rgba(25,25,25,.62);
}
.mfp-content .newsletter-pop4 .newsletter-content {
  position: relative; z-index: 2; padding: 0 4rem; color: #fff; text-align: center;
}

/* Tip 5: Sol figure + absolute content (Demo 32) */
.mfp-content .newsletter-pop5 {
  position: relative;
  display: block !important;
  max-width: 50rem !important;
  width: 100%;
  border-radius: 1rem;
  overflow: hidden;
}
.mfp-content .newsletter-pop5 > figure { margin: 0; }
.mfp-content .newsletter-pop5 > figure img {
  width: 100%; min-height: 57rem; object-fit: cover; display: block;
}
.mfp-content .newsletter-pop5 .newsletter-content {
  position: absolute; top: 51%; left: 50%; transform: translateX(-50%);
  max-width: 100%; width: 80%; text-align: center;
}

/* Ek butonlar (kullanıcı tanımlı 0-2 buton) */
.popup-buttons { margin-top: 1rem; display: flex; gap: .5rem; flex-wrap: wrap; justify-content: center; }
.popup-buttons .btn { padding: .6rem 1.4rem; }

/* Video iframe wrapper'ı */
.popup-media-video { margin: 0; }
.popup-media-video iframe { width: 100%; aspect-ratio: 16/9; display: block; border: 0; min-height: 280px; }

/* HTML mod fallback resim genişliği */
.newsletter-popup img { max-width: 100%; height: auto; }

/* Kesim stilleri (tip 1/2/5'te .newsletter-pop*/} */
.mfp-content .newsletter-popup.popup-divider-oval-horizontal .newsletter-content { border-radius: 0 50% 50% 0/0 100% 100% 0; }
.mfp-content .newsletter-popup.popup-divider-oval-vertical .newsletter-content { border-radius: 50% 50% 0 0/100% 100% 0 0; }
.mfp-content .newsletter-popup.popup-divider-wave > figure { clip-path: polygon(0 0,100% 0,100% 90%,0 100%); }

/* Mobil/tablet */
@media (max-width: 767px) {
  .mfp-content .newsletter-pop1 { min-height: 0; }
  .mfp-content .newsletter-pop1 .newsletter-content { max-width: 36rem; padding: 3rem 2rem; margin: 0 auto; }
}
@media (max-width: 575px) {
  .mfp-content .newsletter-pop1 { background-image: none !important; }
}
