/**
 * MW Logo Switcher - Frontend CSS
 * Ashley Teması + Elementor Sticky + Menu Popup + Dark Reader Uyumlu
 * Masaüstü: Dinamik scroll + Popup + Dark Reader
 * Mobil: Header zemini beyaz olduğu için sadece Dark Reader'da beyaz, normalde daima siyah logo
 *
 * @version 3.2.0
 */

/* ===== 1. ELEMENTOR STICKY SPACER KLONLARINI KESİNLİKLE YOK ET ===== */
.elementor-sticky__spacer,
.elementor-sticky__spacer * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* ===== 2. LOGO BOYUTU (YARIM KESİLMEYİ ENGELLEYEN TAM YÜKSEKLİK) ===== */
.elementor-widget-ashley-header-logo img,
.mil-frame-top .mil-logo img,
.mil-menu-frame .mil-logo img,
.mil-logo img {
    height: auto !important;
    width: auto !important;
    max-height: 54px !important;
    max-width: 240px !important;
    object-fit: contain !important;
    display: block !important;
}

/* ===== 3. LOGO CONTAINER VE TAŞMA İZNİ (OVERFLOW: VISIBLE) ===== */
.elementor-widget-ashley-header-logo .elementor-widget-container,
.elementor-widget-ashley-header-logo .js-replace,
.mil-frame-top .js-replace,
.mil-menu-frame .js-replace {
    position: relative !important;
    display: inline-block !important;
    height: auto !important;
    min-height: 46px !important;
    vertical-align: middle !important;
    overflow: visible !important;
}

/* Her iki logo öğesi tam aynı koordinata oturur ve taşması kesilmez */
.js-replace .js-replace__item {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    width: auto !important;
    overflow: visible !important;
}

.js-replace .js-replace__content {
    overflow: visible !important;
    height: auto !important;
}

/* İLK AÇILIŞ LOGO KAYMASI ENGELI:
   JS çalışıp body'e mwls-on-dark veya mwls-on-light ekleyene kadar
   logo alanı görünmez ama yerini korur (opacity:0).
   JS ilk frame'de class ekler → opacity:1 → logo zaten doğru konumda. Kayma yok. */
body:not(.mwls-on-dark):not(.mwls-on-light) .js-replace {
    opacity: 0 !important;
}

/* Aktif Olmayan Logo (Sıfır Etki, Gizli) */
.js-replace .js-replace__item:not(.js-replace__item--active),
.js-replace .js-replace__item.mwls-hidden {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

/* Aktif Logo (Görünür) */
.js-replace .js-replace__item.js-replace__item--active:not(.mwls-hidden) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    pointer-events: auto !important;
    z-index: 2 !important;
}

/* ===== 4. MASAÜSTÜNDE (1201PX VE ÜSTÜ) MENU POPUP AÇIKKEN BEYAZ LOGO GARANTİSİ ===== */
@media screen and (min-width: 1201px) {
    .mil-menu-frame.mil-active .js-replace .js-replace__item:first-child,
    body.mil-menu-open .js-replace .js-replace__item:first-child {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }

    .mil-menu-frame.mil-active .js-replace .js-replace__item:last-child,
    body.mil-menu-open .js-replace .js-replace__item:last-child {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 99 !important;
    }
}

/* ===== 5. DARK READER & KARANLIK MOD OTOMATİK BEYAZ LOGO (MASAÜSTÜ & MOBİL & TABLET) ===== */
html[data-darkreader-mode] .js-replace .js-replace__item:first-child,
html[data-darkreader-scheme] .js-replace .js-replace__item:first-child,
body.dark-mode .js-replace .js-replace__item:first-child,
body.dark .js-replace .js-replace__item:first-child,
html.dark .js-replace .js-replace__item:first-child {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

html[data-darkreader-mode] .js-replace .js-replace__item:last-child,
html[data-darkreader-scheme] .js-replace .js-replace__item:last-child,
body.dark-mode .js-replace .js-replace__item:last-child,
body.dark .js-replace .js-replace__item:last-child,
html.dark .js-replace .js-replace__item:last-child {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 2 !important;
}

/* ===== 6. MOBİL & TABLETTE (1200PX VE ALTI) NORMAL MODDA DAİMA SİYAH LOGO ===== */
@media screen and (max-width: 1200px) {
    /* Karanlık mod aktif değilse mobil ve tabletlerde daima siyah logo görünür, scroll'da ve popup'ta değişmez */
    html:not([data-darkreader-mode]):not([data-darkreader-scheme]) body:not(.dark-mode):not(.dark) .js-replace .js-replace__item:first-child {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
    }

    html:not([data-darkreader-mode]):not([data-darkreader-scheme]) body:not(.dark-mode):not(.dark) .js-replace .js-replace__item:last-child {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        position: absolute !important;
    }
}

/* ===== 7. ESSENTIAL GRID & LIGHTBOX AÇILDIĞINDA SAYFA ZIPLAMASINI ENGELLE ===== */
html.fancybox-is-open,
body.fancybox-active,
html.esgbox-is-open,
body.esgbox-active,
.esgbox-opened,
.esgbox-opened body {
    position: static !important;
    overflow: visible !important;
    margin-right: 0 !important;
}