/* =========================================================================
   Mahser Korku Evi — polish.css
   Sinematik karanlik tema katmani.
   styles.css > refined.css > horror-effects.css sirasinin ARDINDAN yuklenir;
   bu sayede efekt siddetini ve kapsanmayan bolumleri tek yerden toparlar.
   Token'lar css/refined.css :root icinde tanimlidir.
   HTML'e dokunmaz.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. TIPOGRAFI OLCEGI
   Sorun: .section-title styles.css icinde uc kez tanimli (turuncu gradient /
   kirmizi / sari) ve sabit boyutlu. Hiyerarsi yok.
   Cozum: tek sinematik tanim, akici olcek, tek vurgu rengi.
   ------------------------------------------------------------------------- */

body {
    line-height: var(--leading-body);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.section-title {
    font-family: var(--font-display);
    font-size: var(--text-section) !important;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: var(--tracking-display);
    text-transform: uppercase;

    /* Gradient metin dolgusunu geri al: tek duz renk */
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    color: var(--color-text) !important;
    text-shadow: none !important;

    margin-bottom: var(--space-block) !important;
    padding-bottom: 0.6rem;
}

/* Alt cizgi: genis parlak bar yerine ince kirmizi vurgu */
.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 56px !important;
    height: 2px !important;
    background: var(--color-accent) !important;
    border-radius: var(--radius-pill);
    box-shadow: none !important;
}

/* HTML'e dokunmadan: bu bolumlerdeki h2/h3 basliklari da ayni dile getir */
.about-section > .container > h2,
.location-info > .container > h3,
.social-proof > .container > h3,
.testimonials > .container > h2 {
    font-family: var(--font-display);
    font-size: var(--text-sub);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: var(--tracking-display);
    text-transform: uppercase;
    color: var(--color-text) !important;
    margin-bottom: var(--space-block) !important;
    position: relative;
    padding-bottom: 0.6rem;
}

.about-section > .container > h2::after,
.location-info > .container > h3::after,
.social-proof > .container > h3::after,
.testimonials > .container > h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;
    background: var(--color-accent);
    border-radius: var(--radius-pill);
}

/* Govde metni: okunabilir olcu ve satir yuksekligi */
.about-section p,
.location-info p,
.social-proof p,
.testimonials p {
    line-height: var(--leading-body);
    color: var(--color-text-muted) !important;
}

.about-section .lead {
    font-size: var(--text-lead);
    color: var(--color-text) !important;
}

/* Uzun metin bloklarini okunur satir uzunluguna sabitle */
.about-section .col-lg-8,
.location-info .col-lg-8 {
    max-width: 68ch;
}

/* -------------------------------------------------------------------------
   2. DIKEY RITIM
   my-5 / py-5 karisikligini tek olcege oturt.
   ------------------------------------------------------------------------- */

