/* =========================================================
   custom-tr-fix.css (SAFE)
   - Site geneli font: Roboto
   - FontAwesome (FA4) bozulmasın
   - Focus altın efekt: SADECE reservation modal içinde
   - Tema (Dawat style.css) form/modal stillerini ezmez
   - Inner header / layout düzenine dokunmaz
   ========================================================= */

:root {
    --tr-font: "Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    --dawat-accent: #CA9C5E;
    --dawat-accent-soft: rgba(202,156,94,.18);
}

/* ---------------------------------------------------------
   1) Genel font uygulaması
   --------------------------------------------------------- */
html, body {
    font-family: var(--tr-font);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* İstersen kapatabilirsin:
       Dawat style.css bazen farklı arka planlar kullanıyor,
       beyazı zorlamak istemiyorsan aşağıyı kaldır. */
    background: #fff !important;
}

body,
p, span, a, li, small, strong, em, label,
input, select, textarea, button,
blockquote, td, th {
    font-family: var(--tr-font);
}

/* ---------------------------------------------------------
   2) FontAwesome fix (FA4)
   --------------------------------------------------------- */
i.fa, i.fa:before, i.fa:after,
.fa, .fa:before, .fa:after {
    font-family: FontAwesome !important;
    font-style: normal !important;
    font-weight: normal !important;
}

/* ---------------------------------------------------------
   3) GLOBAL FOCUS'u kullanma (theme ile çakışır)
   - Eskiden tüm input/select vb. için altın border veriyordu.
   - Bu, Dawat’ın table-booking-form stilini "birebir" bozar.
   --------------------------------------------------------- */
/*
input:focus,
select:focus,
textarea:focus,
button:focus,
.form-control:focus {
    outline: none !important;
    border-color: var(--dawat-accent) !important;
    box-shadow: 0 0 0 3px var(--dawat-accent-soft) !important;
}
*/

/* ✅ SADECE MODAL İÇİN FOCUS (birebir’e en yakın, güvenli) */
#reservation-form-modal input:focus,
#reservation-form-modal select:focus,
#reservation-form-modal textarea:focus,
#reservation-form-modal button:focus {
    outline: none !important;
    border-color: var(--dawat-accent) !important;
    box-shadow: 0 0 0 3px var(--dawat-accent-soft) !important;
}

/* ---------------------------------------------------------
   4) Dawat bazı section'ları siyaha çekebiliyor; nötrlüyoruz
   - Bu bölüm "genelde güvenli", ama eğer temadaki siyah
     arkaplanlı bölümlerini geri istiyorsan bu bloğu kaldır.
   --------------------------------------------------------- */
.section-padding,
.blog-area,
.about-area,
.menu-area,
.event-area,
.reservation-area,
.gallery-area,
.contact-area {
    background-color: transparent !important;
}

/* ---------------------------------------------------------
   5) Mobil: rezervasyon iletişim kutusu boşluğu (SAFE)
   --------------------------------------------------------- */
@media (max-width: 767px) {
    .reservation-contact-box {
        margin-top: 14px !important;
    }
}

/* ---------------------------------------------------------
   6) Modal içinde küçük uyumluluk dokunuşları (SAFE)
   - Dawat style.css zaten modal/dialog/content tarafını
     şekillendiriyor. Burada sadece “keskin” ufak şeyler.
   --------------------------------------------------------- */
#reservation-form-modal .modal-title {
    /* Theme zaten uppercase/center yapıyor, bu müdahale minimal */
    letter-spacing: 2px;
}

/* Eğer modal içinde inputlarda iOS/Chrome autofill sararması görürsen:
   (Dawat style.css genelde çözüyor; gerekirse aç)
*/
/*
#reservation-form-modal input:-webkit-autofill,
#reservation-form-modal input:-webkit-autofill:hover,
#reservation-form-modal input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    -webkit-text-fill-color: #fff !important;
    transition: background-color 9999s ease-in-out 0s;
}
*/


#reservation-form-modal input:focus,
#reservation-form-modal select:focus {
    border-color: #CA3D26 !important;
    box-shadow: 0 0 0 2px rgba(202,61,38,.18) !important;
}


