/* kartify-header-shell.css — Paket 278
   header.tpl icindeki KOSULSUZ ve STATIK gomulu stil blogu (kaynak
   satir 826-2202) buraya alindi. Tek bir kural silinmedi veya
   degistirilmedi. Bagalanti, kaldirilan blogun TAM yerinde duruyor.
   Kaynak blok sha256: 23a5b7e08257... */

    /* =============================================================
       OFISOMI İÇERİĞİNE UYARLANMIŞ KARTIFY HEADER YERLEŞİMİ

       Kartify'nin orijinal formu width:max-content ve sabit input genişlikleri
       kullanıyor. Daha geniş Ofisomi logosu ve Türkçe metinler eklendiğinde form
       kendi flex hücresinden taşıyordu. Burada öğeleri küçültmek yerine gerçek
       kullanılabilir alanı paylaşan bir yerleşim kuruyoruz.
       ============================================================= */
    @media (min-width:992px){
        .kartify-real-header .main-header{
            box-sizing:border-box;
            display:flex;
            align-items:center;
            justify-content:space-between;
            height:80px;
            min-height:80px;
            padding-block:14px;
        }

        /* Ofisomi logosu 400x90 oranında; Kartify logosuyla aynı yükseklik verilirse
           yaklaşık 196px genişliğe çıkıyor. Bu yüzden genişlik üzerinden sınırlanır. */
        .kartify-real-header .main-header .left-header .header-logo{
            display:flex;
            align-items:center;
            width:132px;
            height:auto;
            max-height:46px;
        }
        .kartify-real-header .main-header .left-header .header-logo img{
            display:block;
            width:100%!important;
            height:auto!important;
            max-width:132px;
            max-height:46px;
            object-fit:contain;
        }

        /* Form, sabit max-content genişliği yerine orta hücrenin tamamını kullanır. */
        .kartify-real-header .main-header .middle-header{
            flex:0 1 948px;
            width:948px;
            max-width:948px;
            min-width:0;
            height:51px;
        }
        .kartify-real-header .main-header .middle-header .search-form{
            width:100%!important;
            min-width:0;
            height:51px!important;
            margin:0!important;
        }
        .kartify-real-header .main-header .middle-header .search-form .input-group{
            width:100%;
            min-width:0;
        }
        .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text,
        .kartify-real-header .main-header .middle-header .search-form .input-group .search-button{
            flex:0 0 auto;
        }
        .kartify-real-header .main-header .middle-header .search-form .input-group .form-control{
            flex:1 1 0!important;
            width:auto!important;
            min-width:0;
        }

        /* Sağ taraf doğal içeriği kadar yer kaplar; telefon metni kendi içinde bölünmez. */
        .kartify-real-header .main-header .right-header,
        .kartify-real-header .main-header .right-header .header-icon{
            width:max-content;
            min-width:0;
            flex-wrap:nowrap;
        }
        .kartify-real-header .main-header .right-header .contact-list>a{
            align-items:center;
            gap:12px;
        }
        /* Paket 250 — burada arama ile telefon arasindaki simgenin
           kurallari vardi (once WhatsApp, sonra kupon yildizi). Simge
           kaldirildigi icin butun blok da kaldirildi: sinifi hicbir yerde
           kalmayan CSS birakmak, ileride "bu ne ise yariyor" sorusuna yol
           aciyor.

           Birlikte giden ayrac da kalkti: .kartify-header-coupon+.contact-list
           komsu secicisiydi, artik hicbir seye denk gelmiyordu. Telefon
           bloguna bitisik ayrac cizgisi de bu yuzden yok. */
        .kartify-real-header .main-header .right-header .contact-list>a>div{
            width:auto;
            min-width:0;
        }
        .kartify-real-header .main-header .right-header .contact-list h5,
        .kartify-real-header .main-header .right-header .contact-list h6{
            margin-top:0;
            white-space:nowrap;
            line-height:1.2;
        }
    }

    /* Kartify'nin kendi input basamakları toplam form genişliğine çevrildi.
       Böylece Türkçe kategori etiketi büyüdüğünde input aynı kutu içinde esner. */
    @media (min-width:992px) and (max-width:1667px){
        .kartify-real-header .main-header .middle-header{flex-basis:858px;width:858px;max-width:858px}
    }
    @media (min-width:992px) and (max-width:1550px){
        .kartify-real-header .main-header .middle-header{flex-basis:758px;width:758px;max-width:758px}
    }
    @media (min-width:992px) and (max-width:1420px){
        .kartify-real-header .main-header .middle-header{flex-basis:618px;width:618px;max-width:618px}
    }
    @media (min-width:992px) and (max-width:1254px){
        .kartify-real-header .main-header .middle-header{flex-basis:458px;width:458px;max-width:458px}
    }

    /* Tablet yatay görünümünde Kartify'nin mobil menü düğmesi de sol kolonda yer
       aldığı için flex düzeni korunur; çağrı merkezi yazısı yer kazanmak için gizlenir. */
    @media (min-width:992px) and (max-width:1199.98px){
        .kartify-real-header .main-header .left-header{flex:0 0 auto}
        .kartify-real-header .main-header .left-header .header-logo,
        .kartify-real-header .main-header .left-header .header-logo img{width:125px;max-width:125px}
        .kartify-real-header .main-header .middle-header{flex:1 1 auto;width:auto;max-width:none}
        .kartify-real-header .main-header .right-header{flex:0 0 auto}
        .kartify-real-header .main-header .right-header .contact-list>a>div{display:none}
        .kartify-real-header .main-header .right-header .header-icon>li.contact-list{margin-right:0}
    }

    /* Arama yanındaki kategori seçicisi: Kartify'nin width:100% kuralı menüyü
       yalnızca düğme kadar daraltıyordu ve uzun Türkçe adlar kutudan taşıyordu. */
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-toggle{
        width:145px;
        max-width:145px;
        height:51px;
        display:flex!important;
        padding-top:0;
        padding-bottom:0;
        align-items:center;
        justify-content:space-between;
    }
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-toggle>span{
        display:block;
        min-width:0;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        line-height:1.4!important;
        padding:2px 0 3px;
    }
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-menu.kartify-search-category-menu{
        width:280px!important;
        min-width:280px!important;
        max-width:calc(100vw - 24px);
        max-height:320px;
        margin-top:8px!important;
        padding:6px;
        overflow-x:hidden;
        overflow-y:auto;
        z-index:1080;
        border-radius:8px;
    }
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-menu.kartify-search-category-menu li+li .dropdown-item{
        margin-top:2px;
    }
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-menu.kartify-search-category-menu li .dropdown-item{
        display:block;
        width:100%;
        margin:0;
        padding:9px 12px;
        border:0;
        border-radius:5px;
        background:transparent;
        color:rgba(var(--content-color),1);
        font-size:14px!important;
        line-height:1.25!important;
        font-weight:400;
        text-align:left;
        text-transform:none;
        white-space:normal;
        overflow-wrap:anywhere;
    }
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-menu.kartify-search-category-menu li .dropdown-item:hover,
    .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-menu.kartify-search-category-menu li .dropdown-item.active{
        background-color:#eef0f3!important;
        color:rgba(var(--content-color),1)!important;
    }
    @media (min-width:992px) and (max-width:1254px){
        .kartify-real-header .main-header .middle-header .search-form .input-group .input-group-text .dropdown .dropdown-toggle{
            width:120px;
            max-width:120px;
        }
    }

    /* Kartify'nin 200px dropdown'u kısa İngilizce adlar için hazırlanmış. Entegra'dan
       gelen uzun Türkçe kategori adları 16px/160px içerik alanında gereksiz yere
       satırlara bölünüyordu. Yalnızca header dropdown seviyelerini normalize ediyoruz. */
    @media (min-width:1200px){
        .kartify-real-header .header-nav-middle .navbar-nav>.nav-item>.dropdown-menu{
            min-width:240px;
            padding:16px;
        }
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .dropdown-item,
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-menu li a{
            font-size:14px!important;
            line-height:1.35!important;
            font-weight:400;
            text-transform:none;
            white-space:normal;
        }
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .dropdown-item{
            margin-top:0;
            padding-block:6px;
        }
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-dropdown-hover .sub-menu{
            min-width:280px;
            padding:16px;
            gap:4px;
            left:calc(100% + 16px)!important;
            right:auto!important;
            top:-17px;
        }
        /* İlk dropdown'un 16px iç boşluğu hesaba katılır; iki beyaz kutu temas
           eder. Böylece hem uzak görünmez hem fare iki seviye arasında kopmaz. */
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-dropdown-hover:hover>.sub-menu{
            left:calc(100% + 16px)!important;
            right:auto!important;
        }
        /* Sağ kenara sığmayan üçüncü seviyeler JS ile bu sınıfı alır ve aynı
           bitişik mesafeyi koruyarak ikinci seviyenin soluna açılır. */
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-dropdown-hover.kartify-submenu-left>.sub-menu,
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-dropdown-hover.kartify-submenu-left:hover>.sub-menu{
            left:auto!important;
            right:calc(100% + 16px)!important;
        }
        .kartify-real-header .header-nav-middle .navbar-nav .dropdown-menu .sub-menu li{
            padding:0;
        }
    }

    /* Kartify'nin tek seviyeli sol panelini Entegra CAT_MENU() alt kategorileriyle
       çalışan bir akordeona dönüştürüyoruz. */
    #categoryCanvas .sub-category-box img{width:30px;height:30px;object-fit:contain;flex:0 0 auto;opacity:1;filter:contrast(1.18) saturate(1.2)}
    #categoryCanvas .kartify-cat-row{display:flex;align-items:center;width:100%}
    #categoryCanvas .kartify-cat-row>.sub-category-box{display:flex;align-items:center;gap:14px;flex:1;min-width:0;color:#252a34!important}
    #categoryCanvas button.kartify-cat-primary-toggle{width:100%;padding:0;background:transparent;border:0;text-align:left;cursor:pointer;font:inherit}
    #categoryCanvas .kartify-cat-row>.sub-category-box h5{margin:0;color:inherit!important;font-size:15.5px!important;font-weight:600;line-height:1.25}
    #categoryCanvas .kartify-cat-row>.sub-category-box::after{content:none!important;display:none!important}
    #categoryCanvas .kartify-cat-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;margin:-7px -7px -7px 5px;padding:0;background:transparent;border:0;border-radius:50%;color:#596174}
    #categoryCanvas .kartify-cat-toggle:hover{background:rgba(var(--primary-color),.08);color:rgba(var(--primary-color),1)}
    .kartify-cat-toggle[aria-expanded="true"] .kartify-cat-chevron{transform:rotate(90deg)}
    .kartify-cat-chevron{font-size:21px;transition:transform .2s ease}
    #categoryCanvas .category-menu-list .sub-menu-list>li.kartify-cat-expanded{background:#fff!important}
    #categoryCanvas .kartify-cat-expanded .kartify-cat-row,
    #categoryCanvas .kartify-cat-expanded .kartify-category-children{background:#fff!important}
    #categoryCanvas .kartify-cat-expanded .kartify-cat-row>.sub-category-box,
    #categoryCanvas .kartify-cat-expanded .kartify-cat-row>.sub-category-box h5{color:#252a34!important}
    .kartify-category-children{display:none;padding:6px 0 4px 34px;margin:0;list-style:none;background:#fff}
    .kartify-category-children.kartify-cat-open{display:block}
    #categoryCanvas .category-menu-list .sub-menu-list .kartify-category-children>li{display:block;width:100%;padding:0;border:0;background:transparent}
    #categoryCanvas .kartify-category-children>li>a{display:block;padding:8px 10px;border-radius:6px;color:#343a48!important;font-size:15px!important;font-weight:500!important;line-height:1.35!important;text-decoration:none!important}
    #categoryCanvas .kartify-category-children>li>a:hover,
    #categoryCanvas .kartify-category-children>li>a:focus,
    #categoryCanvas .kartify-category-children>li>a:active,
    #categoryCanvas .kartify-category-children>li>a.kartify-category-selected{background:#eef0f3!important;color:#343a48!important}
    #categoryCanvas .kartify-category-children>li>a:focus-visible{outline:2px solid rgba(var(--primary-color),.35);outline-offset:-2px}
    #categoryCanvas .kartify-category-children>li.kartify-category-view-all{margin-top:7px;padding-top:7px;border-top:1px solid rgba(var(--content-color),.16)!important}
    #categoryCanvas .kartify-category-children>li.kartify-category-view-all>a{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600!important}
    #categoryCanvas .kartify-category-view-all i{flex:0 0 auto;font-size:18px;color:inherit}
    .kartify-category-grandchildren{padding:0 0 6px 16px;margin:0;list-style:none}
    #categoryCanvas .category-menu-list .sub-menu-list .kartify-category-grandchildren>li{display:block;width:100%;padding:0;border:0;background:transparent}
    #categoryCanvas .kartify-category-grandchildren a{display:block;padding:6px 8px;border-radius:5px;color:#596174!important;font-size:13.5px!important;font-weight:400!important;line-height:1.35!important;text-decoration:none!important}
    #categoryCanvas .kartify-category-grandchildren a:hover{background:rgba(var(--primary-color),.08);color:rgba(var(--primary-color),1)!important}

    /* MAIN_MENU() baglantilarini mobil kategori cekmecesinin altinda ayri bir
       akordeon bolumu olarak gosterir. */
    .kartify-mobile-quick-links{display:none}
    @media (max-width:1199.98px){
        #categoryCanvas .kartify-mobile-quick-links{display:block;margin:18px 16px 24px;padding-top:18px;border-top:1px solid #e6e8eb}
        #categoryCanvas .kartify-mobile-quick-links>h6{margin:0 0 10px;color:#252a34;font-size:13px;font-weight:700;line-height:1.3;letter-spacing:.04em;text-transform:uppercase}
        #categoryCanvas .kartify-quick-menu,
        #categoryCanvas .kartify-quick-children,
        #categoryCanvas .kartify-quick-grandchildren{margin:0;padding:0;list-style:none}
        #categoryCanvas .kartify-quick-menu>li{display:block;width:100%;border-bottom:1px solid #eef0f4;background:#fff}
        #categoryCanvas .kartify-quick-menu>li:last-child{border-bottom:0}
        #categoryCanvas .kartify-quick-row{display:flex;align-items:center;width:100%}
        #categoryCanvas .kartify-quick-row>a,
        #categoryCanvas .kartify-quick-row>.kartify-quick-primary-toggle,
        #categoryCanvas .kartify-quick-helper>a{display:flex;min-width:0;flex:1;align-items:center;gap:12px;padding:11px 4px;color:#252a34!important;background:transparent;border:0;text-align:left;text-decoration:none!important;font:inherit;cursor:pointer}
        #categoryCanvas .kartify-quick-details>summary{display:flex;min-width:0;align-items:center;gap:12px;padding:11px 4px;color:#252a34;list-style:none;cursor:pointer}
        #categoryCanvas .kartify-quick-details>summary::-webkit-details-marker{display:none}
        #categoryCanvas .kartify-quick-details>summary::marker{display:none;content:""}
        #categoryCanvas .kartify-quick-icon{display:inline-flex;flex:0 0 34px;width:34px;height:34px;align-items:center;justify-content:center;border-radius:8px;color:#ff9900;background:rgba(255,153,0,.12);font-size:18px}
        #categoryCanvas .kartify-quick-name{min-width:0;flex:1;overflow:hidden;color:inherit;font-size:14.5px;font-weight:600;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
        #categoryCanvas .kartify-quick-toggle{display:inline-flex;flex:0 0 38px;width:38px;height:38px;align-items:center;justify-content:center;margin-left:4px;padding:0;color:#596174;background:transparent;border:0;border-radius:50%;cursor:pointer}
        #categoryCanvas .kartify-quick-toggle:hover,
        #categoryCanvas .kartify-quick-toggle:focus-visible{color:#ff9900;background:rgba(255,153,0,.1)}
        #categoryCanvas .kartify-quick-chevron{font-size:21px;transition:transform .2s ease}
        #categoryCanvas .kartify-quick-expanded .kartify-quick-chevron{transform:rotate(90deg)}
        #categoryCanvas .kartify-quick-details[open]>summary .kartify-quick-chevron{transform:rotate(90deg)}
        #categoryCanvas .kartify-quick-children{display:none;padding:3px 0 9px 46px}
        #categoryCanvas .kartify-quick-children.kartify-quick-open{display:block}
        #categoryCanvas .kartify-quick-details[open]>.kartify-quick-children{display:block}
        #categoryCanvas .kartify-quick-children>li{display:block;width:100%;padding:0;border:0;background:transparent}
        #categoryCanvas .kartify-quick-children>li>a{display:block;padding:7px 9px;border-radius:6px;color:#343a48!important;font-size:14px!important;font-weight:500!important;line-height:1.35!important;text-decoration:none!important}
        #categoryCanvas .kartify-quick-grandchildren{padding:0 0 5px 13px}
        #categoryCanvas .kartify-quick-grandchildren a{display:block;padding:6px 8px;border-radius:5px;color:#687083!important;font-size:13px!important;font-weight:400!important;line-height:1.35!important;text-decoration:none!important}
        #categoryCanvas .kartify-quick-children a:hover,
        #categoryCanvas .kartify-quick-children a:focus-visible,
        #categoryCanvas .kartify-quick-grandchildren a:hover,
        #categoryCanvas .kartify-quick-grandchildren a:focus-visible{color:#ff9900!important;background:rgba(255,153,0,.08)}
        #categoryCanvas .kartify-quick-children>li.kartify-quick-view-all{margin-top:5px;padding-top:5px;border-top:1px solid #eef0f4}
        #categoryCanvas .kartify-quick-view-all>a{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600!important}
        #categoryCanvas .kartify-quick-helper-first{margin-top:5px;border-top:1px solid #e6e8ee}
    }

    /* MAIN_MENU() boş olduğunda CAT_MENU() verisi kullanılır. Kartify'nin normal
       dropdown/sub-menu sınıfları sayesinde 2. ve 3. seviyeler masaüstünde açılır. */
    .kartify-real-header .nav-light-header{align-items:center}
    .kartify-real-header .header-nav-middle{min-width:0;flex:1 1 auto;margin-left:clamp(14px,2vw,38px)}
    .kartify-real-header .header-nav-middle .main-nav{width:100%}
    .kartify-real-header .header-nav-middle .navbar-nav{max-width:100%;gap:clamp(10px,1vw,20px)!important;flex-wrap:nowrap}
    .kartify-real-header .header-nav-middle .nav-link{white-space:nowrap}
    .kartify-real-header .nav-light-header .category-button{display:inline-flex!important;min-width:190px;align-items:center!important;justify-content:flex-start;gap:12px;white-space:nowrap}
    .kartify-real-header .nav-light-header .category-button>i,
    .kartify-real-header .nav-light-header .category-button>span{display:inline-flex;align-items:center;margin:0!important;line-height:1!important}
    .kartify-real-header .nav-light-header .category-button>i{justify-content:center}
    .kartify-real-header .nav-light-header .category-button>span{font-size:18px!important;font-weight:600!important}

    /* Orijinal Kartify'deki Recent Viewer / Order Tracking grubu. Ana kategori
       listesinin parçası değildir; kalan alanın en sağına yerleşir. */
    .kartify-real-header .kartify-header-tools{display:none;flex:0 0 auto;margin-left:auto}
    .kartify-real-header .kartify-header-tools.kartify-tools-fit{display:flex!important}
    .kartify-real-header .kartify-header-tools.kartify-tools-measure{display:flex!important;position:absolute!important;visibility:hidden!important;pointer-events:none!important;width:max-content!important}
    .kartify-real-header .kartify-header-tools .product-viwer{display:flex;align-items:center;gap:0;margin:0;padding:0;list-style:none}
    .kartify-real-header .kartify-header-tools .product-viwer>li{display:block;margin:0;padding:0}
    .kartify-real-header .kartify-header-tools .product-viwer>li+li{margin-left:14px;padding-left:14px;border-left:1px solid rgba(var(--content-color),.28)}
    header.header-style-1.kartify-real-header .recent-light-header.kartify-header-tools .product-viwer>li>a{display:flex;color:rgba(var(--title-color),1);font-size:14px!important;font-weight:600!important;line-height:1.2;white-space:nowrap;text-decoration:none}
    .kartify-real-header .kartify-header-tools .product-link:hover{color:rgba(var(--primary-color),1)}
    .kartify-real-header .kartify-header-tools .product-viwer>li+li::before{content:none!important;display:none!important}

    /* Türkçe menü adları İngilizce Kartify örneğinden daha uzun. 1200–1599 px
       aralığında yedi öğeyi koruyan kompakt değerler kullanılır. Sağ yardımcı
       grup sabit breakpoint ile değil, aşağıdaki ölçüm koduyla yalnızca sığıyorsa açılır. */
    @media (min-width:1200px) and (max-width:1599.98px){
        .kartify-real-header .nav-light-header .category-button{min-width:160px;padding-inline:12px}
        .kartify-real-header .header-nav-middle{margin-left:6px}
        .kartify-real-header .header-nav-middle .navbar-nav{gap:4px!important}
        .kartify-real-header .header-nav-middle .nav-link{font-size:14px!important;padding-inline:2px!important}
        .kartify-real-header .kartify-header-tools .product-viwer>li+li{margin-left:6px;padding-left:6px}
        header.header-style-1.kartify-real-header .recent-light-header.kartify-header-tools .product-viwer>li>a{font-size:13px!important;font-weight:600!important}
    }

    /* Bootstrap navbar 1200 px altında mobil düğmeye geçtiği için aynı yatay
       listeyi ikinci kez göstermeyiz. Kategori paneli düğmesi erişilebilir kalır. */
    @media (max-width:1199.98px){
        .kartify-real-header .header-nav-middle{display:none!important}
        .kartify-real-header .kartify-header-tools,
        .kartify-real-header .kartify-header-tools.kartify-tools-fit{display:none!important}
        .kartify-real-header .nav-light-header{justify-content:flex-start}
        .kartify-real-header .nav-light-header .category-button{min-width:175px}
    }

    /* Mobil header: logoyu dengeli biçimde küçültür, temel aksiyonları daha
       görünür ve dokunulabilir yapar. */
    @media (max-width:991.98px){
        .kartify-real-header .main-header .left-header .header-logo,
        .kartify-real-header .main-header .left-header .header-logo img{
            width:145px!important;
            max-width:145px!important;
            height:auto!important;
            max-height:none!important;
        }
        .kartify-real-header #kartifyMobileMenuBtn{
            display:inline-flex!important;
            align-items:center;
            justify-content:center;
            flex:0 0 38px;
            width:38px;
            height:38px;
            margin-right:8px!important;
            padding:0!important;
        }
        .kartify-real-header #kartifyMobileMenuBtn .navbar-toggler-icon{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            width:100%;
            height:100%;
        }
        .kartify-real-header #kartifyMobileMenuBtn i{
            font-size:25px!important;
            line-height:1!important;
        }
        .kartify-real-header #searchClick,
        .kartify-real-header .kartify-mobile-account>a,
        .kartify-real-header #kartifyCartOpenBtn{
            position:relative;
            display:inline-flex!important;
            align-items:center;
            justify-content:center;
            width:36px;
            height:36px;
        }
        .kartify-real-header #searchClick i,
        .kartify-real-header .kartify-mobile-account>a>i,
        .kartify-real-header #kartifyCartOpenBtn>i{
            font-size:24px!important;
            line-height:1!important;
        }
        .kartify-real-header .kartify-mobile-account{
            display:block!important;
        }
    }
    @media (max-width:374.98px){
        .kartify-real-header .main-header .left-header .header-logo,
        .kartify-real-header .main-header .left-header .header-logo img{
            width:132px!important;
            max-width:132px!important;
        }
    }

    /* Sağdan açılan son görüntülenenler paneli. */
    #recentViwerModal{width:min(420px,100vw);z-index:1050}
    #recentViwerModal .title-offcanvas{display:flex;align-items:center;justify-content:space-between;width:100%}
    #recentViwerModal .title-offcanvas h4{margin:0}
    #recentViwerModal .close-btn{display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;font-size:24px}
    .kartify-recent-products{display:flex;flex-direction:column;gap:14px;margin:0;padding:0;list-style:none}
    .kartify-recent-products>li>a{display:flex;align-items:center;gap:14px;color:rgba(var(--title-color),1);text-decoration:none}
    .kartify-recent-image{display:flex;align-items:center;justify-content:center;flex:0 0 82px;width:82px;height:82px;padding:6px;border:1px solid rgba(var(--content-color),.12);border-radius:8px;background:#fff;overflow:hidden}
    .kartify-recent-image img{display:block;width:100%;height:100%;object-fit:contain}
    .kartify-recent-name{font-size:14px;line-height:1.4;font-weight:500}
    .kartify-recent-products>li>a:hover .kartify-recent-name{color:rgba(var(--primary-color),1)}
    .kartify-recent-empty{display:flex;min-height:220px;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:rgba(var(--content-color),1)}
    .kartify-recent-empty i{font-size:38px}
    .kartify-recent-empty p{margin:0}

    /* Bootstrap'in kendi backdrop'unu kullanmıyoruz (offcanvas JS'imiz kendi backdrop'unu yönetiyor). */
    .kartify-backdrop{position:fixed;inset:0;z-index:1040;background:rgba(15,23,42,.5);opacity:0;visibility:hidden;transition:opacity .25s ease}
    .kartify-backdrop.show{opacity:1;visibility:visible}

    /* Ofisomi'nin kendi custom.css'inde genel bir "header{padding:2rem 0rem}" kuralı var
       (tüm <header> etiketlerini hedefliyor). Kartify'nin kendi CSS'i buna karşı bir önlem
       almamış (kendi sitesinde başka bir framework CSS'i olmadığı için). Sadece bizim
       header'ımızı hedefleyip diğer sayfalardaki <header> kullanımlarına dokunmuyoruz. */
    header.header-style-1{padding:0!important}

    /* Paneldeki Üst Menü Yapışkan Özelliği, Ofisomi'nin eski
       .fullHorizontalMenuRow sınıfı yerine Kartify'nin 80px mavi header satırına bağlanır. */
    .kartify-sticky-header-sentinel{display:block;width:100%;height:0}
    .kartify-main-header-wrap{position:relative;z-index:1030;width:100%;background-color:rgba(var(--primary-color3),1)}
    .kartify-main-header-wrap>.main-header{margin-inline:auto}
    .kartify-main-header-wrap.kartify-header-is-fixed{position:fixed;top:0;right:0;left:0;z-index:1038;width:100%;box-shadow:0 5px 18px rgba(21,35,62,.16)}
    .kartify-sticky-header-spacer{display:none;width:100%;height:0}
    .kartify-sticky-header-spacer.kartify-spacer-is-active{display:block}

    /* --- Sepet mini-paneli: adet, silme ve toplam ---
       Kartify'nin kendi .vertical-product-box / .quantity-box / .close-button /
       .sub-total kurallari style.css'te hazir; burada yalnizca Kartify'da
       karsiligi olmayan parcalar ve Ofisomi renkleri var.
       Renk degeri duz yazildi: --primary-color bazi kapsamlarda sari
       cozuluyor (Paket 154'te canlida olculdu). */
    #cartOffcanvas .vertical-product-box{
        position:relative;
        align-items:flex-start;
    }
    #cartOffcanvas .vertical-product-box .product-content{
        padding-right:26px;
    }
    #cartOffcanvas .kartify-cart-variant{
        margin:2px 0 0;
        color:#666c7a;
        font-size:12px;
        font-weight:400;
        line-height:1.4;
    }
    #cartOffcanvas .vertical-product-box .price{
        margin:4px 0 6px;
        color:#20242c;
        font-weight:600;
    }
    #cartOffcanvas .quantity-box{
        display:flex;
        align-items:center;
        width:auto;
        max-width:132px;
        padding:4px;
        background:#f2f3f8;
        border-radius:6px;
    }
    #cartOffcanvas .quantity-box .btn{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:26px;
        height:26px;
        padding:0;
        color:#20242c;
        background:transparent;
        border:none;
    }
    #cartOffcanvas .quantity-box input{
        width:44px;
        min-width:0;
        height:auto;
        padding:0;
        color:#20242c;
        background:transparent;
        border:none;
        box-shadow:none;
        text-align:center;
        font-size:14px;
    }
    #cartOffcanvas .quantity-box input::-webkit-outer-spin-button,
    #cartOffcanvas .quantity-box input::-webkit-inner-spin-button{
        margin:0;
        -webkit-appearance:none;
    }
    #cartOffcanvas .quantity-box input[type=number]{
        -moz-appearance:textfield;
    }
    /* Adet degistirildiginde beliren onay dugmesi */
    #cartOffcanvas .kartify-cart-upd-btn{
        margin-top:6px;
        padding:4px 10px;
        color:#20242c;
        background:#fee501;
        border:none;
        border-radius:6px;
        font-size:12px;
        font-weight:600;
        line-height:1.3;
    }
    /* Satirin sag ust kosesindeki silme dugmesi */
    #cartOffcanvas .vertical-product-box .close-button{
        position:absolute;
        top:0;
        right:0;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:26px;
        height:26px;
        padding:0;
        color:#666c7a;
        background:transparent;
        border:none;
        font-size:17px;
        line-height:1;
    }
    #cartOffcanvas .vertical-product-box .close-button:hover{
        color:#f04438;
    }
    /* Toplam tutar satiri */
    #cartOffcanvas .total-price-box .sub-total{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        margin:0 0 12px;
        padding-bottom:12px;
        color:#20242c;
        border-bottom:1px solid #eceef3;
        font-size:16px;
        font-weight:600;
    }
    #cartOffcanvas .total-price-box .sub-total .cartTotalPrice{
        color:#ff9900;
        font-weight:700;
        white-space:nowrap;
    }
    #cartOffcanvas .total-price-box .sub-total .cartTotalPrice:empty::before{
        content:"\2014";
        color:#b6bbc6;
    }

    /* Küçük laptoplarda kullanılabilir yatay alanı artırır. Yalnızca header ve
       anasayfa bileşenleri hedeflenir; ürün, sepet ve ödeme sayfaları etkilenmez. */
    @media (min-width:1200px) and (max-width:1920px){
        .kartify-real-header .main-header.custom-container,
        .kartify-real-header .nav-light-header.custom-container,
        #home_wrapper .custom-container{
            box-sizing:border-box;
            width:100%!important;
            max-width:none!important;
            margin-right:0!important;
            margin-left:0!important;
            padding-right:10px!important;
            padding-left:10px!important;
        }
        #home_wrapper > .kartify-content-pin-strip{
            padding-right:0!important;
            padding-left:0!important;
        }
    }
    @media (min-width:992px) and (max-width:1199.98px){
        .kartify-real-header .main-header.custom-container,
        .kartify-real-header .nav-light-header.custom-container,
        #home_wrapper .custom-container{
            box-sizing:border-box;
            width:100%!important;
            max-width:none!important;
            margin-right:0!important;
            margin-left:0!important;
            padding-right:5px!important;
            padding-left:5px!important;
        }
        #home_wrapper > .kartify-content-pin-strip{
            padding-right:0!important;
            padding-left:0!important;
        }
    }
    @media (max-width:991.98px){
        #home_wrapper .custom-container{
            box-sizing:border-box;
            width:100%!important;
            max-width:none!important;
            margin-right:0!important;
            margin-left:0!important;
            padding-right:2px!important;
            padding-left:2px!important;
        }
        #home_wrapper > .kartify-content-pin-strip{
            padding-right:0!important;
            padding-left:0!important;
        }
    }

    /* AJAX ile sonradan eklenen arama görselleri lazyload.js'in ilk yükleme
       turuna yetişmediği için Kartify blur filtresinde kalmasın. */
    .searchlist .searchImg{
        opacity:1!important;
        filter:none!important;
    }
    /* ================================================================
       UYE PANELI (/profil) — Kartify uyarlamasi
       Referans: kartify template/user-dashboard.html
                 assets/scss/pages/_inner_page.scss -> .user-dashboard-section

       NEDEN BURADA, SAYFANIN KENDI SABLONUNDA DEGIL:
       Uye paneli sayfasi TEMA KLASORUNDE YOK. Entegra cekirdegi kendi
       gorunumunden basiyor; temaya yalnizca MAIN_HEADER()/MAIN_FOOTER()
       icin ugruyor (4 Eylul'de dogrulandi: Themes/profile/ altinda sadece
       login.tpl ve bayi-ol.tpl var; .profil-page / .ny-sidebar-card /
       .dashboard-right-sidebar siniflarinin hicbiri tema kaynaginda gecmiyor).
       Bu yuzden isaretleme degistirilemiyor, yalnizca CSS ile giydiriliyor.

       Panelin "Genel CSS" alani KULLANILMADI: bu header'da customsCssTag()
       bilerek kaldirilmis durumda (satir ~220'deki not), yani o alan siteye
       hic cikmiyor.

       Butun kurallar .profil-page kapsaminda; baska sayfalari etkilemez.
       ================================================================ */

    /* Sayfa genisligi: diger sayfalarla ayni olculer (10/5/2 px).
       Bu sayfa Bootstrap .container kullaniyor, custom-container degil.

       1920 px USTU AYRI ELE ALINIYOR - Paket 191'de atlanmisti.
       Diger sayfalarda kapsayici Kartify'nin .custom-container'idir ve
       1920 px ustunde Kartify'nin kendi akiskan formulu devreye girer,
       bu yuzden oralarda ust sinir birakmak sorun degil. Burada ise
       Bootstrap .container var; kural bitince max-width: 1320px'e
       kilitleniyordu.

       Canlida olculdu (2195 px pencere): profil sayfasi 1320 px,
       diger sayfalar 1811 px -> 491 px daha dar. Kullanicinin gordugu buydu.

       Cozum: 1920 px ustunde Kartify'nin KENDI formulu birebir uygulaniyor,
       boylece iki taraf ayni genislikte oluyor. Olcum sonrasi: ic bosluk
       184,96 px, icerik 1811 px - diger sayfalarla ayni. */
    @media (min-width: 1921px) {
        .profil-page > .container,
        .profil-page > main > .container {
            box-sizing: border-box;
            width: 100% !important;
            max-width: none !important;
            padding-right: calc(15px + 145 * (100vw - 320px) / 1600) !important;
            padding-left: calc(15px + 145 * (100vw - 320px) / 1600) !important;
        }
    }

    @media (min-width: 1200px) and (max-width: 1920px) {
        .profil-page > .container,
        .profil-page > main > .container {
            box-sizing: border-box;
            width: 100% !important;
            max-width: none !important;
            padding-right: 10px !important;
            padding-left: 10px !important;
        }
    }

    @media (min-width: 992px) and (max-width: 1199.98px) {
        .profil-page > .container,
        .profil-page > main > .container {
            box-sizing: border-box;
            width: 100% !important;
            max-width: none !important;
            padding-right: 5px !important;
            padding-left: 5px !important;
        }
    }

    @media (max-width: 991.98px) {
        .profil-page > .container,
        .profil-page > main > .container {
            box-sizing: border-box;
            width: 100% !important;
            max-width: none !important;
            padding-right: 2px !important;
            padding-left: 2px !important;
        }
    }

    /* NOT: Ic ice kapsayici duzeltmesi bilerek BURADA DEGIL.
       Siparis detayindaki .container.od-wrap'i o sayfanin kendi sablonu
       (Themes/siparisler/detay.tpl) uretiyor; duzeltme de orada duruyor.
       Buraya ".profil-page .container .container" gibi genel bir kural
       yazmak hesap alanindaki BUTUN ic ice kapsayicilari etkilerdi -
       ileride kasitli olarak ic ice kapsayici kullanan bir sayfa cikarsa
       sessizce bozardi. Kapsayici derinliginden kaynaklanan ve yalnizca
       platformun kabugunda cozulebilen kisim (main katmani) yukarida. */

    /* --- Sol kart: Kartify .dashboard-left-sidebar
       (beyaz, 7 px kose, cerceve yok, masaustunde yapiskan). --- */
    .profil-page .ny-sidebar-card {
        border: none !important;
        border-radius: 7px !important;
        box-shadow: 0 2px 14px rgba(25, 31, 46, .06) !important;
        overflow: hidden;
    }

    @media (min-width: 992px) {
        .profil-page .ny-sidebar-card {
            position: sticky;
            top: 10px;
        }
    }

    /* Kullanici blogu */
    .profil-page .ny-sidebar-user-avatar {
        background: #ff9900 !important;
    }

    .profil-page .ny-sidebar-user-name {
        color: #20242c;
        font-size: 16px;
        font-weight: 600;
    }

    .profil-page .ny-sidebar-user-email {
        color: #8a909e;
        font-size: 13px;
    }

    .profil-page .ny-lastlogin-badge {
        color: #8a909e;
        font-size: 12px;
    }

    /* --- Menu: Kartify .user-nav-pills .nav-link ---
       Onceki gorunumde madde zemini #e3e3e3 / baglanti zemini #f0f3f6 idi ve
       AKTIF madde ayirt edilemiyordu (canlida olculdu: aktif ile normal ayni
       zemin ve ayni renk). Kartify'da aktif madde 3 px sol cizgi + birincil
       renk + soluk gradyan zemin aliyor. */
    .profil-page .ny-sidebar-nav-item {
        background: transparent !important;
    }

    .profil-page .ny-nav-link {
        padding: 11px 16px !important;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #666c7a !important;
        background: transparent !important;
        border-left: 3px solid transparent;
        border-radius: 0 !important;
        font-size: clamp(14px, 1vw, 16px) !important;
        font-weight: 500 !important;
        text-align: left;
        text-decoration: none;
    }

    .profil-page .ny-nav-link:hover {
        color: #20242c !important;
        background: rgba(255, 153, 0, .06) !important;
    }

    .profil-page .ny-sidebar-nav-item.activelist .ny-nav-link {
        color: #ff9900 !important;
        font-weight: 600 !important;
        border-left-color: #ff9900;
        background: linear-gradient(90deg, rgba(255, 153, 0, .15) 0%, rgba(255, 153, 0, 0) 100%) !important;
    }

    .profil-page .ny-nav-icon {
        flex-shrink: 0;
        font-size: 17px;
    }

    .profil-page .ny-nav-arrow {
        margin-left: auto;
        color: #b6bbc6;
        font-size: 14px;
    }

    .profil-page .ny-sidebar-divider {
        margin: 0;
        height: 1px;
        background: rgba(102, 108, 122, .1);
    }

    /* --- Sag taraf: kisayol kutulari --- */
    .profil-page .dashboard-right-sidebar .text-content {
        margin-bottom: 16px;
        color: #666c7a;
        font-size: 15px;
    }

    .profil-page .dashboard-right-sidebar .text-title {
        color: #20242c;
    }

    .profil-page .servicesBox {
        height: 100%;
        padding: 26px 18px !important;
        border: none !important;
        border-radius: 7px !important;
        box-shadow: 0 2px 14px rgba(25, 31, 46, .06);
        transition: box-shadow .2s ease, transform .2s ease;
    }

    .profil-page .servicesBox:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(25, 31, 46, .10);
    }

    .profil-page .servicesBox a {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        color: #20242c !important;
        text-decoration: none;
    }

    .profil-page .servicesBox i {
        width: 52px;
        height: 52px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #ff9900;
        background: rgba(255, 153, 0, .1);
        border-radius: 50%;
        font-size: 22px;
    }

    .profil-page .servicesBox span {
        font-size: 15px;
        font-weight: 500;
        text-align: center;
    }

    /* Mobil menu dugmesi Kartify turuncusuna alinir. */
    .profil-page .buton-renk {
        color: #fff !important;
        background-color: #ff9900 !important;
        border: none !important;
        border-radius: 7px !important;
        font-size: 15px;
        font-weight: 600;
    }

    /* Uyelik kodu / QR satiri */
    .profil-page .membership-code-box {
        color: #666c7a;
        font-size: 13px;
    }

    .profil-page .qr-toggle {
        color: #666c7a;
        background: transparent;
        border: none;
    }

    /* ================================================================
       SIPARISLERIM LISTESI (/profil/siparisler)

       NEDEN BURADA: bu sayfanin isaretlemesi de, onu giydiren <style>
       blogu da tema klasorunde YOK. Canlida olculdu (4 Eylul):
       <style> etiketi "body > div.profil-page > style" konumunda,
       yani Entegra cekirdeginin uye paneli goruntusunden basiliyor.
       Themes/ altinda .order-row / .month-group / .mini-img gecen tek
       bir dosya bile yok. Bu yuzden Paket 194'teki ilkeye gore
       (duzeltme sorunu yaratan dosyada dursun) burasi dogru yer:
       kaynak dosyaya erisilemiyor.

       KURALLARIN NEDEN .profil-page ILE BASLADIGI: sayfanin kendi
       <style> blogu bizim head'imizden SONRA geliyor. Esit ozgullukte
       o kazanir; .profil-page ekleyerek ozgulluk (0,2,0) yapiliyor ve
       kurallarimiz oncelik aliyor.

       Duzeltilen dortlu (hepsi canlida olculdu):
       1. Urun gorselleri "SIPARIS NO" sutununun uzerine tasiyordu.
       2. Uzun degerler uc noktayla kesiliyordu ("Odeme On...").
       3. Acik ay panelinin alt kenari kirpiliyordu.
       4. Kartlar flex ile eziliyor, icerikleri disari tasiyordu.
       ================================================================ */

    /* 1) Gorsel seridi kendi sutununa sigmiyordu.
       Izgaranin ilk sutunu 152 px'e cikarildi: 5 gorsel x 40 px, aralarinda
       -12 px binisme => 40 + 4*28 = 152 px. Onceki 110 px'te serit 42 px
       tasiyor ve yanindaki "SIPARIS NO" sutununu ortuyordu (olcum: serit
       996 px'te bitiyor, sutun 972 px'te basliyor => 24 px cakisma).
       overflow-x:clip yalnizca guvenlik agi; 5'ten fazla gorsel gelirse
       duzeni bozmadan kirpar. clip (hidden degil) secildi cunku hidden
       diger ekseni de kesip gorsellerin 1 px'lik halkasini yerdi. */
    .profil-page .order-row {
        grid-template-columns: 152px minmax(0, 1.05fr) minmax(0, 1.5fr) minmax(0, 1.15fr) auto !important;
    }

    .profil-page .order-date-img-col {
        overflow-x: clip;
    }

    /* 2) Degerler kesilmesin, gerekirse alt satira insin.
       Sayfanin kendi kurali: white-space:nowrap + overflow:hidden +
       text-overflow:ellipsis. Kucuk ekranda "Odeme Onaylandi" ->
       "Odeme On..." oluyordu. overflow-wrap:anywhere yalnizca baska
       care kalmadiginda kelimeyi boler (siparis numarasi gibi tek
       parca metinler icin son care). */
    .profil-page .order-row .order-val {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
    }

    /* 3) Acik ay panelinin alt kenari kirpilmasin.

       Panel display:flex + overflow:hidden; sayfanin kendi betigi max-height'i
       TIKLAMA aninda tam olarak scrollHeight'a esitliyor ve bir daha
       guncellemiyor. Bu yuzden son kartin 1 px'lik alt cizgisi ile hover
       golgesi tam kirpma sinirinda kaliyor; yazi tipi/gorsel sonradan
       yuklenip satir uzarsa ya da pencere boyu degisirse deger bayatliyor
       ve kart yarisindan kesiliyor.

       COZUM: panel ACIKKEN kirpma tamamen kaldiriliyor. Boylece hicbir
       bayat olcum kart kesemez. Kapali durumda max-height:0 + overflow:hidden
       oldugu gibi duruyor, yani kapaliyken hicbir sey sizmiyor.

       BEDELI: acilis animasyonu artik yok (max-height 0'dan "none"a
       animasyon edilemez). Kirpilmama ugruna bilerek verildi.

       PAKET 195'TEKI HATA: burada 8 px'lik "yastik" (padding-bottom) vardi.
       Kutu border-box oldugu icin KAPALI durumda da panel 8 px yer kapliyor
       ve ilk kartin tarih rozetinin ucu ay basliginin altindan sizip
       gorunuyordu (Berkan bildirdi, canlida dogrulandi: kapali panel 8 px).
       Yastik kaldirildi; yerine yukaridaki kirpmasiz cozum kondu.

       gap 16 -> 24: bir sonraki kartin tarih rozeti top:-11px ile yukari
       tastigi icin onceki kartin alt cizgisine binmis gorunuyordu. */
    .profil-page .month-orders {
        gap: 24px !important;
    }

    .profil-page .month-group.open .month-orders {
        max-height: none !important;
        overflow: visible !important;
    }

    /* 4) Kartlar ezilmesin.
       .month-orders bir sutun flex kabi; kartlar varsayilan flex-shrink:1
       ile max-height dolunca EZILIYOR, icerikleri karttan tasip panelin
       overflow:hidden'ina takiliyordu (mobil ekran goruntusundeki yarim
       kesilmis kartin sebebi buydu). */
    .profil-page .month-orders > .order-row {
        flex: 0 0 auto !important;
    }

    /* Orta ekran (tablet / kucuk dizustu): bes sutun sigmiyor.
       Iki satirli duzen: ustte gorsel + siparis no + odeme turu,
       altta durum + butonlar. Bu araligi olctugumuzde bes sutunlu
       duzende siparis numarasi bile satira sigmiyordu. */
    @media (min-width: 768px) and (max-width: 1199px) {
        .profil-page .order-row {
            grid-template-columns: 152px minmax(0, 1fr) minmax(0, 1fr) !important;
            row-gap: 14px !important;
        }

        .profil-page .order-row > .text-right {
            grid-column: 2 / -1 !important;
            justify-self: end !important;
        }
    }

    /* Mobil: sayfanin KENDI tek sutunlu duzeni korunmali.
       Yukaridaki temel kural .profil-page ile daha ozgul oldugu icin
       sayfanin "grid-template-columns:1fr!important" mobil kuralini
       ezerdi; burada geri veriliyor. Butonlar 320 px'te tasmasin diye
       sarmaya aciliyor. */
    @media (max-width: 767px) {
        .profil-page .order-row {
            grid-template-columns: 1fr !important;
        }

        .profil-page .order-row > .text-right {
            flex-wrap: wrap !important;
            gap: 8px !important;
        }

        .profil-page .order-date-img-col {
            overflow-x: visible;
        }
    }

    /* ================================================================
       FAVORILERIM (/profil/favori) — karttaki kaldirma dugmesi

       NEDEN BURADA: siparisler listesinde oldugu gibi bu sayfa da tema
       klasorunde yok; isaretleme Entegra cekirdeginden geliyor ve
       profil/genel.css ile giydiriliyor. Kaynak dosyaya erisilemiyor,
       o yuzden Paket 194'un ilkesine gore duzeltme buraya yaziliyor.

       SORUN (canlida olculdu):
       1. X isareti SARI idi (rgb(254,229,1)). Hicbir kural rengi
          vermiyordu; renk, ikonu saran <a> etiketinden miras aliniyordu
          ve eski temanin baglanti rengi sari. Beyaz daire uzerinde sari
          bir X neredeyse gorunmuyordu.
       2. Dugme bosluga asili duruyordu. Kart .card.border-0, zemini
          beyaz, panel de beyaz - yani kartin sinirlari gorunmuyor.
          Ustelik dugme urun gorselinin 43 px YUKARISINDA, tamamen bos
          bir alanda kaliyordu (olcum: ikon y=340, gorsel alani y=383).
       3. Golge agir ve bulanikti: rgba(34,34,34,.24) 0 3px 3px.

       COZUM:
       - Gorsel alanina sitenin her yerinde kullandigimiz gri zemin
         verildi (sepet Paket 174, anasayfa slider'lari Paket 177 ile
         ayni: #f2f3f8 + 8px kose + mix-blend-mode:multiply). Boylece
         kart bir kart gibi okunuyor ve dugmenin uzerinde duracagi bir
         yuzey oluyor.
       - Ikonu saran <a> bos bir satir kutusu uretiyordu (24 px). O satir
         kapatilinca gri zemin kart govdesinin tepesine oturuyor ve
         .card-body'ye gore konumlanan X, zeminin sag ust kosesine
         dusuyor. Boylece sihirli bir "top" degeri yazmaya gerek kalmadi.
       - Dugme: 24 -> 30 px, ikon 14 -> 18 px, renk Kartify'nin
         content-color'i, ince #e5e7ed kenarlik, yumusak golge.
         Uzerine gelince turuncuya donuyor (#ff9900) - silme oldugu
         icin belirgin bir geri bildirim.

       TIKLAMA KORUNDU: X'i saran <a> hem href hem onclick tasiyor.
       Yukseklik 0 verilse de mutlak konumlu ikon tiklanabilir kaliyor;
       canlida dogrulandi (elementFromPoint ikonu donduruyor). Favori
       silme akisina hic dokunulmadi.

       KAPSAM: .product-card sinifi panelin diger sayfalarinda yok
       (Profil, Stok Taleplerim'de arandi, 0 sonuc). Gri zemin kurallari
       yine de "a:first-child + .text-center" birlesimiyle yaziliyor;
       yalnizca ilk cocugu X baglantisi olan kartlarda calisir. */
    .profil-page .product-card .card-body {
        padding-top: 0 !important;
    }

    /* Ikonu saran bos <a> satirini kaldirir. */
    .profil-page .product-card .card-body > a:first-child {
        display: block !important;
        height: 0 !important;
        line-height: 0 !important;
    }

    .profil-page .product-card .card-body > a:first-child + .text-center {
        margin-top: 0 !important;
        background-color: #f2f3f8 !important;
        border-radius: 8px !important;
        padding: 12px !important;
    }

    .profil-page .product-card .card-body > a:first-child + .text-center img {
        object-fit: contain;
        mix-blend-mode: multiply;
    }

    .profil-page .favorite-icon-x {
        top: 8px !important;
        right: 8px !important;
        width: 30px !important;
        height: 30px !important;
        font-size: 18px !important;
        line-height: 1 !important;
        color: rgba(var(--content-color), 1) !important;
        background-color: #fff !important;
        border: 1px solid #e5e7ed !important;
        border-radius: 100% !important;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .08) !important;
        transition: all .3s ease !important;
        cursor: pointer;
    }

    .profil-page .favorite-icon-x:hover {
        color: #fff !important;
        background-color: #ff9900 !important;
        border-color: #ff9900 !important;
        box-shadow: 0 4px 12px rgba(255, 153, 0, .35) !important;
    }

    /* ================================================================
       SEPETE EKLENDI PENCERESI (.ny-add-cart-modal)

       Isaretleme bu dosyada (yukarida, ~230. satir); giydirmesi ise
       Assets/css/custom.css'te (426-443. satirlar). custom.css head'de
       bizden ONCE yuklendigi icin buradaki kurallar onu eziyor.

       BULUNAN SORUNLAR (canlida olculdu):

       1. "Sepete Git" dugmesinin ZEMINI YOKTU. custom.css sunu diyor:
          background-color: var(--productBtBgColor)
          Bu degisken sitede TANIMSIZ (olculdu: bos deger), tanimsiz
          degisken de seffafa dusuyor. Sonuc: hesaplanan zemin
          rgba(0,0,0,0) - yani sayfanin ana eylem dugmesi duz yazi gibi
          gorunuyordu. (Ayni tuzak daha once --goUpBtnBg ve --bs-primary
          ile de yasandi; bu yuzden burada duz #ff9900 yaziliyor.)
       2. Kapatma dugmesi kartin DISINDA duruyordu (top:-18px,
          right:-13px) - kutunun kosesinden tasip sayfanin uzerine
          binmis gorunuyordu.
       3. Urun basligi tek satira kilitliydi (width:300px + nowrap +
          ellipsis), uzun isimler "...Mesh..." diye kesiliyordu.
       4. Gorsel object-fit:cover ile kirpiliyor, gri kenarlikla
          duruyordu; sitenin geri kalanindaki gri zemin dilinde degildi.
       5. Kutu 1px #888 kenarlikli, %40 genislikte ve golgesizdi.

       KARTIFY KARSILIKLARI (assets/css/style.css):
         .btn            -> border-radius:5px, font-weight:500,
                            padding ~11px 18px 9px, transition .25s
         --primary-color -> 255,153,0   (birincil dugme)
         --theme-green   -> 70,147,71   (basari yazisi)
         --base-gray     -> 242,243,248 (gorsel zemini)
       Degiskenlerin sitede dogru cozuldugu olculdu, yine de kritik
       renkler duz yazildi.

       Isaretlemede yalnizca uc sinif degisti: gorsel sutununa
       .kartify-cart-modal-thumb eklendi, metin sutunu col-md-7 -> 6,
       dugme sutunu col-md-3 -> 4 (620 px'lik kutuda "Alisverise Devam
       Et" iki satira kiriliyordu). Hicbir id/JS baglantisi degismedi. */
    /* z-index 9999 -> 10050: yuzen "Yukari Cik" ve WhatsApp dugmeleri de
       9999'da (footer.tpl). Esit deger + DOM'da sonra geldikleri icin
       pencerenin ORTUSUNUN uzerinde kaliyorlardi; mobilde "Alisverise
       Devam Et" dugmesinin uzerine biniyordu. Artik ortu ikisinin de
       ustunde - dugmeler pencere acikken karartinin altinda kaliyor. */
    .ny-add-cart-modal {
        background-color: rgba(0, 0, 0, .55) !important;
        z-index: 10050 !important;
    }

    /* Ust bosluk 24 -> 44: kapatma dugmesi kendi seridinde dursun.
       24 px'te dugme "Sepete Git"in hemen ustune biniyordu (olcum: aradaki
       dikey bosluk 12 px). 44 px'te bosluk 21 px'e cikiyor ve dugme
       icerikten ayri, kendi kosesinde duruyor. */
    .ny-add-cart-modal-content {
        width: min(92%, 620px) !important;
        margin: 10vh auto 40px !important;
        padding: 44px 24px 24px !important;
        border: none !important;
        border-radius: 12px !important;
        box-shadow: 0 18px 50px rgba(0, 0, 0, .18) !important;
    }

    /* Kapatma dugmesi kartin ICINE alindi; favorilerdeki dugmeyle ayni dil. */
    .ny-add-cart-modal-close-btn {
        top: 12px !important;
        right: 14px !important;
        width: 30px !important;
        height: 30px !important;
        line-height: 28px !important;
        font-size: 20px !important;
        color: rgba(var(--content-color), 1) !important;
        background-color: #fff !important;
        border: 1px solid #e5e7ed !important;
        border-radius: 100% !important;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .08) !important;
        transition: all .3s ease !important;
    }

    .ny-add-cart-modal-close-btn:hover,
    .ny-add-cart-modal-close-btn:focus {
        color: #fff !important;
        background-color: #ff9900 !important;
        border-color: #ff9900 !important;
    }

    .ny-add-cart-success-title {
        display: inline-flex !important;
        align-items: center;
        gap: 6px;
        color: #469347 !important;
        font-weight: 600;
        font-size: 14px;
        margin-bottom: 6px;
    }

    /* Gorsel: sitenin her yerindeki gri zemin (sepet P174, slider P177). */
    .kartify-cart-modal-thumb {
        padding: 10px !important;
        background-color: #f2f3f8 !important;
        border-radius: 8px !important;
    }

    .ny-add-cart-modal-img {
        border: none !important;
        border-radius: 0 !important;
        background: transparent !important;
        aspect-ratio: 1 / 1;
        object-fit: contain !important;
        mix-blend-mode: multiply;
    }

    /* Baslik tek satira sikismasin; iki satira kadar acilsin. */
    .ny-add-cart-modal-title {
        width: auto !important;
        white-space: normal !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: rgba(var(--title-color), 1) !important;
        font-size: 15px !important;
        line-height: 1.4 !important;
        margin-bottom: 6px;
    }

    .ny-add-cart-modal-info {
        color: rgba(var(--content-color), 1) !important;
        font-size: 14px !important;
    }

    #product-price {
        color: rgba(var(--title-color), 1) !important;
        font-weight: 600 !important;
        font-size: 16px !important;
        margin-top: 2px;
    }

    /* Dugmeler: Kartify .btn olculeri. */
    .ny-add-cart-modal-btn {
        padding: 11px 18px 9px !important;
        border-radius: 5px !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        transition: all .25s ease-in-out !important;
    }

    .ny-add-cart-modal-cart-btn,
    .ny-add-cart-modal-cart-btn:hover {
        background-color: #ff9900 !important;
        border: 1px solid #ff9900 !important;
        color: #fff !important;
    }

    .ny-add-cart-modal-cont-btn {
        background-color: #fff !important;
        border: 1px solid #e5e7ed !important;
        color: rgba(var(--title-color), 1) !important;
        font-weight: 500 !important;
    }

    .ny-add-cart-modal-cont-btn:hover {
        background-color: #f2f3f8 !important;
        border-color: #e5e7ed !important;
        color: rgba(var(--title-color), 1) !important;
    }

    /* Mobil: custom.css'teki 300-500 px kurali yerine tam genislik.
       Gorsel ortada kucuk bir kare, metinler ortali, dugmeler tam en. */
    @media (max-width: 575.98px) {
        .ny-add-cart-modal-content {
            width: 92% !important;
            margin: 8vh auto 24px !important;
            padding: 40px 18px 18px !important;
        }

        .kartify-cart-modal-thumb {
            width: 96px !important;
            margin: 0 auto 12px !important;
            padding: 8px !important;
        }

        .ny-add-cart-modal-container {
            align-items: center !important;
            text-align: center;
        }

        .ny-add-cart-modal-title {
            text-align: center;
        }

        .ny-add-cart-modal-btnzone {
            margin-top: 14px !important;
            row-gap: 8px;
        }
    }

    /* ================================================================
       MOBIL ARAMA - yakinlastirma, klavye ve sol kirpilma
       ================================================================

       1) YAKINLASTIRMA (ve onun yan etkisi olan sol kenar kirpilmasi)

       iOS Safari, odaklanilan bir metin alaninin yazi boyutu 16px'in
       ALTINDAYSA sayfayi kendiliginden yakinlastirir. Bu bir hata degil,
       Safari'nin kurali. Kartify'nin kendi kurali arama kutusunu 14px
       yapiyor:

           style.css 9506-9513
           .header-style-1 .main-header .middle-header
           .search-form .input-group .form-control { font-size: 14px }

       Canlida olculdu: #q -> 14px. Yakinlasma olunca gorsel alan
       daraliyor ama DUZEN alani (innerWidth) 375px kaliyor; Safari
       sayfayi saga kaydirdigi icin sol kenar kirpilmis gibi gorunuyor.
       Yani ikinci sikayet birincinin sonucu.

       Cozum mobilde 16px. meta viewport'a "user-scalable=no" veya
       "maximum-scale=1" YAZILMADI: parmakla yakinlastirmayi herkes icin
       kapatir, erisilebilirlik acisindan dogru degil - ustelik modern
       Safari cogu durumda dinlemez de.
       ================================================================ */
    @media (max-width: 991.98px) {

        .header-style-1 .main-header .middle-header .search-form .input-group .form-control,
        #q,
        #q-mobile,
        .mobile-search-inp {
            font-size: 16px !important;
        }
    }

    /* ================================================================
       2) ONERI PANELI KLAVYENIN ALTINDA KALIYOR

       Panelin yuksekligini uploads/assets/omi/js/../css/search-modal.css
       siniriliyor:

           .ny-sm-panel { max-height: min(78vh, 640px); overflow-y: auto }

       "vh" DUZEN alanini olcer ve mobilde klavye acilinca KUCULMEZ.
       812px'lik bir telefonda panel 633px oluyor, klavye alttan ~330px
       kapatiyor -> panelin alt ucte biri gorunmuyor. (Canlida olculdu:
       max-height 633.36px, panel ust noktasi 36px.)

       Asagidaki degiskeni betik gercekten gorunen alandan
       (visualViewport) hesaplayip yaziyor. Degisken yoksa eski deger
       gecerli, yani betik calismazsa davranis bugunku gibi kalir.
       Panelde zaten "overflow-y:auto" var: kisalan panel kendi icinde
       kayiyor, hicbir sonuc kaybolmuyor.
       ================================================================ */
    .ny-sm-panel {
        max-height: var(--ofm-sm-max, min(78vh, 640px)) !important;
    }

    /* ================================================================
       3) PANEL DAR EKRANDA SOLA HIZALANMIYOR

       search-modal.js paneli arama kutusunun sol kenarina hizaliyor ve
       genisligi en az 320px tutuyor. 375px'lik ekranda sonuc:
       left=47px, width=320px - solda 47px bos, panel saga kacik
       duruyor. (Canlida olculdu.) Dar ekranda iki yanda 8px birakip
       tam genisligi kullansin. Betik her seferinde inline left/width
       yazdigi icin !important sart.
       ================================================================ */
    @media (max-width: 575.98px) {

        .ny-sm-panel {
            left: 8px !important;
            right: 8px !important;
            width: auto !important;
        }
    }

/* =============================================================
   Paket 279 — mobil aramada cift kapatma simgesi giderildi.

   Sorun: Paket 265 ile close-line.svg yuklenince, tarayicinin
   YEREL temizle dugmesi gorunur hale geldi ve temanin kendi
   simgesiyle (.close-icon) ust uste bindi.

   Ikisi ayni sey degil:
     - Temanin simgesi -> mobil arama panelini KAPATIR (#close-btn)
     - Yerel dugme      -> yazilan metni TEMIZLER

   Temanin simgesi yalniz mobilde gorunur; platformun style.css
   dosyasinda .middle-header .close-icon varsayilan olarak gizli,
   max-width 991.98px altinda gorunur yapiliyor.

   Bu yuzden yerel dugme TAM AYNI kirilma noktasinda gizleniyor:
   masaustunde metni temizleme simgesi kalir (265'in kazanimi),
   mobilde yalniz temanin kapatma simgesi gorunur.

   Kapsam .middle-header ile sinirli; baska bir arama kutusu
   eklenirse onun temizle dugmesi etkilenmez.
   ============================================================= */
   @media (max-width: 991.98px) {
        .middle-header .search-form input[type="search" i]::-webkit-search-cancel-button {
           display: none !important;
        }
    }