#about,
#alsancak-korku-evi,
#rules,
#faq,
#gallery,
#contact,
.about-section,
.location-info,
.social-proof,
.testimonials {
    padding-top: var(--space-section) !important;
    padding-bottom: var(--space-section) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

#blog {
    padding-top: var(--space-section) !important;
    padding-bottom: var(--space-section) !important;
    /* Duz gri gradient yerine temanin kendi zemini */
    background: var(--color-surface-sunken) !important;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

/* bg-dark kullanan bolumler temayla ayni zemine otursun */
.location-info,
.location-info.bg-dark,
.testimonials.bg-dark {
    background: var(--color-surface-sunken) !important;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

/* -------------------------------------------------------------------------
   3. YUZEYLER — ortak kart dili
   Kart, akordiyon, modal ve galeri icin: cam yuzey + 1px kenarlik +
   tek golge seviyesi.
   ------------------------------------------------------------------------- */

/* NOT: refined.css bu karti `!important` ile tanimliyor; yeni katman olarak
   kazanabilmek icin ayni belirtec gucu burada da gerekli. */
.testimonial-card,
.social-stats {
    background: var(--color-surface-raised) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-raised) !important;
    backdrop-filter: blur(12px);
    height: 100%;
    padding: var(--space-tight) 1.4rem !important;
    transition: transform 0.35s var(--ease-out),
                border-color 0.35s var(--ease-out),
                box-shadow 0.35s var(--ease-out) !important;
}

.testimonial-card:hover {
    transform: translateY(-4px) !important;
    border-color: var(--color-accent-muted) !important;
    box-shadow: var(--shadow-hover) !important;
}

/* Yorum karti icerigi */
.testimonial-card .rating {
    font-size: 0.95rem;
    letter-spacing: 0.1em;
    filter: saturate(0.85);
}

.testimonial-card p {
    color: var(--color-text) !important;
    font-size: 1rem;
    line-height: var(--leading-body);
}

.testimonial-card small {
    color: var(--color-text-muted) !important;
    display: block;
    margin-top: 0.9rem;
    font-family: var(--font-display);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.8rem;
}

/* Sosyal kanit: turuncu ikonlari tek vurguya cek */
.social-stats {
    padding: var(--space-block);
    display: inline-block;
}

.social-stats p {
    color: var(--color-text) !important;
    margin-bottom: 0.85rem;
}

.social-stats p:last-child {
    margin-bottom: 0;
}

.social-stats i {
    color: var(--color-accent) !important;
    font-size: 1.25rem !important;
}

/* Akordiyon (SSS) — refined.css uzerine ince ayar */
.accordion-item {
    background: transparent;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md) !important;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.accordion-button {
    font-family: var(--font-display);
    letter-spacing: 0.02em;
    box-shadow: none !important;
}

.accordion-button:focus-visible {
    box-shadow: var(--focus-ring) !important;
}

.accordion-body {
    line-height: var(--leading-body);
}

/* Galeri carousel */
#galleryCarousel {
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-raised);
}

.carousel-inner img,
.carousel-item img {
    max-height: 68vh;
    object-fit: cover;
}

.carousel-indicators button {
    background-color: var(--color-text-muted) !important;
    width: 28px !important;
    height: 2px !important;
    border-radius: var(--radius-pill);
    opacity: 0.5;
    transition: opacity 0.25s ease, background-color 0.25s ease;
}

.carousel-indicators button.active {
    background-color: var(--color-accent) !important;
    opacity: 1;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: none !important;
    background-color: rgba(10, 10, 10, 0.6);
    border-radius: 50%;
    padding: 1.25rem;
    background-size: 45%;
}

/* Harita: keskin kose yerine ortak yuzey dili */
#contact iframe,
.map-container iframe {
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border) !important;
    display: block;
}

/* Modallar — basari / hata / KVKK ortak dil */
.success-modal-content,
.custom-modal .modal-content {
    background: var(--color-surface-raised) !important;
    border: 1px solid var(--color-border-strong) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-hover) !important;
    backdrop-filter: blur(20px);
}

.success-modal h3,
.custom-modal .modal-title {
    font-family: var(--font-display);
    letter-spacing: var(--tracking-display);
    text-transform: uppercase;
    color: var(--color-text) !important;
}

.success-modal p,
.custom-modal .modal-body p {
    color: var(--color-text-muted) !important;
    line-height: var(--leading-body);
}

.custom-modal .modal-header {
    border-bottom: 1px solid var(--color-border) !important;
}

/* -------------------------------------------------------------------------
   4. BUTONLAR — tek birincil + tek ikincil varyant
   ------------------------------------------------------------------------- */

.btn-reservation,
.btn-primary,
.blog-card-footer .btn-primary,
.success-modal button {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: var(--color-accent) !important;
    border: 1px solid var(--color-accent) !important;
    color: #fff !important;
    border-radius: var(--radius-pill) !important;
    padding: 0.85rem 2rem;
    box-shadow: none !important;
    transition: background-color 0.25s var(--ease-out),
                transform 0.25s var(--ease-out);
}

.btn-reservation:hover,
.btn-primary:hover,
.blog-card-footer .btn-primary:hover,
.success-modal button:hover {
    background: var(--color-accent-soft) !important;
    border-color: var(--color-accent-soft) !important;
    transform: translateY(-2px);
    color: #fff !important;
}

