/* Afrikas özel düzeltmeler — tema CSS'lerinden SONRA yüklenir, üzerine yazar. */

/* Yatay taşma güvenliği: sağ-sabit yüzen butonlar (WhatsApp / Bağış Yap) dar
   telefonlarda görünür alanın dışına kaymasın, sayfada yatay kaydırma / sağda
   beyaz şerit oluşmasın. */
html,
body {
    overflow-x: hidden;
}

@media (max-width: 767.98px) {
    /* WhatsApp yüzen buton: her zaman ekran içinde, sağ kenara güvenli mesafede
       sabit. (Yalnız sağdan konumlandır; olası "left" değeri sıfırlanır ki dar
       ekranda taşmasın.) */
    #fab-container {
        right: 15px !important;
        left: auto !important;
    }

    /* Mobilde header bagis dugmesi zaten gorunur. Ikinci sabit dugme icerik,
       video ve form islemlerini kapattigi icin mobilde kaldirilir. */
    .donate-container {
        display: none !important;
    }

    /* Footer üst bloğu (logo + slogan + Bağış Yap butonu) mobilde net ortalı. */
    .footer-widget__about {
        text-align: center !important;
    }

    .footer-widget__about-logo,
    .footer-widget__about .footer-widget__btn {
        display: flex;
        justify-content: center;
    }
}

/* ---- Kampanya detayı bağış kutusu (bagisKutusu / articleBagisKutu) ----
   Orijinal sitede bu kutunun özel sınıfları sayfa-içi <style> ile geliyordu
   ve taşınmamıştı; tema CSS'inde karşılıkları yok. Tutar alanıyla (oxpins.css
   .donate-now__personal-info-input input) aynı tema dili burada verilir. */

/* Adet / hisse girişi: ham tarayıcı kutusu yerine tema girişi görünümü. */
.bagisKutusu .adetzorunlu {
    height: 42px;
    width: 90px;
    border: none;
    outline: none;
    background-color: var(--oxpins-extra);
    color: var(--oxpins-gray);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    border-radius: var(--oxpins-bdr-radius);
}

.bagisKutusu .adetText {
    margin-left: 10px;
    color: var(--oxpins-gray);
    font-size: 14px;
    font-weight: 500;
}

/* Dar kenar çubuğunda "Toplanan 32.500₺" satır içinde sarıp dağılmasın:
   etiket üstte, tutar altta — iki düzenli sütun. */
.bagisKutusu .causes-one__goals {
    align-items: flex-start;
}

.bagisKutusu .causes-one__goals > p {
    display: flex;
    flex-direction: column;
}

/* İlerleme kutusunun geniş kart için tasarlanmış iç boşluğu kenar
   çubuğunda daraltılır (üstteki boşluk yüzde etiketi + topuz içindir). */
.bagisKutusu .causes-one__progress {
    padding: 42px 18px 16px;
}

/* Hesabım sol menüsü: seçili öğe Bootstrap mavisi yerine tema yeşili. */
.hesabim-menu .list-group-item.active {
    background-color: var(--oxpins-base);
    border-color: var(--oxpins-base);
}

/* Logo boyut emniyeti: panelden yuklenen logo kac piksel olursa olsun
   header/footer/mobil menu alanina sigar (eski logo kucuk oldugundan sinir
   yoktu; 1024px kare logo tum sayfayi kapliyordu). */
.main-menu-two__logo img { max-height: 100px; width: auto; }
.footer-widget__about-logo img,
.mobile-nav__content .logo-box img { max-height: 110px; width: auto; }

/* Zengin metin editöründen (Quill) gömülen YouTube videosu: 16:9 responsive */
iframe.ql-video {
    display: block;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    border: 0;
}
/* Boyutlandirilmamis video tam genislik; kullanici resize edince (width
   ozniteligi) o boyut korunur. max-width:100% dar ekranda tasmayi onler. */
iframe.ql-video:not([width]) { width: 100%; }
.blok-icerik img, .icerik-govde img { max-width: 100%; height: auto; }

/* Veritabaninda saklanan eski sayfa bloklarindaki kampanya kartlari da
   tema tarafindan sabit yukseklige cekildiginde gorseli esnetmesin. */
.causes-one__img img {
    object-fit: cover;
    object-position: center;
}

/* Odeme akisi dikkat dagitmadan tamamlanir: ayrintili footer ve yuzen CTA'lar
   yalnizca bu sayfada gizlenir, telif satiri kompakt kalir. */
body:has(.odeme-sayfasi) .site-footer__top,
body:has(.odeme-sayfasi) .site-footer + .container,
body:has(.odeme-sayfasi) #fab-container,
body:has(.odeme-sayfasi) .donate-container { display: none !important; }
body:has(.odeme-sayfasi) .site-footer__bottom { padding: 18px 0 !important; }
body:has(.odeme-sayfasi) .site-footer__bottom .row { margin: 0 !important; padding: 0 !important; }