/* ============================================================
   Dawat Inner Header Fix
   ✅ Modal açıkken inner header üstte kalmasın
   ✅ Sadece inner sayfalarda etkili (body.dawat-inner)
   ✅ Modal açıkken header tıklanamaz + z-index düşer
   ============================================================ */

/* Normalde inner header’ın düzenine karışma (sende başka fixler varsa buraya ekleyebilirsin) */


/* ✅ Modal açıkken: header ve sticky wrapper her şeyin altına insin */
body.dawat-inner.rf-modal-open header,
body.dawat-inner.rf-modal-open .top-area,
body.dawat-inner.rf-modal-open .mainmenu-area,
body.dawat-inner.rf-modal-open .navbar,
body.dawat-inner.rf-modal-open .header-top-area,
body.dawat-inner.rf-modal-open .sticky-wrapper,
body.dawat-inner.rf-modal-open #inner-header,
body.dawat-inner.rf-modal-open .page-barner-area,
body.dawat-inner.rf-modal-open .page-barner-bg,
body.dawat-inner.rf-modal-open .page-barner-bg * {
    z-index: 1 !important;
    pointer-events: none !important;
}

/* ✅ Modal + backdrop kesin üstte kalsın */
body.dawat-inner.rf-modal-open .modal-backdrop {
    z-index: 199999 !important;
}

body.dawat-inner.rf-modal-open #reservation-form-modal.modal {
    z-index: 200000 !important;
}

/* ✅ Modal içi tıklanabilir kalsın */
body.dawat-inner.rf-modal-open #reservation-form-modal,
body.dawat-inner.rf-modal-open #reservation-form-modal * {
    pointer-events: auto !important;
}


/* ✅ TIMEPICKER dropdown modal içinde kalsın (altta kalma fix) */
#reservation-form-modal .modal-content {
    position: relative !important;
}

/* jquery-timepicker wrapper class'ı */
#reservation-form-modal .ui-timepicker-wrapper {
    position: absolute !important;
    z-index: 10000002 !important;
    max-height: 240px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
}

/* =========================================================
   ✅ INNER HEADER TITLE FIX
   - Başlık dışarı taşmasın
   - Roboto zorla
   - Boyut daha küçük + responsive
   ========================================================= */

#inner-header .barner-text {
    max-width: 100%;
    overflow: hidden; /* header dışına taşmayı engeller */
}

    #inner-header .barner-text h1 {
        font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-weight: 700 !important;
        /* ✅ Boyut: header için daha “normal” */
        font-size: 28px !important;
        line-height: 1.15 !important;
        /* ✅ Taşmayı engelle */
        margin: 0 0 8px 0 !important;
        max-width: 100% !important;
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        /* Ek güvenlik: bazı temalarda padding ile taşıyor */
        padding: 0 !important;
    }

    /* Breadcrumb / "Etkinlik Detayı" vb. */
    #inner-header .barner-text .page-location,
    #inner-header .barner-text .page-location a {
        font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-weight: 500 !important;
        font-size: 13px !important;
    }

/* Mobilde daha da küçük */
@media (max-width: 767px) {
    #inner-header .barner-text h1 {
        font-size: 22px !important;
        line-height: 1.2 !important;
    }
}

/* Çok dar ekran */
@media (max-width: 420px) {
    #inner-header .barner-text h1 {
        font-size: 20px !important;
    }
}


/* =========================================================
   ✅ INNER HEADER: Başlık + Breadcrumb TAM ORTA (mobil dahil)
   - H1 ve breadcrumb dikey kolon
   - Breadcrumb H1'in direkt altında
   - Mobilde aşağı kaymayı engeller
   ========================================================= */

#inner-header .page-barner-area {
    position: relative !important;
    min-height: 260px; /* tema yüksekliğine göre ayarla */
    display: flex !important;
    align-items: center !important; /* dikey orta */
}

    #inner-header .page-barner-area .container,
    #inner-header .page-barner-area .row,
    #inner-header .page-barner-area [class*="col-"] {
        height: 100% !important;
    }