.btn-outline-light,
.btn-light {
    background: transparent !important;
    border: 1px solid var(--color-border-strong) !important;
    color: var(--color-text) !important;
    border-radius: var(--radius-pill) !important;
    font-family: var(--font-display);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: border-color 0.25s var(--ease-out),
                background-color 0.25s var(--ease-out);
}

.btn-outline-light:hover,
.btn-light:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: var(--color-accent) !important;
    color: var(--color-text) !important;
}

/* Erisilebilir odak halkasi — her yerde tutarli */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring) !important;
    border-radius: var(--radius-sm);
}

/* Form alanlari */
.form-control:focus,
.form-select:focus {
    border-color: var(--color-accent) !important;
    box-shadow: var(--focus-ring) !important;
}

.form-label {
    font-family: var(--font-display);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.8rem;
    color: var(--color-text-muted) !important;
}

/* -------------------------------------------------------------------------
   5. TEK VURGU RENGI DISIPLINI
   Sayfada dolasan #ff6b35 / #f8d210 / #ff4500 tonlarini tek kirmiziya cek.
   Sari-turuncu yalnizca gercek uyari durumlarinda kalir.
   ------------------------------------------------------------------------- */

.text-danger,
.social-proof i,
.testimonials .rating,
.fa-instagram,
.fa-facebook,
.fa-whatsapp {
    color: var(--color-accent) !important;
}

/* Yildiz puanlari nötr altin kalsin, neon sari olmasin */
.testimonial-card .rating {
    color: var(--color-warning) !important;
}

/* Gercek uyarilar sari kalir */
#nightSessionWarning,
#slotUrgency,
.text-warning:not(.rating) {
    color: var(--color-warning) !important;
}

/* -------------------------------------------------------------------------
   6. HAREKET — saf CSS scroll reveal
   .section-title vb. icin JS tabanli reveal-horror zaten var.
   Burada yalnizca onun kapsamadigi bolumler ele alinir.
   Destegi olmayan tarayicida bolumler normal gorunur (progressive enhancement).
   ------------------------------------------------------------------------- */

@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        .about-section > .container,
        .location-info > .container,
        .social-proof > .container,
        .testimonials .testimonial-card {
            animation: polishFadeUp linear both;
            animation-timeline: view();
            animation-range: entry 10% cover 26%;
        }
    }
}

@keyframes polishFadeUp {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* -------------------------------------------------------------------------
   7. KORKU EFEKTLERI — yumusatma
   Efektler korunur; siddet, siklik ve opaklik dusurulur, vinyet metnin
   uzerinden cekilir. horror-effects.css'ten SONRA yuklendigi icin kazanir.
   ------------------------------------------------------------------------- */

/* Vinyet: kenarlarda kalsin, icerigi karartmasin.
   Opaklik animasyonla suruldugu icin normal bir bildirim ise yaramaz;
   keyframe'in kendisi yeniden tanimlanir. */
.horror-vignette {
    animation-duration: 12s !important;
}

@keyframes horrorVignettePulse {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 0.45; }
}

/* Grain ve tarama cizgileri: yari yariya geri cekildi */
.horror-noise {
    opacity: 0.02 !important;
}

.horror-scanlines {
    opacity: 0.025 !important;
}

/* Flas: goz alici patlama yerine hafif parilti */
.horror-flash.is-active {
    animation-duration: 0.5s !important;
}

@keyframes horrorFlashBurst {
    0% { opacity: 0; }
    15% { opacity: 0.32; }
    100% { opacity: 0; }
}

/* Jumpscare: gorunur kalir, tepe opakligi dusuruldu.
   DIKKAT: burada `opacity: ... !important` KULLANILAMAZ — animasyon
   `forwards` ile bittigi icin ekran kalici olarak kararirdi. */
@keyframes horrorJumpscareFlash {
    0% { opacity: 0; }
    12% { opacity: 0.72; }
    100% { opacity: 0; }
}