/* Zengin metin editörü (Quill) hizalama sınıfları — kamu tarafı render.
   NOT: metin/inline için text-align yeterli; blok gömme (video/görsel)
   için Quill editörü margin:auto kullanır — kamu tarafında da aynısı
   olmalı yoksa ortalanmış video/görsel sola yaslı görünür. */
.ql-align-center { text-align: center; }
.ql-align-right { text-align: right; }
.ql-align-justify { text-align: justify; }
iframe.ql-video.ql-align-center { margin-left: auto; margin-right: auto; }
iframe.ql-video.ql-align-right { margin-left: auto; margin-right: 0; }
.blok-icerik img.ql-align-center, .icerik-govde img.ql-align-center { display: block; margin-left: auto; margin-right: auto; }
.blok-icerik img.ql-align-right, .icerik-govde img.ql-align-right { display: block; margin-left: auto; margin-right: 0; }

/* Quill zengin editör — kamu tarafı render sınıfları */
.ql-font-serif { font-family: Georgia, 'Times New Roman', serif; }
.ql-font-monospace { font-family: 'Courier New', Courier, monospace; }
.ql-direction-rtl { direction: rtl; }
.ql-indent-1 { padding-left: 3em; }
.ql-indent-2 { padding-left: 6em; }
.ql-indent-3 { padding-left: 9em; }
.ql-indent-4 { padding-left: 12em; }
.ql-indent-5 { padding-left: 15em; }
.ql-indent-6 { padding-left: 18em; }
.ql-indent-7 { padding-left: 21em; }
.ql-indent-8 { padding-left: 24em; }
pre.ql-syntax, .blok-icerik pre, .icerik-govde pre {
    background: #2d2d2d; color: #f8f8f2; padding: .85em 1em;
    border-radius: 6px; overflow: auto; white-space: pre-wrap;
}
.blok-icerik hr, .icerik-govde hr { border: 0; border-top: 1px solid #d3d9e0; margin: 1.25rem 0; }

/* İçerik tablosu (Tablo bloğu) */
.yn-icerik-tablo { width: 100%; border-collapse: collapse; margin: 1.25rem 0; }
.yn-icerik-tablo th, .yn-icerik-tablo td { border: 1px solid #d3d9e0; padding: .55rem .8rem; text-align: left; vertical-align: top; }
.yn-icerik-tablo th { background: #f0f4f8; font-weight: 600; }
.yn-icerik-tablo tr:nth-child(even) td { background: #fafbfc; }

/* Native tablo (quill-table-better) — public site editör CSS'ini yüklemez;
   varsayilan kenarlik/dolgu burada verilir. Bu sinif yalnizca render edilen
   icerik tablolarinda gecer. Kullanicinin tablo menusunden verdigi inline
   stiller (border/background vb.) daima bunlarin uzerine yazar. */
table.ql-table-better { width: 100%; border-collapse: collapse; margin: 1.25rem 0; }
table.ql-table-better th,
table.ql-table-better td { border: 1px solid #d3d9e0; padding: .55rem .8rem; text-align: left; vertical-align: top; }
table.ql-table-better th { background: #f0f4f8; font-weight: 600; }
table.ql-table-better p.ql-table-block { margin: 0; }
.ql-font-arial { font-family: Arial, Helvetica, sans-serif; }
.ql-font-georgia { font-family: Georgia, serif; }
.ql-font-times { font-family: "Times New Roman", Times, serif; }
.ql-font-verdana { font-family: Verdana, Geneva, sans-serif; }
.ql-font-courier { font-family: "Courier New", Courier, monospace; }
/* Zengin metin editörü ek yazı tipleri (Google Fonts) — kamu tarafı render */
.ql-font-montserrat { font-family: "Montserrat", sans-serif; }
.ql-font-poppins { font-family: "Poppins", sans-serif; }
.ql-font-oswald { font-family: "Oswald", sans-serif; }
.ql-font-merriweather { font-family: "Merriweather", serif; }
.ql-font-playfair { font-family: "Playfair Display", serif; }
.ql-font-lora { font-family: "Lora", serif; }
.ql-font-dancing { font-family: "Dancing Script", cursive; }
.ql-font-caveat { font-family: "Caveat", cursive; }

/* Odeme sayfasi kart onizlemesi (card.js): kutuphane arka yuze kendi
   Ingilizce tanitim metnini CSS content ile basar - Turkce guvence
   metniyle degistirilir. Gorsel ortalanir. */
.kart-onizleme .jp-card .jp-card-back .jp-card-shiny::after {
    content: "Kart bilgileriniz sitemizde saklanmaz; 3D Secure ile doğrudan bankanıza iletilir.";
}
.kart-onizleme .jp-card-container { margin: 0 auto; }
