/* ==========================================================================
   Sayfa popup'ları (assets/js/popup.js) — bağımsız, Bootstrap'a dayanmaz.
   Sınıflar 'vpop-' önekli: sitenin diğer stilleriyle çakışmasın.
   ========================================================================== */
.vpop-perde {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(12, 14, 20, 0.62);
  opacity: 0;
  transition: opacity .22s ease;
}
.vpop-perde.acik { opacity: 1; }

/* Köşe konumları: perdesiz, sayfayı kilitlemez, tıklamayı engellemez */
.vpop-perde.vpop-perdesiz {
  inset: auto;
  padding: 0;
  background: transparent;
  pointer-events: none;
}
.vpop-perdesiz .vpop-kutu { pointer-events: auto; position: fixed; }
.vpop-sol-alt { left: 20px;  bottom: 20px; }
.vpop-sag-alt { right: 20px; bottom: 20px; }
.vpop-sol-ust { left: 20px;  top: 20px; }
.vpop-sag-ust { right: 20px; top: 20px; }

.vpop-kutu {
  position: relative;
  max-width: 92vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
  overflow: hidden;
  transform: translateY(12px) scale(.98);
  transition: transform .22s ease;
  outline: none;
}
.vpop-perde.acik .vpop-kutu { transform: none; }

.vpop-govde {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.vpop-gorsel,
.vpop-video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 86vh;
  object-fit: contain;
}
.vpop-gorsel-link { display: block; line-height: 0; }

/* Medyalı popup: çerçeve medyayı sarar — boşluk, zemin, ek alan yok */
.vpop-kutu.vpop-medyali {
  background: transparent;
  border-radius: 12px;
  line-height: 0;
}
.vpop-medyali .vpop-govde { overflow: hidden; border-radius: 12px; }
.vpop-medyali .vpop-gorsel,
.vpop-medyali .vpop-video { border-radius: 12px; }

.vpop-icerik {
  padding: 16px 20px;
  font-size: 14px;
  line-height: 1.6;
  color: #374151;
}
.vpop-icerik > :last-child { margin-bottom: 0; }
.vpop-icerik a { color: #BA8A7A; text-decoration: underline; }

.vpop-alt {
  flex-shrink: 0;
  padding: 12px 20px 16px;
  border-top: 1px solid #eef0f3;
  text-align: center;
}
.vpop-ayrinti {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 22px;
  border-radius: 8px;
  background: #BA8A7A;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
}
.vpop-ayrinti:hover,
.vpop-ayrinti:focus-visible { background: #a6735f; color: #fff; }

/* Kapat: her zaman görünür, en az 40x40 dokunma alanı */
.vpop-kapat {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: rgba(17, 24, 39, 0.72);
  color: #fff;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vpop-kapat:hover { background: rgba(17, 24, 39, 0.92); }
.vpop-kapat:focus-visible { outline: 3px solid #BA8A7A; outline-offset: 2px; }

/* Farsça (RTL): Kapat sol üste */
[dir="rtl"] .vpop-kapat { right: auto; left: 8px; }

/* Ortadaki modal açıkken sayfa kaydırması kilitli */
html.vpop-kilit,
html.vpop-kilit body { overflow: hidden; }

/* Mobil: köşe konumları alt kenarda tam genişlik şerit */
@media (max-width: 576px) {
  .vpop-perdesiz .vpop-kutu {
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100%;
    max-height: 70vh;
    border-radius: 14px 14px 0 0;
  }
}

[data-bs-theme="dark"] .vpop-kutu { background: #1e1e2d; }
[data-bs-theme="dark"] .vpop-icerik { color: #d1d5db; }
[data-bs-theme="dark"] .vpop-alt { border-top-color: #2b2b40; }

@media (prefers-reduced-motion: reduce) {
  .vpop-perde,
  .vpop-kutu { transition: none; transform: none; }
}