/* Ekran sarsintisi: genlik dusuruldu */
@keyframes horrorBodyShake {
    0%, 100% { transform: none; }
    25% { transform: translate3d(-2px, 1px, 0); }
    50% { transform: translate3d(2px, -1px, 0); }
    75% { transform: translate3d(-1px, 2px, 0); }
}

/* Fisilti ve gozler: daha silik */
.horror-whisper.is-visible {
    opacity: 0.45 !important;
}

@keyframes horrorWhisperFlicker {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 0.3; }
}

.horror-eyes.is-peeking {
    opacity: 0.5 !important;
}

/* Imlec kan damlasi: daha silik.
   Yalnizca aktif duruma uygulanir — taban kuralda opacity:0 oldugu icin
   secicisiz bir !important damlayi surekli gorunur yapardi. */
body.page-home.horror-cursor-on .horror-cursor-drip {
    opacity: 0.5 !important;
}

/* Baslik titremesi: okunabilirligi bozmayacak genlige cekildi */
@keyframes heroTitleFlicker {
    0%, 100% { opacity: 1; }
    47% { opacity: 1; }
    48% { opacity: 0.86; }
    50% { opacity: 1; }
    72% { opacity: 0.92; }
    74% { opacity: 1; }
}

/* Bolum basliklarinin surekli parlamasi kapatildi — hiyerarsiyi bozuyordu */
body.page-home .section-title,
body.page-home .section-title::after {
    animation: none !important;
}

/* CTA nabzi: dikkat cekici ama sakin */
body.page-home .reservation-container button[type="submit"] {
    animation-duration: 4s !important;
}

/* Hero video: asiri doygunluk geri alindi */
body.page-home #heroWitchVideo,
body.page-home .glitch video {
    filter: brightness(1.02) contrast(1.05) saturate(1.05) !important;
}

/* Hareket azaltma tercihi: yumusatilmis efektler de tamamen dursun */
@media (prefers-reduced-motion: reduce) {
    .horror-vignette,
    .horror-noise,
    .horror-scanlines,
    .horror-flash,
    .horror-cursor-drip {
        animation: none !important;
    }

    .testimonial-card,
    .btn-reservation,
    .btn-primary {
        transition: none !important;
    }
}

/* -------------------------------------------------------------------------
   8. MOBIL
   ------------------------------------------------------------------------- */

@media (max-width: 768px) {
    .carousel-inner img,
    .carousel-item img {
        max-height: 52vh;
    }

    .btn-reservation,
    .btn-primary {
        padding: 0.75rem 1.5rem;
    }

    .social-stats {
        display: block;
    }

    /* Kucuk ekranda vinyet daha da geri ceksin */
    .horror-vignette {
        opacity: 0.4;
    }
}

/* -------------------------------------------------------------------------
   9. CHAT WIDGET — tek vurgu rengine cekildi
   chat.css turuncu (#ff6b35 -> #f7931e) ve pembe (#ff512f -> #dd2476)
   gradientler kullaniyor; bunlar sayfadaki en baskin renkti.
   polish.css en son yuklendigi icin burasi kazanir.
   ------------------------------------------------------------------------- */

/* Basliklar ve gonder butonu: gradient yerine duz vurgu rengi */
.modern-chat .chat-header,
.chat-header-simple,
#chat-widget .chat-header,
.modern-chat .chat-send-btn,
.chat-toggle {
    background: var(--color-accent) !important;
    color: #fff !important;
}

.modern-chat .chat-send-btn:hover:not(:disabled),
.chat-toggle:hover {
    background: var(--color-accent-soft) !important;
}

/* Kullanicinin kendi mesaji */
.modern-chat .message.own {
    background: var(--color-accent) !important;
    color: #fff !important;
}

/* Sari vurgular notr metne cekildi */
.modern-chat .chat-header i,
.modern-chat .chat-header h2,
.modern-chat .online-count,
.online-status,
.modern-chat .chat-emoji-btn {
    color: #fff !important;
}

.modern-chat .chat-emoji-btn:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: var(--color-border-strong) !important;
}