#inner-header .barner-text {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* yatay orta */
    justify-content: center !important; /* dikey orta (kolon içinde) */
    text-align: center !important;
    max-width: 100% !important;
}

    /* H1 */
    #inner-header .barner-text h1 {
        margin: 0 0 8px 0 !important;
    }

    /* Breadcrumb: H1'in direkt altında, ortada */
    #inner-header .barner-text .page-location {
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important; /* satır gibi dursun */
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: auto !important;
    }

        #inner-header .barner-text .page-location li {
            display: inline-block !important;
            float: none !important; /* bazı temalarda li float'lanır, bunu kırıyoruz */
        }

/* Mobil ayar */
@media (max-width: 767px) {
    #inner-header .page-barner-area {
        min-height: 210px;
        padding-top: 18px !important;
        padding-bottom: 18px !important;
    }

    #inner-header .barner-text h1 {
        font-size: 24px !important;
        line-height: 1.22 !important;
        white-space: normal !important;
    }

    #inner-header .barner-text .page-location {
        flex-wrap: wrap !important; /* çok uzunsa satır atlasın */
        gap: 6px !important;
    }
}

/* =========================================================
   ✅ Breadcrumb'ın "banner altına yapışma" problemini kır
   - Tema page-location'ı absolute/bottom/transform yapıyorsa iptal et
   - H1'in hemen altına geri getir
   ========================================================= */

#inner-header .barner-text {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

    /* KRİTİK: page-location'ı normal akışa döndür */
    #inner-header .barner-text .page-location {
        position: static !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        margin: 6px 0 0 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        width: auto !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
    }

        /* Bazı temalarda UL'ye pseudo/float gelir */
        #inner-header .barner-text .page-location li {
            float: none !important;
            display: inline-block !important;
        }

        /* Eğer tema ul'yi block yapıp alta itiyorsa bunu da kır */
        #inner-header .barner-text .page-location,
        #inner-header .barner-text .page-location * {
            clear: none !important;
        }

/* =========================================================
   ✅ INNER HEADER GERÇEK FIX
   - bg div'i header yüksekliğini şişirmesin (absolute)
   - banner alanı mobilde kısa olsun
   - yazı ortada kalsın
   ========================================================= */

#inner-header {
    position: relative !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

    /* Tema class'ı yükseklik/padding veriyorsa kır */
    #inner-header.top-area.single-page.blog-page {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }

    /* ✅ EN KRİTİK: arkaplan div'i akıştan çıkar */
    #inner-header .page-barner-bg {
        position: absolute !important;
        inset: 0 !important; /* top:0 right:0 bottom:0 left:0 */
        width: 100% !important;
        height: 100% !important;
        z-index: 0 !important;
    }

        /* Arkaplan üstü karartma/pattern varsa bozulmasın */
        #inner-header .page-barner-bg * {
            pointer-events: none !important;
        }

    /* Header içindeki gerçek içerik üstte kalsın */
    #inner-header .page-barner-area {
        position: relative !important;
        z-index: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 180px !important; /* desktop başlangıç */
        padding: 0 !important;
        margin: 0 !important;
    }

    #inner-header .barner-text {
        text-align: center !important;
        margin: 0 !important;
    }

/* Mobilde asıl kısaltma */
@media (max-width: 767px) {
    #inner-header .page-barner-area {
        min-height: 130px !important;
    }
}


/* ✅ Header mail/telefon büyük harfe dönmesin */
.header-top-area .top-bar .call-to-action a,
.header-top-area .top-bar .call-to-action p {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

    /* ✅ Sadece mail için ekstra garanti */
    .header-top-area .top-bar .call-to-action a[href^="mailto:"] {
        text-transform: none !important;
    }


/* ✅ Footer linkleri tıklanabilir kalsın (bg layer click yutmasın) */
.footer-area {
    position: relative;
}

.footer-area-bg {
    pointer-events: none !important; /* en kritik satır */
    z-index: 0 !important;
}

.footer-area .container,
.footer-area .container * {
    position: relative;
    z-index: 2;
}