/* Uyari kutusu: gercek uyari oldugu icin sari kalir, zemin notrlestirildi */
.chat-warning-message {
    background: rgba(240, 165, 0, 0.1) !important;
    border-color: rgba(240, 165, 0, 0.3) !important;
    color: var(--color-warning) !important;
}

.chat-warning-message i,
.chat-warning-message strong {
    color: var(--color-warning) !important;
}

/* Odak halkasi tema rengine gecsin */
.modern-chat .chat-input input:focus,
.modern-chat .chat-input textarea:focus {
    box-shadow: var(--focus-ring) !important;
}

/* Baslik tipografisi sayfanin geri kalaniyla ayni dile girsin */
.modern-chat .chat-header h2,
.chat-header-simple {
    font-family: var(--font-display);
    letter-spacing: var(--tracking-display);
    text-transform: uppercase;
}

/* -------------------------------------------------------------------------
   10. HERO — kalan turuncu/sari ve palet disi cyan temizligi
   refined.css bunlari zaten token'a baglamisti ama styles.css `!important`
   ile geri turuncuya/sariya cekiyordu.
   ------------------------------------------------------------------------- */

.hero-eyebrow {
    color: var(--color-accent-soft) !important;
}

.hero-seo {
    color: var(--color-text-muted) !important;
    font-weight: 400 !important;
}

/* Glitch dilimleri: cyan (#00d4ff) palet disiydi.
   Kirmizi + notr beyaz kaymasi sinematik dile uyuyor. */
body.page-home .hero-brand.horror-glitch-title::after {
    text-shadow: 2px 0 rgba(255, 255, 255, 0.55) !important;
}

body.page-home .hero-brand.horror-glitch-title::before {
    text-shadow: -2px 0 var(--color-accent) !important;
}

/* Gonder butonu: chat.css gradientini ezmek icin id belirteci gerekiyor */
#sendBtn,
.btn-send.chat-send-btn {
    background: var(--color-accent) !important;
    border: none !important;
    color: #fff !important;
}

#sendBtn:hover:not(:disabled),
.btn-send.chat-send-btn:hover:not(:disabled) {
    background: var(--color-accent-soft) !important;
}

#sendBtn:disabled,
.btn-send.chat-send-btn:disabled {
    background: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.4) !important;
}

/* -------------------------------------------------------------------------
   11. ASISTAN WIDGET (chat-interface.php)
   Bu widget stillerini <style> blogu icinde, sayfa govdesinde tanimliyor;
   yani head'deki polish.css'ten SONRA geliyor. Bu yuzden `!important` sart.
   ------------------------------------------------------------------------- */

/* Gonder butonu: turuncu gradient -> duz vurgu rengi */
#send-message {
    background: var(--color-accent) !important;
    color: #fff !important;
}

#send-message:hover {
    background: var(--color-accent-soft) !important;
}

/* Parlama animasyonu turuncuyu geri getiriyordu */
#send-message::before {
    display: none !important;
}

/* Baslik: beyaz->sari gradient metin yerine duz beyaz */
.chat-header h3 {
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #fff !important;
    color: #fff !important;
    font-family: var(--font-display);
    letter-spacing: var(--tracking-display);
}

/* -------------------------------------------------------------------------
   12. NAVBAR LOGOSU
   styles.css yalnizca `max-height` tanimliyor, `width` serbest kaliyordu.
   Genislik acikca sinirlanmadigi surece logo en-boy oranini koruyamiyor.
   ------------------------------------------------------------------------- */

.navbar-logo,
.navbar-brand img {
    width: auto !important;
    height: auto;
    /* Yeni logo yatay kilit (~2.66:1). Eski kare logo 80px yukseklikte
       alanin cogunu bos biraktiginda 220px genislik yetiyordu; yatay
       formda daha genis bir tavan gerekiyor. */
    max-width: 260px;
    max-height: 56px;
    object-fit: contain;
    display: block;
}

.scrolled .navbar-logo,
.scrolled .navbar-brand img {
    max-height: 46px;
}

@media (max-width: 991.98px) {
    .navbar-logo,
    .navbar-brand img {
        max-height: 42px;
        max-width: 190px;
    }
}
