/* Makker B2B — eklenti stilleri */

/* ==========================================================================
   MARKA PALETİ — logo.jpeg'den ölçüldü
   ========================================================================== */
:root {
    --mk-petrol:        #123133; /* logo altıgen gövdesi */
    --mk-petrol-koyu:   #0d2426; /* mega menü, alt şerit */
    --mk-petrol-acik:   #1a4245; /* hover */
    --mk-bordo:         #351D2A; /* logo arka planı, bayi şeridi */
    --mk-bordo-acik:    #4a2a3b;
    --mk-altin:         #C0A071; /* logo yazısı — ana vurgu */
    --mk-altin-acik:    #E2CD96; /* şerit vurgusu, hover */
    --mk-altin-antik:   #CFA86D; /* logo çerçevesi */
    --mk-sayfa-bg:      #F6F6F6;
    --mk-cizgi:         #e4e4e4;
}

/* --------------------------------------------------------------------------
   WoodMart değişken ezmeleri
   Mega Electronics demosu rgb(28,97,231) mavisiyle geliyor; hepsini
   marka paletine çeviriyoruz.
   -------------------------------------------------------------------------- */
:root,
.wd-content-layout {
    --wd-primary-color:      var(--mk-petrol);
    --wd-alternative-color:  var(--mk-altin);
    --wd-link-color:         var(--mk-petrol);
    --wd-link-color-hover:   var(--mk-altin-antik);
    --wd-main-bgcolor:       #ffffff;
}

/* ==========================================================================
   ÜST ŞERİT — koyu petrol yeşili.
   Header de yeşil olduğu için bir ton koyu tutuluyor, yoksa ikisi
   tek blok gibi görünüp ayrım kayboluyor.
   ========================================================================== */
.whb-top-bar,
.mk-ust-serit {
    background-color: var(--mk-petrol-koyu) !important;
    color: var(--mk-altin-acik);
}
.whb-top-bar a,
.mk-ust-serit a {
    color: var(--mk-altin-acik);
}
.whb-top-bar a:hover,
.mk-ust-serit a:hover {
    color: #fff;
}

/* Bayi göstergesi — giriş yapmış bayi bunu her sayfada görür */
.mk-bayi-serit {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    justify-content: center;
    background: var(--mk-bordo);
    color: var(--mk-altin-acik);
    padding: 7px 16px;
    font-size: 13px;
}
.mk-bayi-serit strong { color: #fff; font-weight: 600; }
.mk-bayi-serit .mk-iskonto-etiket {
    border: 1px solid var(--mk-altin);
    border-radius: 20px;
    padding: 1px 10px;
}

/* ==========================================================================
   HEADER — petrol yeşili
   ========================================================================== */
/* Logo + arama satırı: bordo (menü şeridiyle aynı blok) */
body .whb-general-header,
body .whb-general-header-inner {
    background-color: var(--mk-bordo) !important;
}
/* Kapsayıcı da bordo, üst şerit ayrı kalsın diye alt sınır çizgisi */
.whb-main-header {
    background-color: var(--mk-bordo) !important;
}
body .whb-header-bottom {
    border-top: 1px solid rgba(226, 205, 150, .14);
}

/* Menü şeridi: bordo.
   WoodMart header renklerini satır içi CSS olarak da basabildiği için
   özgüllük bilerek yüksek tutuldu ve olası tüm satır sınıfları hedeflendi. */
body .whb-header-bottom,
body .whb-header-bottom .whb-column,
body .whb-header-bottom .whb-flex-row,
body .whb-row.whb-header-bottom,
body .whb-header-bottom-inner,
body .whb-sticky-row.whb-header-bottom,
body .wd-header-nav-wrapper,
body .whb-clone .whb-header-bottom {
    background-color: var(--mk-bordo) !important;
    background-image: none !important;
}
.whb-main-header .wd-tools-element > a,
.whb-main-header .wd-tools-element .wd-tools-icon,
.whb-main-header .wd-header-nav .menu-item > a {
    color: var(--mk-altin-acik) !important;
}
.whb-main-header .wd-tools-element > a:hover,
.whb-main-header .wd-header-nav .menu-item > a:hover {
    color: #fff !important;
}
/* sepet/istek listesi sayaç balonu */
.whb-main-header .wd-tools-count {
    background-color: var(--mk-altin) !important;
    color: var(--mk-bordo) !important;
}

/* Logo — kare/dikey oranlı olduğu için yüksekliği sınırlıyoruz,
   yoksa header'ı gereksiz yere uzatıyor. */
.wd-logo img,
.site-logo img,
.whb-column .wd-logo img {
    max-height: 58px !important;
    width: auto !important;
}
@media (max-width: 768px) {
    .wd-logo img,
    .site-logo img { max-height: 44px !important; }
}

/* Arama kutusu — beyaz gövde, altın buton (Amazon mantığı) */
.whb-main-header .wd-search-form input[type="text"],
.whb-main-header .searchform input[type="text"] {
    background: #fff;
    border: none;
    border-radius: 6px 0 0 6px;
    color: #333;
}
.whb-main-header .searchsubmit,
.whb-main-header .wd-search-form button {
    background: var(--mk-altin) !important;
    color: var(--mk-bordo) !important;
    border: none;
    border-radius: 0 6px 6px 0;
}
.whb-main-header .searchsubmit:hover,
.whb-main-header .wd-search-form button:hover {
    background: var(--mk-altin-acik) !important;
}

/* Demo header'ından gelen "All Categories" açılır kategori menüsü.
   Kurulum kodu bunu header verisinden de kaldırıyor; bu kural, header
   yapısı beklenenden farklıysa diye ikinci güvence. */
.wd-header-cats,
.whb-column .wd-header-cats,
.wd-dropdown-cats {
    display: none !important;
}

/* Menü bağlantıları — bordo zeminde altın */
.whb-header-bottom .wd-nav-main > li > a {
    color: var(--mk-altin-acik) !important;
}
.whb-header-bottom .wd-nav-main > li > a:hover,
.whb-header-bottom .wd-nav-main > li.current-menu-item > a {
    color: #fff !important;
}
.wd-nav-main .wd-dropdown-menu,
.wd-nav-main .wd-dropdown {
    border-top: 3px solid var(--mk-altin);
}

/* ==========================================================================
   BUTONLAR — altın zemin + koyu bordo yazı (altın üstünde beyaz okunmuyor)
   ========================================================================== */
.btn.btn-color-primary,
.button.alt,
.single_add_to_cart_button,
.wd-buy-now-btn,
.checkout-button,
.wd-btn-accent,
input[type="submit"].button {
    background-color: var(--mk-altin) !important;
    color: var(--mk-bordo) !important;
    border-color: var(--mk-altin) !important;
    font-weight: 600;
}
.btn.btn-color-primary:hover,
.button.alt:hover,
.single_add_to_cart_button:hover,
.wd-buy-now-btn:hover,
.checkout-button:hover,
.wd-btn-accent:hover,
input[type="submit"].button:hover {
    background-color: var(--mk-altin-acik) !important;
    color: var(--mk-bordo) !important;
    border-color: var(--mk-altin-acik) !important;
}

/* İkincil buton — petrol çerçeve */
.btn.btn-style-bordered,
.button:not(.alt):not(.checkout-button) {
    background-color: transparent;
    color: var(--mk-petrol);
    border: 1px solid var(--mk-petrol);
}
.btn.btn-style-bordered:hover,
.button:not(.alt):not(.checkout-button):hover {
    background-color: var(--mk-petrol);
    color: #fff;
}

/* ==========================================================================
   ÜRÜN KARTLARI — gövde beyaz kalır.
   Ürün fotoğraflarının tamamı beyaz fonlu; koyu zeminde kesik görünürler.
   ========================================================================== */
.wd-product .product-wrapper { background: #fff; }
.wd-product .price,
.woocommerce-Price-amount {
    color: var(--mk-petrol);
    font-weight: 600;
}
.wd-product .price del { color: #999; font-weight: 400; }
.wd-product .price ins { color: #a32d2d; text-decoration: none; }

/* İndirim / yeni etiketi */
.product-label.onsale {
    background-color: var(--mk-bordo) !important;
    color: var(--mk-altin-acik) !important;
}
.product-label.new {
    background-color: var(--mk-altin) !important;
    color: var(--mk-bordo) !important;
}
/* HUUB etiketi — öncelikli marka vurgusu */
.product-label.mk-huub {
    background-color: var(--mk-petrol) !important;
    color: var(--mk-altin-acik) !important;
}

/* Yıldızlar altın */
.star-rating span::before,
.wd-star-rating span::before { color: var(--mk-altin-antik); }

/* ==========================================================================
   MEGA ELECTRONICS DEMO SAYFASI — marka paletine çekme
   Demo rgb(28,97,231) mavisiyle geliyor; Elementor blokları tema
   değişkenlerini değil kendi satır içi renklerini kullandığı için
   burada tek tek eziyoruz.
   ========================================================================== */
.elementor-widget-wd_products .btn,
.elementor-widget-wd_products .button,
.elementor-widget-wd_products .add_to_cart_button,
.elementor-widget-wd_products .wd-buy-now-btn,
.elementor .add_to_cart_button,
.elementor .single_add_to_cart_button,
.elementor .wd-add-btn > a {
    background-color: var(--mk-altin) !important;
    color: var(--mk-bordo) !important;
    border-color: var(--mk-altin) !important;
    font-weight: 600 !important;
}
.elementor-widget-wd_products .btn:hover,
.elementor-widget-wd_products .button:hover,
.elementor-widget-wd_products .add_to_cart_button:hover,
.elementor .add_to_cart_button:hover,
.elementor .wd-add-btn > a:hover {
    background-color: var(--mk-altin-acik) !important;
    color: var(--mk-bordo) !important;
}

/* Demo mavisi kullanan butonlar ve rozetler */
.elementor [class*="wd-"][style*="rgb(28, 97, 231)"],
.elementor [class*="wd-"][style*="#1c61e7"] {
    background-color: var(--mk-petrol) !important;
}
.elementor .product-label.onsale,
.elementor .wd-product-label {
    background-color: var(--mk-bordo) !important;
    color: var(--mk-altin-acik) !important;
}
.elementor .price,
.elementor .woocommerce-Price-amount {
    color: var(--mk-petrol) !important;
    font-weight: 600;
}

/* Bölüm başlıklarına altın imza — premium dokunuş */
.elementor-widget-wd_title .title,
.elementor-widget-wd_title .liner-continer,
.elementor-widget-heading .elementor-heading-title {
    color: var(--mk-petrol) !important;
    position: relative;
}
.elementor-widget-wd_title .title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -9px;
    width: 52px;
    height: 2px;
    background: var(--mk-altin);
}
.elementor-widget-wd_title { padding-bottom: 6px; }

/* Bağlantı ve "daha fazla" ok butonları */
.elementor .wd-more-btn > a,
.elementor .wd-nav-arrows .wd-btn-arrow:hover {
    color: var(--mk-petrol) !important;
    border-color: var(--mk-altin) !important;
}

/* Demo geri sayımı marka renginde */
.elementor .wd-timer .wd-timer-block,
.elementor .countdown-section {
    background-color: var(--mk-bordo) !important;
    color: var(--mk-altin-acik) !important;
}

/* Ürün kartlarına premium hover */
.elementor .wd-product .product-wrapper {
    border-radius: 10px;
    transition: box-shadow .25s, transform .25s;
}
.elementor .wd-product:hover .product-wrapper {
    box-shadow: 0 6px 20px rgba(18, 49, 51, .10);
    transform: translateY(-2px);
}

/* ==========================================================================
   B2B FİYAT GÖSTERİMİ
   ========================================================================== */
.mk-b2b-fiyat {
    display: block;
    margin-top: 4px;
    padding: 8px 12px;
    background: #f4f0e8;
    border-left: 3px solid var(--mk-altin);
    font-size: 13px;
    line-height: 1.6;
    color: var(--mk-bordo);
}
.mk-b2b-fiyat .mk-b2b-tutar {
    font-size: 17px;
    font-weight: 600;
    color: var(--mk-petrol);
}
.mk-b2b-fiyat .mk-b2b-kosul { color: #6b5b4a; }
/* PHP tarafı .mk-iskonto-orani basıyor; ikisini de destekliyoruz ki
   bayi ürün sayfasındaki rozet stilsiz kalmasın. */
.mk-b2b-iskonto-orani,
.mk-iskonto-orani {
    display: inline-block;
    background: var(--mk-petrol);
    color: var(--mk-altin-acik);
    border-radius: 4px;
    padding: 1px 7px;
    font-size: 12px;
    margin-left: 6px;
}
/* Misafire kapalı toptan fiyat uyarısı */
.mk-toptan-kapali {
    background: #f4f0e8;
    border: 1px dashed var(--mk-altin-antik);
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 13px;
    color: var(--mk-bordo);
    margin: 12px 0;
}
.mk-toptan-kapali a { color: var(--mk-petrol); font-weight: 600; }

/* ==========================================================================
   ANA SAYFA BÖLÜM BAŞLIKLARI
   ========================================================================== */
.mk-bolum-baslik {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 2px solid var(--mk-cizgi);
    margin-bottom: 22px;
    padding-bottom: 10px;
}
.mk-bolum-baslik h2,
.mk-bolum-baslik .mk-baslik {
    margin: 0;
    font-size: 22px;
    color: var(--mk-petrol);
    position: relative;
}
.mk-bolum-baslik h2::after,
.mk-bolum-baslik .mk-baslik::after {
    content: "";
    position: absolute;
    left: 0; bottom: -12px;
    width: 54px; height: 2px;
    background: var(--mk-altin);
}
.mk-bolum-baslik .mk-tumu {
    font-size: 13px;
    color: var(--mk-petrol);
    white-space: nowrap;
}

/* HUUB vitrini — öncelikli marka bloğu */
.mk-huub-vitrin {
    background: linear-gradient(0deg, var(--mk-petrol) 0%, var(--mk-petrol) 100%);
    border-radius: 14px;
    padding: 26px;
    color: var(--mk-altin-acik);
}
.mk-huub-vitrin .mk-vitrin-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
}
.mk-huub-vitrin h2 { color: #fff; margin: 0; font-size: 24px; }
.mk-huub-vitrin .mk-vitrin-alt-baslik {
    color: var(--mk-altin-antik);
    font-size: 14px;
    margin-top: 2px;
}
.mk-huub-vitrin .mk-vitrin-btn {
    background: var(--mk-altin);
    color: var(--mk-bordo);
    border-radius: 20px;
    padding: 9px 20px;
    font-size: 13px;
    font-weight: 600;
}
.mk-huub-vitrin .mk-vitrin-btn:hover { background: var(--mk-altin-acik); }
/* Vitrin içi ürün ızgarası: 5 geniş kart, dar sütuna sıkışmasın */
.mk-huub-vitrin .wd-products,
.mk-huub-vitrin .products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 14px !important;
    margin: 0 !important;
    width: 100% !important;
}
.mk-huub-vitrin .wd-products > .product,
.mk-huub-vitrin .products > .product {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.mk-huub-vitrin .wd-product .product-wrapper {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    height: 100%;
}
/* Koyu zeminde kart içi metinler okunur kalsın */
.mk-huub-vitrin .wd-product .wd-entities-title,
.mk-huub-vitrin .wd-product .wd-entities-title a {
    color: var(--mk-petrol) !important;
    font-size: 14px;
    line-height: 1.35;
}
.mk-huub-vitrin .wd-product .wd-product-cats,
.mk-huub-vitrin .wd-product .wd-product-cats a {
    color: #8a8a8a !important;
    font-size: 12px;
}
.mk-huub-vitrin .wd-product .price { font-size: 16px; }
.mk-huub-vitrin .wd-product .wd-product-sku,
.mk-huub-vitrin .wd-product .sku_wrapper {
    display: none !important;
}

/* ==========================================================================
   FİYAT FİLTRESİ — kaldırıldı
   Ürünler dar bir fiyat aralığında toplandığı için ayırt edici değil.
   ========================================================================== */
.widget_price_filter,
.wc-block-price-filter,
.wp-block-woocommerce-price-filter,
.wd-widget.widget_price_filter {
    display: none !important;
}

/* ==========================================================================
   ESKİ MARKA VİTRİNİ — KALDIRILDI
   Bu blok artık var olmayan bir düzene aitti (.mk-marka-buyuk, .mk-marka-logo).
   İçindeki `display:grid !important` yeni vitrinde başlık ile şeridi yan yana
   dizip paneli ikiye bölüyordu. Güncel kurallar dosyanın sonunda.
   ========================================================================== */

/* Ürün etiketleri üst üste binmesin — demo "HOT" ile bizim HUUB rozeti */
.wd-product .product-labels,
.elementor .wd-product .product-labels {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    z-index: 3;
}
.wd-product .product-labels .product-label {
    position: static !important;
    margin: 0 !important;
}

/* Marka kartları — kategori kartlarıyla aynı dil */
.mk-marka-serit {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}
.mk-marka-kart {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 10px;
    padding: 18px 12px 14px;
    text-align: center;
    transition: border-color .2s, box-shadow .2s;
}
.mk-marka-kart:hover {
    border-color: var(--mk-altin);
    box-shadow: 0 4px 14px rgba(18, 49, 51, .08);
}
.mk-marka-kart .mk-marka-ad {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--mk-petrol);
    line-height: 1.25;
}
.mk-marka-kart .mk-marka-sayi {
    display: block;
    font-size: 12px;
    color: #888;
}
.mk-marka-kart.mk-marka-oncelikli {
    border-color: var(--mk-altin);
    border-width: 2px;
}

/* B2B çağrı bandı */
.mk-b2b-bant {
    background: var(--mk-bordo);
    border-radius: 14px;
    padding: 28px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    color: var(--mk-altin-acik);
}
.mk-b2b-bant h2 { color: #fff; margin: 0 0 6px; font-size: 22px; }
.mk-b2b-bant p { margin: 0; font-size: 14px; max-width: 560px; }
.mk-b2b-bant .mk-bant-btn {
    background: var(--mk-altin);
    color: var(--mk-bordo);
    border-radius: 24px;
    padding: 12px 26px;
    font-weight: 600;
    white-space: nowrap;
}
.mk-b2b-bant .mk-bant-btn:hover { background: var(--mk-altin-acik); }

/* ==========================================================================
   YERLEŞİM — sidebar kapatıldığında içeriği tam genişliğe yay
   ========================================================================== */
.mk-tam-genislik .site-content,
.mk-tam-genislik .content-area,
.mk-tam-genislik .wd-content-area,
.mk-tam-genislik .content-layout-wrapper > .row > div {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}
.mk-tam-genislik .sidebar-container,
.mk-tam-genislik .wd-sidebar,
.mk-tam-genislik .area-sidebar {
    display: none !important;
}

/* Ürün ızgarası: dar alanda tek sütuna düşmesin, devasa görünmesin.
   :not(.mk-serit *) şart — yoksa yatay kayan şeridin içindeki ürünleri de
   grid'e çevirip kaymayı öldürüyor. */
.mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products),
.mk-anasayfa-bolum .products:not(.mk-serit .products) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 16px !important;
    margin: 0 !important;
}
.mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products) > .product,
.mk-anasayfa-bolum .products:not(.mk-serit .products) > .product {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
    clear: none !important;
}
.mk-anasayfa-bolum .wd-product img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

/* Elementor ile kurulmuş ana sayfanın altına eklenen kendi bloklarımız.
   Sayfanın kendi kapsayıcısı dar olabildiği için burada kendi genişliğini
   ve boşluğunu yönetiyor. */
.mk-anasayfa-ek {
    max-width: 1222px;
    margin: 40px auto 0;
    padding: 0 15px;
}

/* ==========================================================================
   ANA SAYFA — kategori kartları
   ========================================================================== */
.mk-anasayfa-bolum { margin-bottom: 42px; }

.mk-kat-kartlar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(125px, 1fr));
    gap: 12px;
}
.mk-kat-kart {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 10px;
    padding: 18px 12px 14px;
    text-align: center;
    transition: border-color .2s, box-shadow .2s;
}
.mk-kat-kart:hover {
    border-color: var(--mk-altin);
    box-shadow: 0 4px 14px rgba(18, 49, 51, .08);
}
.mk-kat-gorsel {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff;
    overflow: hidden;
}
.mk-kat-gorsel img {
    width: 100%; height: 100%;
    object-fit: contain;
    mix-blend-mode: multiply;
}
/* Görseli olmayan kategori/marka: boş kutu yerine nazik bir yer tutucu */
.mk-kat-gorsel.mk-kat-bos {
    background: repeating-linear-gradient(
        45deg, #f4f0e8, #f4f0e8 8px, #efe9dd 8px, #efe9dd 16px
    );
}
.mk-kat-ad {
    font-size: 14px;
    font-weight: 600;
    color: var(--mk-petrol);
    line-height: 1.3;
}
.mk-kat-sayi { font-size: 12px; color: #8a8a8a; }

/* ==========================================================================
   HERO — Mega Electronics düzeni
   Sol büyük + sağ üst geniş (geri sayımlı) + sağ alt iki küçük
   ========================================================================== */
.mk-hero {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 14px;
    margin-bottom: 34px;
    /* Her kutu kendi yuksekligini tasiyor (--mk-kutu-h). Satiri icerige
       birakiyoruz; boylece sag sutunun "uzamasina" bagimlilik kalmiyor. */
    grid-template-rows: auto !important;
    align-items: start !important;
}
.mk-hero-sag {
    display: grid;
    grid-template-rows: auto auto;
    gap: 14px;
    min-height: 0;
    align-content: start;
}
.mk-hero-ikili {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    min-height: 0;
}
.mk-hero-kutu {
    position: relative;
    display: flex;
    align-items: flex-end;
    border-radius: 14px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 150px;
    padding: 22px;
    color: #fff;
    transition: transform .25s;
}
.mk-hero-kutu:hover { transform: translateY(-3px); }
/* Yukseklik her kutunun kendi ayarindan geliyor; yonetimden px olarak
   giriliyor ve satir ici --mk-kutu-h degiskeniyle tasiniyor. */
.mk-hero-kutu { height: var(--mk-kutu-h, 253px); }
.mk-hero-buyuk { min-height: 0; }
.mk-hero-genis { min-height: 0; }
.mk-hero-kucuk { min-height: 0; padding: 18px; }
/* Yan yana duran iki kucuk kutu farkli girilse bile satir bozulmasin */
.mk-hero-ikili .mk-hero-kutu { height: var(--mk-kutu-h, 253px); }

/* Görsel varken metnin okunması için alt karartma.
   Koyuluk yonetimdeki kaydiraktan --mk-karart ile geliyor. */
.mk-hero-kutu:not(.mk-hero-gorselsiz)::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,calc(var(--mk-karart, .45) * .45)) 42%,
        rgba(0,0,0,var(--mk-karart, .45)) 100%);
}
.mk-hero-icerik {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
    max-width: 82%;
}
.mk-hero-icerik strong {
    font-size: 25px;
    line-height: 1.2;
    color: #fff;
}
.mk-hero-buyuk .mk-hero-icerik strong { font-size: 32px; }
.mk-hero-kucuk .mk-hero-icerik strong { font-size: 18px; }
.mk-hero-alt {
    font-size: 13.5px;
    color: rgba(255,255,255,.85);
    line-height: 1.5;
}
.mk-hero-kucuk .mk-hero-alt { font-size: 12.5px; }
.mk-hero-btn {
    display: inline-block;
    margin-top: 4px;
    background: var(--mk-altin);
    color: var(--mk-bordo);
    border-radius: 22px;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
}
.mk-hero-kutu:hover .mk-hero-btn { background: var(--mk-altin-acik); }

/* Hero içi geri sayım */
.mk-hero-sayac { display: flex; gap: 6px; margin: 4px 0 2px; }
.mk-hero-sayac > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(255,255,255,.92);
    color: var(--mk-bordo);
    border-radius: 7px;
    padding: 5px 9px;
    min-width: 44px;
}
.mk-hero-sayac b {
    font-size: 17px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.mk-hero-sayac i { font-style: normal; font-size: 10px; opacity: .75; margin-top: 2px; }

@media (max-width: 900px) {
    /* Tek sutuna dusunce sabit toplam boy anlamsiz; her kutu kendi boyunda. */
    .mk-hero { grid-template-columns: 1fr; grid-template-rows: none !important; min-height: 0; }
    /* Telefonda masaustu pikselleri anlamsiz; kutular icerige gore uzasin. */
    .mk-hero-sag { grid-template-rows: auto auto; }
    .mk-hero-kutu,
    .mk-hero-ikili .mk-hero-kutu { height: auto; }
    .mk-hero-buyuk { min-height: 260px; }
    .mk-hero-genis { min-height: 190px; }
    .mk-hero-kucuk { min-height: 190px; }
}
@media (max-width: 560px) {
    .mk-hero-ikili { grid-template-columns: 1fr; }
    .mk-hero-icerik { max-width: 100%; }
    .mk-hero-buyuk .mk-hero-icerik strong { font-size: 24px; }
}

/* ==========================================================================
   YATAY KAYAN ÜRÜN ŞERİDİ
   ========================================================================== */
.mk-serit-sarmal { position: relative; }
.mk-serit-araclar { display: flex; align-items: center; gap: 8px; }
.mk-ok {
    width: 30px; height: 30px;
    border: 1px solid var(--mk-cizgi);
    background: #fff;
    border-radius: 50%;
    color: var(--mk-petrol);
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    transition: background .2s, color .2s, border-color .2s;
}
.mk-ok:hover {
    background: var(--mk-petrol);
    color: var(--mk-altin-acik);
    border-color: var(--mk-petrol);
}
.mk-serit {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding-bottom: 6px;
    scrollbar-width: none;
}
.mk-serit::-webkit-scrollbar { display: none; }

/* Şerit içindeki ürün ızgarasını yatay akışa çevir.
   Özgüllüğü bilerek yüksek tutuldu: hem WoodMart'ın kendi grid'ini hem
   yukarıdaki ana sayfa ızgara kuralını geçmesi gerekiyor. */
.mk-anasayfa-bolum .mk-serit .wd-products,
.mk-anasayfa-bolum .mk-serit .products,
.mk-serit-sarmal .mk-serit .wd-products,
.mk-serit-sarmal .mk-serit .products {
    display: flex !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    gap: 14px !important;
    margin: 0 !important;
    width: max-content !important;
}
.mk-anasayfa-bolum .mk-serit .wd-products > .product,
.mk-anasayfa-bolum .mk-serit .products > .product,
.mk-serit-sarmal .mk-serit .wd-products > .product,
.mk-serit-sarmal .mk-serit .products > .product {
    flex: 0 0 200px !important;
    width: 200px !important;
    max-width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    scroll-snap-align: start;
}

/* ==========================================================================
   GERİ SAYIMLI KAMPANYA BANDI
   ========================================================================== */
.mk-kampanya-bant {
    background: var(--mk-bordo);
    border-radius: 14px;
    padding: 24px 26px;
}
.mk-kampanya-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 20px;
}
.mk-kampanya-bant h2 {
    color: #fff;
    margin: 0 0 4px;
    font-size: 23px;
}
.mk-kampanya-bant p {
    margin: 0;
    color: var(--mk-altin-antik);
    font-size: 14px;
}
.mk-sayac { display: flex; gap: 8px; }
.mk-sayac-kutu {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 56px;
    background: var(--mk-altin);
    color: var(--mk-bordo);
    border-radius: 8px;
    padding: 8px 6px;
}
.mk-sayac-kutu b {
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.mk-sayac-kutu i {
    font-style: normal;
    font-size: 11px;
    margin-top: 3px;
    opacity: .8;
}
.mk-kampanya-bant .wd-product .product-wrapper {
    background: #fff;
    border-radius: 10px;
    padding: 10px;
}

/* ==========================================================================
   GÜVEN ŞERİDİ
   ========================================================================== */
.mk-guven-serit {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 12px;
    padding: 18px 20px;
}
.mk-guven-oge { display: flex; align-items: center; gap: 12px; }
.mk-guven-ikon {
    flex: 0 0 38px;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--mk-petrol);
    position: relative;
}
.mk-guven-ikon::after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--mk-altin-acik);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 19px;
    mask-size: 19px;
}
.mk-ikon-truck::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M1 3h15v13H1zM16 8h4l3 3v5h-7z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M1 3h15v13H1zM16 8h4l3 3v5h-7z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E");
}
.mk-ikon-refresh::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M23 4v6h-6M1 20v-6h6'/%3E%3Cpath d='M3.5 9a9 9 0 0114.9-3.4L23 10M1 14l4.6 4.4A9 9 0 0020.5 15'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M23 4v6h-6M1 20v-6h6'/%3E%3Cpath d='M3.5 9a9 9 0 0114.9-3.4L23 10M1 14l4.6 4.4A9 9 0 0020.5 15'/%3E%3C/svg%3E");
}
.mk-ikon-lock::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0110 0v4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0110 0v4'/%3E%3C/svg%3E");
}
.mk-ikon-box::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M21 16V8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3.3 7L12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M21 16V8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3.3 7L12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
.mk-guven-metin { display: flex; flex-direction: column; }
.mk-guven-metin strong { font-size: 14px; color: var(--mk-petrol); }
.mk-guven-metin small { font-size: 12px; color: #8a8a8a; }

/* ==========================================================================
   GİRİŞ / KAYIT — misafir seçeneği dahil
   ========================================================================== */
.mk-giris-secenekler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin-bottom: 28px;
}
.mk-giris-kart {
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 12px;
    padding: 22px;
}
.mk-giris-kart.mk-vurgulu { border: 2px solid var(--mk-altin); }
.mk-giris-kart h3 {
    margin: 0 0 6px;
    font-size: 17px;
    color: var(--mk-petrol);
}
.mk-giris-kart p {
    font-size: 13px;
    color: #666;
    margin: 0 0 14px;
    line-height: 1.6;
}
.mk-misafir-btn {
    display: inline-block;
    background: transparent;
    border: 1px solid var(--mk-petrol);
    color: var(--mk-petrol);
    border-radius: 22px;
    padding: 10px 22px;
    font-size: 14px;
}
.mk-misafir-btn:hover {
    background: var(--mk-petrol);
    color: #fff;
}

/* ==========================================================================
   FOOTER — petrol, alt bordo
   ========================================================================== */
.wd-footer {
    background-color: var(--mk-petrol) !important;
    color: #b9c9c7;
}
.wd-footer h3,
.wd-footer .widget-title {
    color: var(--mk-altin-acik) !important;
}
.wd-footer a { color: #b9c9c7; }
.wd-footer a:hover { color: var(--mk-altin-acik); }
.wd-footer .wd-copyrights,
.copyrights-wrapper {
    background-color: var(--mk-bordo) !important;
    color: var(--mk-altin-antik);
    border-top: none !important;
}

/* ==========================================================================
   BAYİ BAŞVURU FORMU
   ========================================================================== */
.mk-bayi-form {
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 12px;
    padding: 26px;
    max-width: 720px;
}
.mk-bayi-form .mk-satir {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}
.mk-bayi-form label {
    display: block;
    font-size: 13px;
    color: var(--mk-petrol);
    margin-bottom: 5px;
    font-weight: 600;
}
.mk-bayi-form input,
.mk-bayi-form select,
.mk-bayi-form textarea {
    width: 100%;
    border: 1px solid var(--mk-cizgi);
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 14px;
}
.mk-bayi-form input:focus,
.mk-bayi-form select:focus,
.mk-bayi-form textarea:focus {
    border-color: var(--mk-altin);
    outline: none;
}
.mk-bayi-form .mk-zorunlu { color: #a32d2d; }
.mk-form-mesaj {
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 16px;
    font-size: 14px;
}
.mk-form-mesaj.mk-basarili {
    background: #E1F5EE;
    color: #0F6E56;
    border-left: 3px solid #0F6E56;
}
.mk-form-mesaj.mk-hata {
    background: #FCEBEB;
    color: #A32D2D;
    border-left: 3px solid #A32D2D;
}

/* ==========================================================================
   ADMIN — kullanıcı iskonto paneli
   ========================================================================== */
.mk-iskonto-panel {
    background: #fff;
    border: 1px solid #dcdcde;
    border-radius: 8px;
    padding: 16px 18px;
    max-width: 780px;
}
.mk-iskonto-panel table { width: 100%; border-collapse: collapse; }
.mk-iskonto-panel th,
.mk-iskonto-panel td {
    text-align: left;
    padding: 9px 10px;
    border-bottom: 1px solid #f0f0f1;
    font-size: 13px;
}
.mk-iskonto-panel th { background: #f6f7f7; font-weight: 600; }
.mk-iskonto-panel input[type="number"] { width: 90px; }
.mk-iskonto-panel .mk-marka-urun-sayi { color: #787c82; font-size: 12px; }
.mk-iskonto-ozet {
    background: #f4f0e8;
    border-left: 3px solid #C0A071;
    padding: 10px 14px;
    margin-top: 14px;
    font-size: 13px;
}

/* ==========================================================================
   MOBİL
   ========================================================================== */
@media (max-width: 768px) {
    .mk-huub-vitrin { padding: 18px; border-radius: 10px; }
    .mk-huub-vitrin h2 { font-size: 20px; }
    .mk-b2b-bant { padding: 20px; text-align: center; justify-content: center; }
    .mk-bolum-baslik h2, .mk-bolum-baslik .mk-baslik { font-size: 18px; }
    .mk-bayi-serit { font-size: 12px; gap: 10px; }
    .mk-anasayfa-bolum { margin-bottom: 32px; }
    .mk-kampanya-bant { padding: 18px; }
    .mk-kampanya-bant h2 { font-size: 19px; }
    .mk-kampanya-ust { justify-content: center; text-align: center; }
    .mk-sayac-kutu { min-width: 48px; }
    .mk-sayac-kutu b { font-size: 18px; }
    .mk-kat-gorsel { width: 64px; height: 64px; }
    .mk-kat-ad { font-size: 13px; }
}

/* ================================================================
   GİRİŞ / KAYIT — iki ayrı giriş ve sekmeli kayıt
   ================================================================ */

.mk-giris-kart {
    max-width: 460px;
    margin: 0 auto 32px;
    padding: 28px 30px;
    background: #fff;
    border: 1px solid #e6e0d5;
    border-radius: 10px;
}
.mk-giris-kart h2 { margin: 0 0 6px; font-size: 22px; color: var(--mk-petrol); }
.mk-giris-aciklama { margin: 0 0 18px; color: #6b6b6b; font-size: 14px; line-height: 1.5; }
.mk-giris-ticari { border-top: 4px solid var(--mk-altin); }
.mk-giris-musteri { border-top: 4px solid var(--mk-petrol); }

.mk-form p { margin: 0 0 14px; }
.mk-form label { display: block; margin-bottom: 5px; font-size: 13px; font-weight: 600; color: var(--mk-petrol); }
.mk-form input[type="text"],
.mk-form input[type="email"],
.mk-form input[type="tel"],
.mk-form input[type="password"],
.mk-form textarea,
.mk-form select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d8d2c6;
    border-radius: 6px;
    font-size: 15px;
}
.mk-form input:focus, .mk-form textarea:focus, .mk-form select:focus {
    outline: none; border-color: var(--mk-altin); box-shadow: 0 0 0 3px rgba(192,160,113,.18);
}
.mk-form .button, .mk-form button.button { width: 100%; }
.mk-satir-kucuk { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
.mk-giris-alt { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid #efe9de; font-size: 14px; text-align: center; }
.mk-hata { padding: 10px 12px; background: #fdecec; border-left: 3px solid #c0392b; color: #922; font-size: 14px; }

.mk-durum { padding: 12px 14px; border-radius: 6px; font-size: 14px; margin: 0 0 14px; }
.mk-durum-onayli  { background: #eaf6ee; border-left: 3px solid #2e7d4f; color: #205c39; }
.mk-durum-bekliyor{ background: #fdf6e6; border-left: 3px solid var(--mk-altin); color: #6b5220; }
.mk-durum-red     { background: #fdecec; border-left: 3px solid #c0392b; color: #922; }

/* --- sekmeli kayıt --- */
.mk-kayit-sekmeli { max-width: 720px; margin: 0 auto 40px; }
.mk-sekme-baslik { display: flex; gap: 10px; margin-bottom: -1px; }
.mk-sekme {
    flex: 1; padding: 14px 16px; text-align: center; text-decoration: none;
    background: #f3efe7; border: 1px solid #e6e0d5; border-bottom: none;
    border-radius: 10px 10px 0 0; color: #6b6b6b; transition: .15s;
}
.mk-sekme strong { display: block; font-size: 16px; color: var(--mk-petrol); }
.mk-sekme span { font-size: 12px; }
.mk-sekme.mk-aktif { background: #fff; color: var(--mk-petrol); box-shadow: inset 0 3px 0 var(--mk-altin); }
.mk-sekme:hover { background: #fff; }
.mk-sekme-icerik {
    display: none; padding: 28px 30px; background: #fff;
    border: 1px solid #e6e0d5; border-radius: 0 0 10px 10px;
}
.mk-sekme-icerik.mk-aktif { display: block; }

.mk-ticari-uyari {
    margin: 0 0 22px; padding: 16px 18px;
    background: #fbf8f1; border: 1px solid #ece3d1; border-radius: 8px;
}
.mk-ticari-uyari strong { display: block; margin-bottom: 8px; color: var(--mk-petrol); }
.mk-ticari-uyari ol { margin: 0 0 8px 18px; font-size: 14px; line-height: 1.7; }
.mk-kucuk { margin: 0; font-size: 13px; color: #7a7a7a; }

/* --- bayi adet seçici --- */
.mk-adet-notu {
    margin: 6px 0 12px; font-size: 13px; color: var(--mk-petrol);
    background: #f4f1ea; padding: 6px 10px; border-radius: 5px; display: inline-block;
}
.quantity input.mk-adet-bayi, .mk-adet-bayi input { min-width: 84px; }

@media (max-width: 600px) {
    .mk-sekme-baslik { flex-direction: column; gap: 0; }
    .mk-sekme { border-radius: 8px 8px 0 0; }
    .mk-giris-kart, .mk-sekme-icerik { padding: 20px 18px; }
}

/* ================================================================
   SAYFA TASARIMI — hero, kartlar, iletisim
   ================================================================ */

/* --- sicak bej zemin: beyaz fazla sert kaliyordu --- */
body, .site-content, .wd-page-content, .content-layout-wrapper {
    background-color: #F7F3EC !important;
}
.product-grid-item, .wd-product, .mk-kart, .mk-iletisim-kart,
.woocommerce-tabs, .related.products, .cart_totals, .woocommerce-checkout-review-order {
    background: #fff;
}

/* --- urun kartlari ortali --- */
.products .product-grid-item,
.wd-products .product-grid-item {
    text-align: center;
}
.product-grid-item .wd-entities-title,
.product-grid-item .price,
.product-grid-item .wd-product-cats,
.product-grid-item .star-rating,
.product-grid-item .wd-product-stock {
    text-align: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}
.product-grid-item .star-rating { float: none; display: inline-block; }
.product-grid-item .wd-add-btn > a,
.product-grid-item .button { width: 100%; justify-content: center; }

/* --- bos kenar cubugunu gizle --- */
.wd-sidebar:empty,
.sidebar-container:empty,
.area-sidebar:empty { display: none !important; }
.wd-sidebar .widget-area:empty { display: none; }

/* --- SAYFA HERO --- */
.mk-sayfa-hero {
    margin: 0 0 34px;
    padding: 54px 46px;
    border-radius: 14px;
    color: var(--mk-krem, #F5F0E6);
    position: relative;
    overflow: hidden;
}
.mk-hero-petrol { background: linear-gradient(135deg, #123133 0%, #0d2426 100%); }
.mk-hero-bordo  { background: linear-gradient(135deg, #351D2A 0%, #24121c 100%); }
.mk-sayfa-hero::after {
    content: ""; position: absolute; right: -60px; top: -60px;
    width: 240px; height: 240px; border-radius: 50%;
    border: 1px solid rgba(192,160,113,.25);
}
.mk-hero-etiket {
    display: inline-block; margin-bottom: 14px; padding: 5px 14px;
    font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
    color: var(--mk-altin, #C0A071);
    border: 1px solid rgba(192,160,113,.4); border-radius: 40px;
}
.mk-sayfa-hero h1 {
    margin: 0 0 14px; font-size: 40px; line-height: 1.15;
    color: var(--mk-altin-acik, #E2CD96);
}
.mk-sayfa-hero p {
    margin: 0; max-width: 620px; font-size: 17px; line-height: 1.65;
    color: rgba(245,240,230,.82);
}

/* --- ISTATISTIK SERIDI --- */
.mk-istatistik {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
    margin: 0 0 34px;
}
.mk-istatistik > div {
    background: #fff; border: 1px solid #ece3d1; border-radius: 12px;
    padding: 22px 16px; text-align: center;
}
.mk-istatistik b {
    display: block; font-size: 32px; line-height: 1;
    color: var(--mk-petrol, #123133); margin-bottom: 6px;
}
.mk-istatistik span { font-size: 13px; color: #8a8272; letter-spacing: .4px; }

/* --- BOLUM --- */
.mk-bolum {
    background: #fff; border: 1px solid #ece3d1; border-radius: 14px;
    padding: 34px 38px; margin: 0 0 26px;
}
.mk-bolum h2 {
    margin: 0 0 18px; font-size: 26px; color: var(--mk-petrol, #123133);
    position: relative; padding-bottom: 12px;
}
.mk-bolum h2::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 52px; height: 3px; background: var(--mk-altin, #C0A071); border-radius: 2px;
}
.mk-bolum p { line-height: 1.75; color: #4a4a4a; }
.mk-giris-metin { font-size: 17px; color: #333 !important; }

.mk-bolum-petrol, .mk-bolum-bordo { border: none; color: rgba(245,240,230,.85); }
.mk-bolum-petrol { background: linear-gradient(135deg, #123133 0%, #0d2426 100%); }
.mk-bolum-bordo  { background: linear-gradient(135deg, #351D2A 0%, #24121c 100%); }
.mk-bolum-petrol h2, .mk-bolum-bordo h2,
.mk-bolum-petrol h3, .mk-bolum-bordo h3 { color: var(--mk-altin-acik, #E2CD96); }
.mk-bolum-petrol p, .mk-bolum-bordo p { color: rgba(245,240,230,.8); }
.mk-bolum-petrol strong, .mk-bolum-bordo strong { color: #fff; }

/* --- KART IZGARASI --- */
.mk-kart-izgara {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0 0 26px;
}
.mk-kart {
    border: 1px solid #ece3d1; border-radius: 14px; padding: 26px 22px;
    position: relative; transition: .18s;
}
.mk-kart:hover { border-color: var(--mk-altin, #C0A071); transform: translateY(-3px); }
.mk-kart-no {
    display: block; font-size: 13px; letter-spacing: 2px;
    color: var(--mk-altin, #C0A071); margin-bottom: 10px;
}
.mk-kart h3 { margin: 0 0 8px; font-size: 17px; color: var(--mk-petrol, #123133); }
.mk-kart p { margin: 0; font-size: 14px; line-height: 1.6; color: #666; }

/* --- SORU BLOKLARI --- */
.mk-soru { padding: 18px 0; border-bottom: 1px solid rgba(192,160,113,.18); }
.mk-soru:last-child { border-bottom: none; padding-bottom: 0; }
.mk-soru h3 { margin: 0 0 8px; font-size: 17px; }

/* --- CTA KUTUSU --- */
.mk-cta-kutu {
    display: flex; align-items: center; justify-content: space-between;
    gap: 26px; flex-wrap: wrap;
    background: linear-gradient(135deg, #351D2A 0%, #24121c 100%);
    border-radius: 14px; padding: 34px 38px; margin: 0 0 26px;
}
.mk-cta-kutu h3 { margin: 0 0 6px; font-size: 24px; color: var(--mk-altin-acik, #E2CD96); }
.mk-cta-kutu p  { margin: 0; color: rgba(245,240,230,.78); }
.mk-cta-butonlar { display: flex; gap: 12px; flex-wrap: wrap; }

/* --- BUTONLAR --- */
.mk-btn {
    display: inline-block; padding: 13px 26px; border-radius: 8px;
    font-weight: 600; font-size: 15px; text-decoration: none; transition: .18s;
}
.mk-btn-altin { background: var(--mk-altin, #C0A071); color: #123133 !important; }
.mk-btn-altin:hover { background: var(--mk-altin-acik, #E2CD96); color: #0d2426 !important; }
.mk-btn-cerceve {
    border: 1px solid var(--mk-altin, #C0A071); color: var(--mk-altin-acik, #E2CD96) !important;
}
.mk-btn-cerceve:hover { background: var(--mk-altin, #C0A071); color: #123133 !important; }
.mk-bolum-petrol .mk-btn, .mk-bolum-bordo .mk-btn { margin-top: 16px; }

/* --- ILETISIM KARTLARI --- */
.mk-iletisim-izgara {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0 0 26px;
}
.mk-iletisim-kart {
    display: block; text-align: center; text-decoration: none;
    border: 1px solid #ece3d1; border-radius: 14px; padding: 30px 20px; transition: .18s;
}
.mk-iletisim-kart:hover {
    border-color: var(--mk-altin, #C0A071); transform: translateY(-3px);
}
.mk-ik-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 52px; height: 52px; margin-bottom: 14px; border-radius: 50%;
    background: #F7F3EC; color: var(--mk-petrol, #123133); font-size: 22px;
}
.mk-iletisim-kart h3 {
    margin: 0 0 8px; font-size: 13px; letter-spacing: 1.5px;
    text-transform: uppercase; color: #8a8272;
}
.mk-iletisim-kart b { display: block; font-size: 16px; color: var(--mk-petrol, #123133); }
.mk-iletisim-kart small { display: block; margin-top: 6px; font-size: 13px; color: #999; }

/* --- IKILI DUZEN --- */
.mk-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mk-ikili .mk-bolum { margin: 0; }

/* --- MOBIL --- */
@media (max-width: 1024px) {
    .mk-kart-izgara, .mk-iletisim-izgara { grid-template-columns: repeat(2, 1fr); }
    .mk-istatistik { grid-template-columns: repeat(2, 1fr); }
    .mk-ikili { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .mk-sayfa-hero { padding: 36px 24px; }
    .mk-sayfa-hero h1 { font-size: 28px; }
    .mk-bolum { padding: 24px 20px; }
    .mk-kart-izgara, .mk-iletisim-izgara { grid-template-columns: 1fr; }
    .mk-cta-kutu { padding: 26px 22px; }
}

/* --- MAGAZA GIRIS SERIDI --- */
.website-wrapper, .main-page-wrapper { background-color: #F7F3EC; }

.mk-magaza-giris {
    display: grid; grid-template-columns: 1fr 320px; gap: 24px; align-items: center;
    background: linear-gradient(135deg, #123133 0%, #0d2426 100%);
    border-radius: 14px; padding: 32px 36px; margin: 0 0 28px;
}
.mk-mg-etiket {
    display: inline-block; margin-bottom: 10px; font-size: 12px;
    letter-spacing: 2px; text-transform: uppercase; color: var(--mk-altin, #C0A071);
}
.mk-mg-metin h2 { margin: 0 0 10px; font-size: 26px; color: var(--mk-altin-acik, #E2CD96); }
.mk-mg-metin p  { margin: 0; line-height: 1.7; color: rgba(245,240,230,.8); font-size: 15px; }
.mk-mg-kutu {
    background: rgba(255,255,255,.06); border: 1px solid rgba(192,160,113,.28);
    border-radius: 12px; padding: 20px 22px;
}
.mk-mg-kutu strong { display: block; margin-bottom: 6px; color: var(--mk-altin-acik, #E2CD96); font-size: 16px; }
.mk-mg-kutu p { margin: 0 0 14px; font-size: 13px; line-height: 1.6; color: rgba(245,240,230,.75); }
.mk-mg-kutu .mk-btn { padding: 10px 20px; font-size: 14px; }
.mk-mg-bayi { border-color: rgba(192,160,113,.5); }
.mk-mg-bayi p { margin-bottom: 0; }

/* --- MAGAZA GUVEN SERIDI --- */
.mk-magaza-guven {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
    margin: 34px 0 0; padding-top: 30px; border-top: 1px solid #e6ddcc;
}
.mk-mgv { text-align: center; padding: 0 10px; }
.mk-mgv-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; margin-bottom: 10px; border-radius: 50%;
    background: #fff; border: 1px solid #e6ddcc;
    color: var(--mk-petrol, #123133); font-size: 19px;
}
.mk-mgv b { display: block; font-size: 15px; color: var(--mk-petrol, #123133); margin-bottom: 3px; }
.mk-mgv small { display: block; font-size: 13px; color: #8a8272; line-height: 1.5; }

@media (max-width: 1024px) {
    .mk-magaza-giris { grid-template-columns: 1fr; }
    .mk-magaza-guven { grid-template-columns: repeat(2, 1fr); row-gap: 24px; }
}
@media (max-width: 600px) {
    .mk-magaza-giris { padding: 24px 20px; }
    .mk-mg-metin h2 { font-size: 21px; }
    .mk-magaza-guven { grid-template-columns: 1fr; }
}

/* ================================================================
   HEADER — logo, kategori dugmesi
   ================================================================ */

/* Logo olculeri: Araclar -> "Logo ve header olculeri" panelinden yonetiliyor. */

/* "Tum Kategoriler" dugmesi.
   Disaridaki hap sekli renksiz kaliyor ki header'in bordosu gorunsun;
   yesil sadece uc cizgili ikonun icinde bulundugu daireye uygulaniyor. */
.whb-header .wd-tools-element.wd-design-8 .wd-tools-inner,
.whb-header .wd-header-sticky-nav .wd-tools-inner,
.whb-header .wd-header-cats > a {
    background-color: transparent !important;
    background-image: none !important;
    color: var(--mk-altin-acik, #E2CD96) !important;
}
.whb-header .wd-tools-element.wd-design-8 .wd-tools-icon,
.whb-header .wd-header-sticky-nav .wd-tools-icon,
.whb-header .wd-header-cats > a .wd-tools-icon {
    background-color: #1D5457 !important;
    color: #fff !important;
}
.whb-header .wd-tools-element.wd-design-8:hover .wd-tools-icon,
.whb-header .wd-header-sticky-nav:hover .wd-tools-icon {
    background-color: #2A7A72 !important;
    color: #fff !important;
}
.whb-header .wd-tools-element.wd-design-8:hover .wd-tools-inner,
.whb-header .wd-header-sticky-nav:hover .wd-tools-inner {
    color: var(--mk-altin, #C0A071) !important;
}
.whb-header .wd-header-sticky-nav .wd-tools-text {
    color: inherit !important;
}

/* --- ADIM LISTESI (Bizimle Calisin) --- */
.mk-adimlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 20px; }
.mk-adim {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 16px 16px 16px 0;
}
.mk-adim b {
    flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--mk-altin, #C0A071); color: #123133; font-size: 15px;
}
.mk-adim span { font-size: 14px; line-height: 1.6; color: rgba(245,240,230,.85); }
.mk-bolum-petrol .mk-kart-no, .mk-bolum-bordo .mk-kart-no { color: var(--mk-altin, #C0A071); }

@media (max-width: 1024px) { .mk-adimlar { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .mk-adimlar { grid-template-columns: 1fr; } }

/* ================================================================
   FOOTER
   ================================================================ */

.mk-footer {
    background: linear-gradient(180deg, #123133 0%, #0d2426 100%);
    color: rgba(245,240,230,.72);
    padding: 58px 0 0;
    font-size: 14px;
    line-height: 1.7;
}
.mk-footer .container { max-width: 1400px; }

.mk-f-ust {
    display: grid;
    grid-template-columns: 1.7fr 1fr 1fr 1fr 1.15fr;
    gap: 34px;
    padding-bottom: 44px;
}
.mk-f-baslik {
    margin: 0 0 16px;
    font-size: 15px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--mk-altin, #C0A071);
    position: relative;
    padding-bottom: 12px;
}
.mk-f-baslik::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 34px; height: 2px; background: rgba(192,160,113,.45);
}
.mk-f-ozet { margin: 0 0 20px; color: rgba(245,240,230,.62); }

/* --- iletisim listesi --- */
.mk-f-iletisim { margin: 0; padding: 0; list-style: none; }
.mk-f-iletisim li {
    display: flex; gap: 11px; align-items: flex-start;
    margin-bottom: 12px;
}
.mk-f-ikon {
    flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: rgba(192,160,113,.13);
    border: 1px solid rgba(192,160,113,.25);
    color: var(--mk-altin, #C0A071);
    font-size: 13px;
}
.mk-f-iletisim a { color: rgba(245,240,230,.85); text-decoration: none; }
.mk-f-iletisim a:hover { color: var(--mk-altin-acik, #E2CD96); }

/* --- bag listeleri --- */
.mk-f-liste { margin: 0; padding: 0; list-style: none; }
.mk-f-liste li { margin-bottom: 9px; }
.mk-f-liste a {
    color: rgba(245,240,230,.7);
    text-decoration: none;
    transition: color .18s, padding-left .18s;
    /* inline-flex DEGIL: metin ve rozet ayri esnek oge olunca, iki satira
       saran uzun kategori adi sutunu kaplayip rozeti en saga itiyordu
       ("Giyim ve Ayakkabi Aksesuarlari" satirinda gorunuyordu). Blok akis
       icinde rozet daima son kelimenin hemen yaninda kaliyor. */
    display: block;
    line-height: 1.45;
}
.mk-f-liste a:hover {
    color: var(--mk-altin-acik, #E2CD96);
    padding-left: 4px;
}
.mk-f-adet {
    display: inline-block;
    margin-left: 6px;
    vertical-align: 1px;
    font-size: 10.5px; padding: 1px 6px; border-radius: 20px;
    background: rgba(192,160,113,.14);
    color: var(--mk-altin, #C0A071);
    white-space: nowrap;
}

/* --- alt serit --- */
.mk-f-alt {
    display: flex; align-items: center; justify-content: space-between;
    gap: 20px; flex-wrap: wrap;
    padding: 22px 0 26px;
    border-top: 1px solid rgba(192,160,113,.18);
}
.mk-f-telif p { margin: 0; color: rgba(245,240,230,.6); font-size: 13px; }
.mk-f-kunye { margin-top: 4px !important; font-size: 12px !important; color: rgba(245,240,230,.42) !important; }

.mk-f-sosyal { display: flex; gap: 10px; }
.mk-f-sosyal a {
    width: 38px; height: 38px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid rgba(192,160,113,.3);
    color: var(--mk-altin, #C0A071);
    transition: .18s;
}
.mk-f-sosyal a:hover {
    background: var(--mk-altin, #C0A071);
    border-color: var(--mk-altin, #C0A071);
    color: #123133;
}
.mk-f-sosyal-yok {
    font-size: 12px; color: rgba(192,160,113,.65);
    border: 1px dashed rgba(192,160,113,.3);
    border-radius: 8px; padding: 8px 14px;
}

/* Yonetici uyarisi: sayfada eksik firma bilgisi */
.mk-eksik-bilgi {
    background: rgba(214,54,56,.12);
    border: 1px dashed rgba(214,54,56,.45);
    border-radius: 4px; padding: 0 6px;
    color: #d63638; font-size: .9em;
}

@media (max-width: 1200px) {
    .mk-f-ust { grid-template-columns: 1.6fr 1fr 1fr; row-gap: 34px; }
}
@media (max-width: 768px) {
    .mk-footer { padding-top: 40px; }
    .mk-f-ust { grid-template-columns: 1fr 1fr; gap: 26px; }
    .mk-f-marka { grid-column: 1 / -1; }
    .mk-f-alt { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
    .mk-f-ust { grid-template-columns: 1fr; }
}

/* ================================================================
   MOBIL UYARLAMA
   Telefonda parmakla kullanilir olmasi icin: dokunma hedefleri en az
   44 px, butonlar tam genislik, tablolar yatay kayar, uzun kelimeler
   satir tasirmaz.
   ================================================================ */

@media (max-width: 768px) {

    /* --- dokunma hedefleri --- */
    .mk-btn {
        display: block;
        width: 100%;
        text-align: center;
        padding: 15px 20px;
        font-size: 16px;
    }
    .mk-cta-butonlar { width: 100%; flex-direction: column; gap: 10px; }
    .mk-cta-kutu { flex-direction: column; align-items: stretch; }

    .mk-f-liste li { margin-bottom: 0; }
    .mk-f-liste a { padding: 11px 0; min-height: 44px; }
    .mk-f-iletisim li { padding: 4px 0; }
    .mk-f-sosyal a { width: 46px; height: 46px; }

    .mk-iletisim-kart { padding: 24px 18px; min-height: 0; }

    /* --- yazi olcegi --- */
    .mk-sayfa-hero p { font-size: 16px; }
    .mk-giris-metin  { font-size: 16px; }
    .mk-istatistik b { font-size: 26px; }
    .mk-bolum h2     { font-size: 22px; }
    .mk-mg-metin p   { font-size: 15px; }

    /* --- tablolar yatay kaysin, sayfayi tasirmasin --- */
    .mk-bolum table,
    .wd-entry-content table,
    .entry-content table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    /* --- uzun kelime / adres satiri tasirmasin --- */
    .mk-bolum, .mk-kart, .mk-sayfa-hero, .mk-iletisim-kart, .mk-footer {
        overflow-wrap: break-word;
        word-break: break-word;
    }

    /* --- iOS form alanina dokununca sayfayi buyutmesin --- */
    input[type="text"], input[type="email"], input[type="tel"],
    input[type="password"], input[type="number"], input[type="search"],
    select, textarea { font-size: 16px !important; }

    /* --- magaza giris seridi --- */
    .mk-mg-kutu .mk-btn { width: 100%; }
    .mk-magaza-giris { gap: 18px; }

    /* --- kart araliklari --- */
    .mk-kart-izgara, .mk-iletisim-izgara { gap: 12px; }
    .mk-kart { padding: 22px 18px; }
}

@media (max-width: 600px) {
    /* Istatistikler telefonda 2 sutun kalsin: tek sutun cok uzuyor. */
    .mk-istatistik { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .mk-istatistik > div { padding: 16px 10px; }
    .mk-istatistik b { font-size: 23px; }
    .mk-istatistik span { font-size: 12px; }

    .mk-sayfa-hero h1 { font-size: 26px; line-height: 1.2; }
    .mk-bolum { padding: 22px 18px; }
    .mk-footer { padding-top: 34px; }
    .mk-f-ust { padding-bottom: 30px; }
}

/* Yatay tasmaya karsi son emniyet: sayfa saga kaymasin. */
html, body { max-width: 100%; overflow-x: hidden; }

/* ================================================================
   MOBIL — canli sitede olcum sonrasi duzeltmeler
   375x812 ekranda tek tek gezilip bulundu.
   ================================================================ */

@media (max-width: 768px) {

    /* --- URUN SAYFASI: sepete ekle 131x42 idi, ana eylem bu kadar kucuk olamaz --- */
    .single-product form.cart {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 10px;
    }
    .single-product form.cart .quantity {
        flex: 0 0 auto;
        margin: 0 !important;
    }
    .single-product .quantity input.qty,
    .single-product .quantity input[type="number"] {
        width: 62px !important;
        height: 50px !important;
        font-size: 16px !important;
        text-align: center;
    }
    .single-product .quantity .minus,
    .single-product .quantity .plus,
    .single-product .quantity .wd-qty-btn {
        width: 40px !important;
        height: 50px !important;
    }
    .single-product .single_add_to_cart_button {
        flex: 1 1 auto;
        min-width: 55%;
        min-height: 50px !important;
        font-size: 16px !important;
        padding-inline: 16px !important;
    }
    .single-product .mk-adet-notu {
        flex: 1 0 100%;
        margin: 4px 0 0;
        font-size: 13px;
    }

    /* --- MAGAZA GIRIS SERIDI: 497 px, ilk ekrani komple yiyordu --- */
    .mk-magaza-giris { padding: 20px 18px; gap: 14px; }
    .mk-mg-metin h2  { font-size: 19px; margin-bottom: 8px; }
    .mk-mg-metin p   { font-size: 14px; line-height: 1.6; }
    .mk-mg-etiket    { margin-bottom: 6px; }
    .mk-mg-kutu      { padding: 16px 18px; }
    .mk-mg-kutu p    { margin-bottom: 10px; }

    /* --- URUN KARTI BASLIGI 13.5 px idi --- */
    .product-grid-item .wd-entities-title,
    .product-grid-item .wd-entities-title a { font-size: 14px; line-height: 1.4; }
}

@media (max-width: 600px) {

    /* --- GUVEN SERIDI: 4 madde alt alta 505 px tutuyordu --- */
    .mk-magaza-guven {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 20px;
        column-gap: 10px;
    }
    .mk-mgv { padding: 0 4px; }
    .mk-mgv b     { font-size: 14px; }
    .mk-mgv small { font-size: 12px; }
    .mk-mgv-ikon  { width: 40px; height: 40px; font-size: 17px; margin-bottom: 8px; }

    /* --- ILETISIM KARTLARI: 4 kart alt alta 873 px tutuyordu.
           Telefonda dikey kart yerine yatay satir cok daha okunur. --- */
    .mk-iletisim-izgara { grid-template-columns: 1fr; gap: 10px; }
    .mk-iletisim-kart {
        display: flex;
        align-items: center;
        gap: 14px;
        text-align: left;
        padding: 14px 16px;
    }
    .mk-ik-ikon {
        flex: 0 0 44px;
        width: 44px; height: 44px;
        margin-bottom: 0;
        font-size: 18px;
    }
    .mk-iletisim-kart h3 { margin: 0 0 2px; font-size: 11px; }
    .mk-iletisim-kart b  { font-size: 15px; }
    .mk-iletisim-kart small { margin-top: 1px; }
}

/* ================================================================
   HUUB VITRINI — kartlar ayrilan alani tam doldursun
   auto-fill 1330 px'e 6 kolon aciyordu, 5 urun olunca 6. slot bos
   kaliyordu. Urun sayisi kadar esit kolon aciyoruz.
   ================================================================ */
.mk-huub-vitrin .products,
.mk-huub-vitrin .wd-products {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
@media (max-width: 1200px) {
    .mk-huub-vitrin .products,
    .mk-huub-vitrin .wd-products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 768px) {
    .mk-huub-vitrin .products,
    .mk-huub-vitrin .wd-products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
}

/* --- vitrin basligindaki marka logosu --- */
.mk-vitrin-ust { display: flex; align-items: center; gap: 18px; }
.mk-vitrin-logo {
    flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    width: 76px; height: 76px;
    background: #fff;
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 3px 14px rgba(0,0,0,.18);
}
.mk-vitrin-logo img {
    max-width: 100%; max-height: 100%;
    width: auto; height: auto;
    object-fit: contain;
}
.mk-vitrin-ust > div:first-child:not(.mk-vitrin-logo) { flex: 1 1 auto; }
@media (max-width: 768px) {
    .mk-vitrin-ust { flex-wrap: wrap; gap: 12px; }
    .mk-vitrin-logo { width: 58px; height: 58px; border-radius: 11px; }
    .mk-vitrin-btn { width: 100%; text-align: center; }
}

/* --- gorunum anahtari (footer alti) --- */
.mk-gorunum-anahtari {
    background: #0d2426;
    text-align: center;
    padding: 12px 16px 18px;
}
.mk-gorunum-anahtari a {
    display: inline-block;
    padding: 9px 20px;
    font-size: 13px;
    color: rgba(192,160,113,.85);
    border: 1px solid rgba(192,160,113,.3);
    border-radius: 30px;
    text-decoration: none;
    transition: .18s;
}
.mk-gorunum-anahtari a:hover {
    color: #123133;
    background: var(--mk-altin, #C0A071);
    border-color: var(--mk-altin, #C0A071);
}
/* Masaustu gorunumundeyken mobil kurallar devre disi kalsin diye
   viewport zaten 1400 px; burada sadece anahtari buyutuyoruz. */
.mk-masaustu-gorunum .mk-gorunum-anahtari a { font-size: 15px; padding: 11px 26px; }

/* --- SKU: on yuzde hicbir yerde gorunmesin --- */
.sku_wrapper,
.wd-product-sku,
.product_meta .sku_wrapper,
.wd-compare-table .wd-sku,
.woocommerce-product-attributes-item--sku { display: none !important; }

/* --- Menu yazilari biraz buyusun --- */
.whb-header .wd-nav-main > li > a,
.whb-header .wd-nav-main > li > a .nav-link-text{
    font-size: 16px;
    letter-spacing: .012em;
}
.whb-header .wd-nav-main .sub-menu a{ font-size: 15px; }
@media (max-width: 1200px){
    .whb-header .wd-nav-main > li > a,
    .whb-header .wd-nav-main > li > a .nav-link-text{ font-size: 15px; }
}

/* --- Serit dikey tekerlegi yutmasin --- */
.mk-serit{
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    scrollbar-width: thin;
}

/* Yonetici uyarisi: kampanya kapali */
.mk-kampanya-kapali{
    border:1px dashed rgba(214,54,56,.45);
    background:rgba(214,54,56,.06);
    color:#8a2f30;border-radius:10px;
    padding:14px 18px;font-size:14px;
}
.mk-kampanya-kapali a{color:#8a2f30;text-decoration:underline}

/* ================================================================
   CANLI SITEDE OLCULEN DUZELTMELER
   ================================================================ */

/* --- 1) Bos paragraf grid hucresi kapliyordu: hero ikiye boluniyordu --- */
.mk-anasayfa-bolum p:empty,
.mk-hero > p,
.mk-hero > br,
.mk-kampanya-bant > p:empty,
.mk-huub-vitrin > p:empty { display: none !important; }

/* --- 2) Serit dikey kaydirilabilir kutuya donusmustu --- */
.mk-serit{
    overflow-x: auto;
    overflow-y: hidden !important;
    height: auto !important;
    align-items: stretch;
    padding-bottom: 6px;
}
.mk-serit > .product,
.mk-serit .product-grid-item{ height: auto; }

/* --- 3) "Tum HUUB urunleri" butonu inline kalmisti --- */
.mk-huub-vitrin .mk-vitrin-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    line-height: 1.2;
    text-decoration: none;
    flex: 0 0 auto;
}

/* --- 4) Menu tek satirda kalsin --- */
.whb-header .wd-nav-main{ flex-wrap: nowrap !important; }
.whb-header .wd-nav-main > li > a,
.whb-header .wd-nav-main > li > a .nav-link-text{
    font-size: 15px;
    white-space: nowrap;
}
.whb-header .wd-nav-main > li > a{ padding-inline: 9px; }
/* Arama kutusu menuye yer birakacak kadar kissin */
.whb-general-header .wd-search-form{ max-width: 250px; }
/* Logo sutunu sola yaslansin ve ezilmesin */
.whb-general-header .whb-col-left{ flex: 0 0 auto; padding-inline-end: 14px; }
.whb-general-header .site-logo{ margin-inline-end: 6px; }
@media (max-width: 1400px){
    .whb-header .wd-nav-main > li > a,
    .whb-header .wd-nav-main > li > a .nav-link-text{ font-size: 14px; }
    .whb-header .wd-nav-main > li > a{ padding-inline: 7px; }
    .whb-general-header .wd-search-form{ max-width: 200px; }
}

/* --- 5) Kampanya bandi yeniden tasarim --- */
.mk-kampanya-bant{
    background:
      radial-gradient(120% 100% at 100% 0,rgba(192,160,113,.20),transparent 58%),
      linear-gradient(135deg,#3E2231 0%,#2C1622 100%);
    border: 1px solid rgba(192,160,113,.28);
    border-radius: 16px;
    padding: 30px 32px 32px;
    position: relative;
    overflow: hidden;
}
.mk-kampanya-bant::before{
    content:"";position:absolute;left:32px;right:32px;top:0;height:2px;
    background:linear-gradient(90deg,transparent,var(--mk-altin),transparent);
}
.mk-kampanya-ust{
    display:flex;align-items:center;justify-content:space-between;
    gap:24px;flex-wrap:wrap;
    padding-bottom:22px;margin-bottom:24px;
    border-bottom:1px solid rgba(192,160,113,.18);
}
.mk-kampanya-bant h2{
    color:var(--mk-altin-acik);
    font-size:26px;letter-spacing:-.01em;margin:0 0 6px;
}
.mk-kampanya-bant .mk-kampanya-ust p{
    color:rgba(245,240,230,.72);font-size:14px;margin:0;
}
.mk-sayac{ display:flex; gap:10px; }
.mk-sayac-kutu{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    min-width:64px;padding:10px 8px;
    background:rgba(192,160,113,.10);
    border:1px solid rgba(192,160,113,.42);
    border-radius:10px;color:var(--mk-altin-acik);
}
.mk-sayac-kutu b{ font-size:24px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums; }
.mk-sayac-kutu i{
    font-style:normal;font-size:10px;margin-top:5px;
    letter-spacing:.14em;text-transform:uppercase;opacity:.72;
}
/* saniye kutusu hafifce nabiz atsin */
.mk-sayac-kutu:last-child{ border-color:rgba(192,160,113,.7); }
.mk-sayac-kutu:last-child b{ animation: mkNabiz 1s ease-in-out infinite; }
@keyframes mkNabiz{ 0%,100%{opacity:1} 50%{opacity:.55} }

/* kampanya bandindaki urun kartlari */
.mk-kampanya-bant .products,
.mk-kampanya-bant .wd-products{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important;
    gap:14px !important;margin:0 !important;
}
.mk-kampanya-bant .product-grid-item{
    background:#fff;border-radius:12px;overflow:hidden;
    border:1px solid rgba(192,160,113,.16);
}
@media (max-width:700px){
    .mk-kampanya-bant{ padding:22px 18px 24px; }
    .mk-kampanya-ust{ gap:16px; }
    .mk-kampanya-bant h2{ font-size:21px; }
    .mk-sayac{ width:100%; }
    .mk-sayac-kutu{ flex:1; min-width:0; }
}

/* ================================================================
   HERO — bos paragraf grid hucresi kapiyordu (ikinci tur)
   Onceki kural yalnizca .mk-hero'nun DOGRUDAN cocuklarini kapatiyordu;
   .mk-hero-ikili icindeki bosluklu <p> kaciyor ve iki sutunluk izgarada
   ucuncu hucre acip kutulari 163 yerine 255 px'e cikariyordu.
   ================================================================ */
.mk-hero p,
.mk-hero br,
.mk-hero-sag > p,
.mk-hero-ikili > p,
.mk-kat-kartlar > p,
.mk-guven-serit > p,
.mk-huub-vitrin > p,
.mk-b2b-bant > p:empty{ display: none !important; }

/* Gercek kutulari izgaraya sabitle: araya bir sey girse bile duzen bozulmasin */
.mk-hero-sag{
    grid-template-rows: auto auto !important;
    align-content: start;
}
.mk-hero-ikili{
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto !important;
}
.mk-hero-ikili > .mk-hero-kutu:nth-of-type(1){ grid-column: 1; grid-row: 1; }
.mk-hero-ikili > .mk-hero-kutu:nth-of-type(2){ grid-column: 2; grid-row: 1; }

/* ================================================================
   DUGMELER — <a> varsayilan olarak inline; dolgu cevresini itmiyordu
   ================================================================ */
.mk-vitrin-btn,
.mk-b2b-bant a,
.mk-b2b-btn,
.mk-hero-btn{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
    white-space: nowrap;
    text-decoration: none;
    box-sizing: border-box;
    flex: 0 0 auto;
}
.mk-huub-vitrin .mk-vitrin-btn{
    min-height: 40px;
    padding: 0 22px !important;
    border-radius: 20px;
}
.mk-b2b-bant a,
.mk-b2b-btn{
    min-height: 44px;
    padding: 0 26px !important;
    border-radius: 22px;
}
.mk-hero-btn{
    min-height: 34px;
    padding: 0 18px !important;
}

/* ================================================================
   SERIT — kendi animasyonumuz calissin diye CSS yumusak kaydirmasi kapali.
   scroll-behavior:smooth iken scrollLeft atamasi bu kutuda hic baslamiyordu.
   ================================================================ */
.mk-serit{
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
}
.mk-ok{ cursor: pointer; }
.mk-ok:disabled{ opacity: .35; cursor: default; }

/* Dogru sinif adi .mk-bant-btn (once .mk-b2b-btn yazilmisti, eslesmiyordu) */
.mk-bant-btn,
.mk-b2b-bant .mk-bant-btn{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 26px !important;
    line-height: 1 !important;
    white-space: nowrap;
    text-decoration: none;
    box-sizing: border-box;
    flex: 0 0 auto;
}
/* Etiket span'i: dikey ortalama yaziya degil kutuya gore yapilsin */
.mk-vitrin-btn > span,
.mk-bant-btn > span{
    display: block;
    line-height: 1;
    transform: translateY(.5px);
}

/* ================================================================
   ARAMA ALANI — onceki daraltma ikonlari beyaz kutuya yapistirmisti
   ================================================================ */
.whb-general-header .wd-search-form{
    max-width: 270px;
    margin-inline-end: 18px;
}
.whb-general-header .wd-search-form .searchform{ overflow: hidden; border-radius: 26px; }
/* Hesap ve sepet arama kutusuna degmesin */
.whb-general-header .wd-header-my-account{ margin-inline-start: 4px; }
.whb-general-header .wd-header-cart{ margin-inline-start: 10px; }
@media (max-width: 1400px){
    .whb-general-header .wd-search-form{ max-width: 220px; margin-inline-end: 14px; }
}
@media (max-width: 1100px){
    .whb-general-header .wd-search-form{ max-width: 170px; margin-inline-end: 10px; }
}

/* ================================================================
   ZEMIN — biraz daha bej, biraz daha koyu
   ================================================================ */
body,
.site-content,
.wd-page-content,
.content-layout-wrapper,
.website-wrapper,
.main-page-wrapper{ background-color: #F1E8D9 !important; }
/* Kartlar zeminden ayrilsin diye beyaz kaliyor */
.product-grid-item, .wd-product,
.woocommerce-tabs, .related.products,
.cart_totals, .woocommerce-checkout-review-order{ background: #fff; }
.mk-istatistik > div,
/* DİKKAT: koyu bölümler hariç tutulmalı. Aksi halde bordo/petrol zeminler
   kreme dönüp üstündeki krem yazıyı görünmez yapıyor. */
.mk-kart, .mk-iletisim-kart,
.mk-bolum:not(.mk-bolum-bordo):not(.mk-bolum-petrol){ background: #FBF7F0; }
.mk-bolum.mk-bolum-petrol{ background: linear-gradient(135deg,#123133 0%,#0d2426 100%) !important; }
.mk-bolum.mk-bolum-bordo { background: linear-gradient(135deg,#351D2A 0%,#24121c 100%) !important; }
.mk-mgv-ikon{ background: #FBF7F0; }

/* ================================================================
   MARKA KARTLARI — 158 px'lik dar kutularda sonuk kaliyorlardi
   ================================================================ */
.mk-marka-serit{
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
    gap: 18px !important;
    margin-top: 4px;
}
.mk-marka-kart{
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    min-height: 280px;
    padding: 26px 20px 22px !important;
    background: #fff;
    border: 1px solid #E8DFCC !important;
    border-radius: 16px !important;
    overflow: hidden;
    text-decoration: none;
    transition: transform .35s cubic-bezier(.2,.8,.3,1),
                box-shadow .35s, border-color .3s;
}
/* ust seride ince altin cizgi */
.mk-marka-kart::before{
    content:"";position:absolute;left:0;right:0;top:0;height:3px;
    background:linear-gradient(90deg,var(--mk-altin,#C0A071),var(--mk-altin-acik,#E2CD96));
    transform:scaleX(0);transform-origin:left;
    transition:transform .45s cubic-bezier(.2,.8,.3,1);
}
.mk-marka-kart:hover::before{ transform:scaleX(1); }
.mk-marka-kart:hover{
    transform: translateY(-6px);
    border-color: var(--mk-altin,#C0A071) !important;
    box-shadow: 0 18px 40px rgba(53,29,42,.13);
}

/* logo alani */
.mk-marka-kart .mk-kat-gorsel,
.mk-marka-kart > span:first-of-type{
    width: 100% !important;
    height: 132px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    padding: 12px;
    border-radius: 12px;
    background: linear-gradient(160deg,#FBF7F0,#F1E8D9);
    border: 1px solid #EFE6D4;
}
.mk-marka-kart img{
    max-width: 100% !important;
    max-height: 104px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
    mix-blend-mode: multiply;
}

.mk-marka-ad{
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--mk-petrol,#123133) !important;
    letter-spacing: -.01em;
    text-align: center;
    margin-bottom: 8px !important;
}
.mk-marka-sayi{
    display: inline-flex !important;
    align-items: center;
    font-size: 12px !important;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--mk-altin-koyu,#8A6B34) !important;
    background: rgba(192,160,113,.14);
    border: 1px solid rgba(192,160,113,.3);
    border-radius: 20px;
    padding: 5px 12px;
}
/* "Urunleri gor" ipucu — ustune gelince beliriyor */
.mk-marka-kart::after{
    content:"Ürünleri gör →";
    position:absolute;left:0;right:0;bottom:0;
    padding:10px 0;
    font-size:12px;font-weight:600;letter-spacing:.04em;text-align:center;
    color:var(--mk-petrol,#123133);
    background:linear-gradient(180deg,rgba(241,232,217,0),#F1E8D9 42%);
    opacity:0;transform:translateY(8px);
    transition:opacity .3s,transform .3s;
}
.mk-marka-kart:hover::after{ opacity:1;transform:translateY(0); }

/* HUUB one cikan marka */
.mk-marka-oncelikli{
    border-color: var(--mk-altin,#C0A071) !important;
    box-shadow: 0 6px 20px rgba(192,160,113,.16);
}
.mk-marka-oncelikli::before{ transform: scaleX(1); }

@media (max-width: 700px){
    .mk-marka-serit{ grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
    .mk-marka-kart{ min-height: 230px; padding: 20px 14px 18px !important; }
    .mk-marka-kart .mk-kat-gorsel,
    .mk-marka-kart > span:first-of-type{ height: 100px !important; }
    .mk-marka-kart img{ max-height: 80px !important; }
    .mk-marka-ad{ font-size: 16px !important; }
}

/* ================================================================
   MARKA VITRINI — HUUB Home Collection ile ayni kalip:
   yesil panel, buyuk kartlar, yana kayan serit
   ================================================================ */
.mk-marka-vitrin{
    background: linear-gradient(150deg,#123133 0%,#0d2426 100%);
    border-radius: 16px;
    padding: 28px 28px 24px;
    position: relative;
    overflow: hidden;
}
.mk-marka-vitrin::before{
    content:"";position:absolute;left:28px;right:28px;top:0;height:2px;
    background:linear-gradient(90deg,transparent,var(--mk-altin,#C0A071),transparent);
}
.mk-marka-vitrin .mk-vitrin-ust{
    display:flex;align-items:center;justify-content:space-between;
    gap:20px;flex-wrap:wrap;margin-bottom:22px;
}
.mk-marka-vitrin .mk-vitrin-yazi h2{
    color:var(--mk-altin-acik,#E2CD96);
    font-size:26px;margin:0 0 6px;letter-spacing:-.01em;
}
.mk-marka-vitrin .mk-vitrin-alt-baslik{
    color:rgba(245,240,230,.7);font-size:14px;
}
.mk-marka-vitrin .mk-serit-araclar{
    display:flex;align-items:center;gap:10px;
}
.mk-marka-vitrin .mk-vitrin-btn{
    display:inline-flex !important;align-items:center;justify-content:center;
    min-height:40px;padding:0 22px !important;border-radius:20px;
    background:var(--mk-altin,#C0A071);color:var(--mk-petrol,#123133);
    font-size:13px;font-weight:600;line-height:1 !important;
    white-space:nowrap;text-decoration:none;
}
.mk-marka-vitrin .mk-vitrin-btn:hover{ background:var(--mk-altin-acik,#E2CD96); }
.mk-marka-vitrin .mk-ok{
    width:38px;height:38px;border-radius:50%;
    background:rgba(245,240,230,.06);
    border:1px solid rgba(192,160,113,.4);
    color:var(--mk-altin-acik,#E2CD96);
    font-size:19px;line-height:1;cursor:pointer;
    display:grid;place-items:center;transition:.25s;
}
.mk-marka-vitrin .mk-ok:hover{
    background:var(--mk-altin,#C0A071);
    border-color:var(--mk-altin,#C0A071);
    color:var(--mk-petrol,#123133);
}

/* --- yana kayan serit --- */
.mk-marka-vitrin .mk-marka-serit{
    display:flex !important;
    grid-template-columns:none !important;
    gap:16px !important;
    overflow-x:auto;overflow-y:hidden !important;
    scroll-behavior:auto !important;
    padding-bottom:8px;margin:0 !important;
    scrollbar-width:thin;
    scrollbar-color:rgba(192,160,113,.5) transparent;
}
.mk-marka-vitrin .mk-marka-serit::-webkit-scrollbar{ height:6px; }
.mk-marka-vitrin .mk-marka-serit::-webkit-scrollbar-thumb{
    background:rgba(192,160,113,.45);border-radius:3px;
}

/* --- buyuk marka karti --- */
.mk-marka-vitrin .mk-marka-kart{
    flex:0 0 232px;
    min-height:0;
    padding:18px 18px 16px !important;
    background:#fff;
    border:1px solid rgba(192,160,113,.22) !important;
    border-radius:14px !important;
}
.mk-marka-vitrin .mk-marka-kart:hover{
    transform:translateY(-5px);
    border-color:var(--mk-altin,#C0A071) !important;
    box-shadow:0 16px 34px rgba(0,0,0,.28);
}
.mk-marka-vitrin .mk-marka-kart .mk-kat-gorsel{
    height:152px !important;margin-bottom:14px;
    background:linear-gradient(160deg,#FBF7F0,#F1E8D9);
    border-color:#EFE6D4;
}
.mk-marka-vitrin .mk-marka-kart img{ max-height:120px !important; }
.mk-marka-vitrin .mk-marka-ad{ font-size:19px !important;margin-bottom:9px !important; }
.mk-marka-vitrin .mk-marka-kart::after{
    background:linear-gradient(180deg,rgba(251,247,240,0),#FBF7F0 42%);
}
.mk-marka-vitrin .mk-marka-oncelikli{
    border-color:var(--mk-altin,#C0A071) !important;
    box-shadow:0 6px 22px rgba(192,160,113,.28);
}

@media (max-width:700px){
    .mk-marka-vitrin{ padding:22px 18px 20px; }
    .mk-marka-vitrin::before{ left:18px;right:18px; }
    .mk-marka-vitrin .mk-vitrin-ust{ gap:14px;margin-bottom:18px; }
    .mk-marka-vitrin .mk-vitrin-yazi h2{ font-size:21px; }
    .mk-marka-vitrin .mk-serit-araclar{ width:100%;justify-content:space-between; }
    .mk-marka-vitrin .mk-marka-kart{ flex:0 0 175px;padding:14px 14px 12px !important; }
    .mk-marka-vitrin .mk-marka-kart .mk-kat-gorsel{ height:110px !important; }
    .mk-marka-vitrin .mk-marka-kart img{ max-height:86px !important; }
    .mk-marka-vitrin .mk-marka-ad{ font-size:16px !important; }
}

/* ================================================================
   MARKA VITRINI v2 — HUUB urun kartlariyla ayni oranlar, bordo panel
   ================================================================ */
.mk-marka-vitrin{
    /* Panel tek sutun: ust satir (baslik + araclar), altinda serit.
       display bilerek yaziliyor — tema/eski kural grid'e cevirirse
       baslik ile serit yan yana dusuyordu. */
    display: block !important;
    grid-template-columns: none !important;
    background: linear-gradient(150deg,#3E2231 0%,#2C1622 100%) !important;
    padding: 30px 30px 26px !important;
    margin: 0 0 30px !important;
}

/* ust satir: solda "Markalarimiz", sagda "Tum urunler" + oklar */
.mk-marka-vitrin .mk-vitrin-ust{
    display: flex !important;
    flex-wrap: nowrap;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 24px !important;
    width: 100% !important;
    margin: 0 0 22px !important;
}
.mk-marka-vitrin .mk-vitrin-yazi{ flex: 1 1 auto; min-width: 0; }
.mk-marka-vitrin .mk-serit-araclar{
    flex: 0 0 auto;
    display: flex !important;
    align-items: center;
    gap: 10px;
}
.mk-marka-vitrin::before{ left:30px;right:30px; }

.mk-marka-vitrin .mk-marka-serit{ gap: 18px !important; padding-bottom: 10px; }

/* --- kart: HUUB urun karti olculerinde --- */
.mk-marka-vitrin .mk-marka-kart{
    flex: 0 0 234px !important;
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    justify-content: flex-start;
    min-height: 430px;
    padding: 0 !important;
    background: #fff !important;
    border: 1px solid rgba(192,160,113,.18) !important;
    border-radius: 12px !important;
    overflow: hidden;
    text-align: center;
}
.mk-marka-vitrin .mk-marka-kart::before,
.mk-marka-vitrin .mk-marka-kart::after{ content: none !important; }
.mk-marka-vitrin .mk-marka-kart:hover{
    transform: translateY(-6px);
    border-color: var(--mk-altin,#C0A071) !important;
    box-shadow: 0 20px 42px rgba(0,0,0,.34);
}

/* gorsel alani — kartin ust yarisi */
.mk-marka-vitrin .mk-marka-kart .mk-kat-gorsel{
    width: 100% !important;
    height: 232px !important;
    margin: 0 !important;
    padding: 22px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #EFE6D4 !important;
    border-radius: 0 !important;
}
.mk-marka-vitrin .mk-marka-kart img{
    max-width: 100% !important;
    max-height: 188px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
    mix-blend-mode: normal;
}
.mk-marka-vitrin .mk-kat-bos{
    background: linear-gradient(160deg,#FBF7F0,#F1E8D9) !important;
}

/* orta govde */
.mk-marka-vitrin .mk-marka-govde{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px 16px;
}
.mk-marka-vitrin .mk-marka-ad{
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--mk-petrol,#123133) !important;
    margin: 0 !important;
    letter-spacing: -.01em;
}
.mk-marka-vitrin .mk-marka-sayi{
    font-size: 13px !important;
    font-weight: 500;
    color: #8a8272 !important;
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
}

/* alt buton — HUUB kartindaki "Sepete Ekle" gibi */
.mk-marka-vitrin .mk-marka-btn{
    display: block;
    margin: 0 14px 14px;
    padding: 13px 10px;
    border-radius: 8px;
    background: var(--mk-altin,#C0A071);
    color: var(--mk-bordo,#351D2A);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    transition: background .25s;
}
.mk-marka-vitrin .mk-marka-kart:hover .mk-marka-btn{
    background: var(--mk-altin-acik,#E2CD96);
}

/* HUUB one cikan */
.mk-marka-vitrin .mk-marka-oncelikli{
    border-color: var(--mk-altin,#C0A071) !important;
    box-shadow: 0 8px 26px rgba(192,160,113,.26);
}

@media (max-width:700px){
    .mk-marka-vitrin{ padding:22px 16px 20px !important; }
    .mk-marka-vitrin::before{ left:16px;right:16px; }
    /* Dar ekranda araclar alt satira insin, yan yana sikismasin. */
    .mk-marka-vitrin .mk-vitrin-ust{ flex-wrap: wrap; gap: 14px !important; }
    .mk-marka-vitrin .mk-vitrin-yazi{ flex: 1 0 100%; }
    .mk-marka-vitrin .mk-serit-araclar{ width: 100%; justify-content: space-between; }
    .mk-marka-vitrin .mk-marka-kart{ flex:0 0 190px !important; min-height:340px; }
    .mk-marka-vitrin .mk-marka-kart .mk-kat-gorsel{ height:170px !important; padding:16px !important; }
    .mk-marka-vitrin .mk-marka-kart img{ max-height:136px !important; }
    .mk-marka-vitrin .mk-marka-ad{ font-size:17px !important; }
    .mk-marka-vitrin .mk-marka-btn{ margin:0 10px 10px; padding:11px 8px; font-size:13px; }
}


/* ================================================================
   VİTRİN BÖLÜMLERİ — Mega Electronics düzeni
   Yapı demodakiyle aynı; renkler Makker paletinde.
   ================================================================ */

/* --- 1. Yeni ürünler vitrini: solda afiş, sağda ürünler --- */
.mk-vy-govde{
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 20px;
    align-items: stretch;
}
.mk-vy-afis{
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    min-height: 380px;
    padding: 0 !important;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none !important;
    background: linear-gradient(160deg, var(--mk-bordo-acik,#4A2A3B) 0%, var(--mk-bordo,#351D2A) 55%, #24121C 100%);
    transition: transform .25s, box-shadow .25s;
}
.mk-vy-afis:hover{
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(53,29,42,.28);
}
.mk-vy-afis-gorsel{
    position: absolute; inset: 0 0 38% 0;
    display: flex; align-items: center; justify-content: center;
    padding: 26px;
}
.mk-vy-afis-gorsel img{
    max-width: 100%; max-height: 100%;
    width: auto; height: auto; object-fit: contain;
}
.mk-vy-afis-yazi{
    position: relative;
    padding: 22px 22px 24px;
    background: linear-gradient(180deg, rgba(53,29,42,0) 0%, rgba(36,18,28,.92) 26%, #24121C 100%);
}
.mk-vy-etiket{
    display: block;
    font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
    color: var(--mk-altin,#C0A071); font-weight: 600; margin-bottom: 7px;
}
.mk-vy-baslik{
    display: block; font-size: 21px; line-height: 1.2; font-weight: 700;
    color: var(--mk-altin-acik,#E2CD96); margin-bottom: 7px;
}
.mk-vy-alt{
    display: block; font-size: 13px; line-height: 1.5;
    color: rgba(245,240,230,.74); margin-bottom: 16px;
}
.mk-vy-btn{
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 40px; padding: 0 20px; border-radius: 22px;
    background: var(--mk-altin,#C0A071); color: var(--mk-bordo,#351D2A);
    font-size: 13px; font-weight: 600; line-height: 1;
}
.mk-vy-afis:hover .mk-vy-btn{ background: var(--mk-altin-acik,#E2CD96); }
.mk-vy-urunler{ min-width: 0; }

/* --- 2. Kampanya bandı --- */
.mk-vitrin-kampanya{
    background: linear-gradient(135deg, #F6EFE2 0%, #FBF7F0 48%, #F1E8D9 100%);
    border: 1px solid rgba(192,160,113,.3);
    border-radius: 16px;
    padding: 30px 30px 26px;
    position: relative;
    overflow: hidden;
}
.mk-vitrin-kampanya::before{
    content:""; position:absolute; left:30px; right:30px; top:0; height:3px;
    background: linear-gradient(90deg, transparent, var(--mk-altin,#C0A071), transparent);
}
.mk-vk-ust{
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 30px;
    align-items: center;
    margin-bottom: 26px;
}
.mk-vk-gorsel{
    display: flex; align-items: center; justify-content: center;
    min-height: 210px;
}
.mk-vk-gorsel img{
    max-width: 100%; max-height: 260px;
    width: auto; height: auto; object-fit: contain;
}
.mk-vk-yazi h2{
    font-size: 30px; line-height: 1.16; margin: 0 0 10px;
    color: var(--mk-petrol,#123133); letter-spacing: -.015em;
}
.mk-vk-yazi p{
    font-size: 15px; line-height: 1.6; color: #6f6558; margin: 0 0 18px;
    max-width: 46ch;
}
.mk-vitrin-sayac{
    display: flex; gap: 10px; margin: 0 0 20px; flex-wrap: wrap;
}
.mk-vitrin-sayac > span{
    display: flex; flex-direction: column; align-items: center;
    min-width: 62px; padding: 10px 8px;
    background: #fff; border: 1px solid rgba(192,160,113,.32);
    border-radius: 10px;
}
.mk-vitrin-sayac b{
    font-size: 22px; line-height: 1; font-weight: 700;
    color: var(--mk-bordo,#351D2A); font-variant-numeric: tabular-nums;
}
.mk-vitrin-sayac i{
    font-style: normal; font-size: 10px; letter-spacing: .14em;
    text-transform: uppercase; color: #8a8272; margin-top: 6px;
}
.mk-vk-btn{
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 46px; padding: 0 26px !important; border-radius: 24px;
    background: var(--mk-bordo,#351D2A); color: var(--mk-altin-acik,#E2CD96) !important;
    font-size: 14px; font-weight: 600; line-height: 1 !important;
    text-decoration: none !important; transition: background .25s;
}
.mk-vk-btn:hover{ background: var(--mk-petrol,#123133); }
.mk-vk-urunler{ min-width: 0; }

/* --- 3. Kategori bandı --- */
.mk-vitrin-kat-bant{
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 34px;
    align-items: center;
    background: linear-gradient(135deg, var(--mk-petrol,#123133) 0%, var(--mk-petrol-koyu,#0d2426) 100%);
    border-radius: 16px;
    padding: 34px 34px 30px;
    position: relative;
    overflow: hidden;
}
.mk-vitrin-kat-bant::before{
    content:""; position:absolute; left:34px; right:34px; top:0; height:3px;
    background: linear-gradient(90deg, transparent, var(--mk-altin,#C0A071), transparent);
}
.mk-vkb-yazi h2{
    font-size: 28px; line-height: 1.18; margin: 0 0 10px;
    color: var(--mk-altin-acik,#E2CD96); letter-spacing: -.015em;
}
.mk-vkb-yazi p{
    font-size: 14.5px; line-height: 1.6; color: rgba(245,240,230,.74);
    margin: 0 0 22px; max-width: 48ch;
}
.mk-vkb-liste{
    display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 22px;
}
.mk-vkb-kutu{
    display: flex !important; align-items: center; gap: 12px;
    padding: 12px 14px;
    background: rgba(245,240,230,.06);
    border: 1px solid rgba(192,160,113,.28);
    border-radius: 12px;
    text-decoration: none !important;
    transition: background .22s, border-color .22s, transform .22s;
}
.mk-vkb-kutu:hover{
    background: rgba(245,240,230,.1);
    border-color: var(--mk-altin,#C0A071);
    transform: translateY(-2px);
}
/* İkonlar kendi koyu zeminiyle geliyor; kutuya ayrıca beyaz zemin ve
   dolgu verilince ikonun etrafında beyaz bir çerçeve oluşuyordu.
   Kutu şeffaf, görsel köşeden köşeye oturuyor. */
.mk-vkb-gorsel-kucuk{
    width: 46px; height: 46px; flex: none;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border-radius: 9px; padding: 0; overflow: hidden;
}
.mk-vkb-gorsel-kucuk img{
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.mk-vkb-ad{
    flex: 1; font-size: 15px; font-weight: 600;
    color: var(--mk-altin-acik,#E2CD96); line-height: 1.25;
}
.mk-vkb-sayi{
    font-size: 12px; color: rgba(245,240,230,.6); white-space: nowrap;
}
.mk-vkb-btn{
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 44px; padding: 0 24px !important; border-radius: 22px;
    background: var(--mk-altin,#C0A071); color: var(--mk-bordo,#351D2A) !important;
    font-size: 14px; font-weight: 600; line-height: 1 !important;
    text-decoration: none !important;
}
.mk-vkb-btn:hover{ background: var(--mk-altin-acik,#E2CD96); }
.mk-vkb-gorsel{
    display: flex; align-items: center; justify-content: center;
    min-height: 240px;
}
.mk-vkb-gorsel img{
    max-width: 100%; max-height: 320px;
    width: auto; height: auto; object-fit: contain;
    border-radius: 12px;
}

/* --- dar ekran --- */
@media (max-width: 1024px){
    .mk-vy-govde{ grid-template-columns: 240px 1fr; gap: 16px; }
    .mk-vy-afis{ min-height: 330px; }
    .mk-vk-ust{ grid-template-columns: 1fr; gap: 20px; }
    .mk-vk-gorsel{ min-height: 0; }
    .mk-vk-gorsel img{ max-height: 200px; }
    .mk-vitrin-kat-bant{ grid-template-columns: 1fr; gap: 24px; }
    .mk-vkb-gorsel{ min-height: 0; order: -1; }
    .mk-vkb-gorsel img{ max-height: 220px; }
}
@media (max-width: 768px){
    .mk-vy-govde{ grid-template-columns: 1fr; }
    .mk-vy-afis{ min-height: 280px; }
    .mk-vitrin-kampanya{ padding: 22px 18px 20px; }
    .mk-vitrin-kampanya::before{ left: 18px; right: 18px; }
    .mk-vk-yazi h2{ font-size: 23px; }
    .mk-vitrin-sayac > span{ min-width: 54px; padding: 8px 6px; }
    .mk-vitrin-sayac b{ font-size: 18px; }
    .mk-vitrin-kat-bant{ padding: 24px 18px 22px; }
    .mk-vitrin-kat-bant::before{ left: 18px; right: 18px; }
    .mk-vkb-yazi h2{ font-size: 22px; }
    .mk-vkb-liste{ grid-template-columns: 1fr; gap: 9px; }
}


/* ==========================================================================
   ÜRÜN KARTI YÜKSEKLİKLERİNİ EŞİTLE

   Başlığı iki satır olan ürün kartı, tek satır olandan uzun kalıyor ve
   ızgarada satırlar kayıyordu. Kart bir flex sütuna çevriliyor: görsel alanı
   sabit, başlık iki satıra kilitli, buton daima en altta.
   ========================================================================== */
.wd-products .product-grid-item,
.products .product-grid-item{
    display: flex !important;
    flex-direction: column;
    height: 100%;
}
.wd-products .product-grid-item > .product-wrapper,
.products .product-grid-item > .product-wrapper{
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* Görsel alanı sabit yükseklik — farklı oranlardaki fotoğraflar kartı itmesin */
.product-grid-item .product-element-top{
    height: 218px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.product-grid-item .product-element-top img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Başlık iki satıra kilitli: tek satırlık ürün de iki satır yer kaplar */
.product-grid-item .wd-entities-title{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.7em;
    line-height: 1.35;
}

/* Sepete ekle her kartta aynı hizada dursun */
.product-grid-item .wd-add-btn,
.product-grid-item .wd-bottom-actions{
    margin-top: auto;
}

@media (max-width: 768px){
    .product-grid-item .product-element-top{ height: 165px; }
}


/* ==========================================================================
   BOLUM BASLIGI — altigen ikon + marka logosu
   ========================================================================== */
.mk-bolum-baslik{ flex-wrap: wrap; }

.mk-baslik-ikon{
    width: 15px; height: 17px; flex: none;
    background: var(--mk-altin, #C0A071);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.mk-bolum-baslik .mk-baslik{ margin-right: auto; }

/* Kategori bloklarinda markanin kendi logosu */
.mk-baslik-logo{
    display: inline-flex; align-items: center; justify-content: center;
    height: 34px; padding: 4px 10px;
    background: #fff; border: 1px solid var(--mk-cizgi, #e4e4e4);
    border-radius: 6px; flex: none;
}
.mk-baslik-logo img{
    max-height: 26px; max-width: 130px;
    width: auto; height: auto; object-fit: contain; display: block;
}

/* ==========================================================================
   BOLUM ZEMINI — urun izgarasi sayfa boyunca tekrar edince goz kayboluyor
   ========================================================================== */
.mk-zemin{
    border-radius: 16px;
    padding: 30px 28px 24px;
    position: relative;
    overflow: hidden;
}
.mk-zemin-krem{
    background:
        radial-gradient(ellipse at 12% 0%, rgba(192,160,113,.16), transparent 58%),
        linear-gradient(160deg, #FBF7F0 0%, #F3EADA 100%);
    border: 1px solid rgba(192,160,113,.24);
}
/* Cok hafif altigen doku — hissedilir ama okunmaz */
.mk-zemin-krem::before{
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background-image:
        linear-gradient(150deg, rgba(192,160,113,.05) 25%, transparent 25%, transparent 75%, rgba(192,160,113,.05) 75%),
        linear-gradient(30deg,  rgba(192,160,113,.05) 25%, transparent 25%, transparent 75%, rgba(192,160,113,.05) 75%);
    background-size: 26mm 44mm;
}
.mk-zemin > *{ position: relative; }
.mk-zemin .mk-bolum-baslik{ border-bottom-color: rgba(192,160,113,.34); }

/* ==========================================================================
   KATEGORI VITRINI — yesil/altin panel, ortali baslik, kayan serit
   ========================================================================== */
.mk-kat-vitrin{
    background:
        radial-gradient(ellipse at 78% 0%, rgba(192,160,113,.15), transparent 60%),
        linear-gradient(165deg, #1A4245 0%, #123133 48%, #0B2224 100%);
    border-radius: 16px;
    padding: 34px 30px 28px;
    position: relative;
    overflow: hidden;
}
.mk-kat-vitrin::before{
    content: ""; position: absolute; left: 30px; right: 30px; top: 0; height: 2px;
    background: linear-gradient(90deg, transparent, var(--mk-altin, #C0A071), transparent);
}
.mk-kat-vitrin > *{ position: relative; }

.mk-kat-vitrin-ust{ text-align: center; margin-bottom: 6px; }
.mk-kat-ustyazi{
    display: block;
    font-size: 11px; letter-spacing: .28em; text-transform: uppercase;
    color: var(--mk-altin, #C0A071); font-weight: 600;
}
.mk-kat-vitrin-ust h2{
    margin: 8px 0 0;
    font-size: 30px; line-height: 1.15; letter-spacing: -.015em;
    color: var(--mk-altin-acik, #E2CD96);
}
.mk-kat-cizgi{
    display: block; width: 92px; height: 2px; margin: 16px auto 0;
    background: linear-gradient(90deg, transparent, var(--mk-altin, #C0A071), transparent);
}

.mk-kat-araclar{
    display: flex; align-items: center; justify-content: flex-end;
    gap: 10px; margin: 18px 0 16px;
}
.mk-kat-vitrin .mk-vitrin-btn{
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 38px; padding: 0 20px !important; border-radius: 20px;
    background: var(--mk-altin, #C0A071); color: var(--mk-petrol, #123133) !important;
    font-size: 13px; font-weight: 600; line-height: 1 !important;
    text-decoration: none !important; white-space: nowrap;
}
.mk-kat-vitrin .mk-vitrin-btn:hover{ background: var(--mk-altin-acik, #E2CD96); }
.mk-kat-vitrin .mk-ok{
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(245,240,230,.06);
    border: 1px solid rgba(192,160,113,.42);
    color: var(--mk-altin-acik, #E2CD96);
    font-size: 18px; line-height: 1; cursor: pointer;
    display: grid; place-items: center; transition: .22s;
}
.mk-kat-vitrin .mk-ok:hover{
    background: var(--mk-altin, #C0A071);
    border-color: var(--mk-altin, #C0A071);
    color: var(--mk-petrol, #123133);
}

/* --- kayan serit --- */
.mk-kat-vitrin .mk-kat-serit{
    display: flex !important;
    gap: 16px;
    overflow-x: auto; overflow-y: hidden;
    scroll-behavior: auto;
    padding-bottom: 8px; margin: 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(192,160,113,.5) transparent;
}
.mk-kat-vitrin .mk-kat-serit::-webkit-scrollbar{ height: 6px; }
.mk-kat-vitrin .mk-kat-serit::-webkit-scrollbar-thumb{
    background: rgba(192,160,113,.45); border-radius: 3px;
}

/* --- kart ---
   Onceki halde ikon karesi beyaz kartin icinde, etrafinda dolgu ile
   duruyordu: kutu icinde kutu gibi gorunuyordu. Ikon gorseli zaten kendi
   renkli zeminini tasidigi icin dolgu kaldirildi; kare gorsel kartin ust
   yarisini bastan basa dolduruyor. Gorsel de kare, kutu da kare oldugu
   icin 'cover' hicbir yeri kirpmiyor. */
.mk-kat-vitrin .mk-kat-kart{
    flex: 0 0 200px;
    display: flex !important; flex-direction: column;
    background: #fff;
    border: 1px solid rgba(192,160,113,.18);
    border-radius: 14px;
    overflow: hidden;
    padding: 0 !important;
    text-align: center;
    text-decoration: none !important;
    position: relative;
    transition: transform .24s cubic-bezier(.2,.7,.3,1),
                box-shadow .24s, border-color .24s;
}
.mk-kat-vitrin .mk-kat-kart:hover{
    transform: translateY(-6px);
    border-color: var(--mk-altin, #C0A071);
    box-shadow: 0 18px 38px rgba(0,0,0,.30);
}

/* Kare gorsel alani — kartin ustune tam oturuyor */
.mk-kat-vitrin .mk-kat-gorsel{
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    display: block !important;
    padding: 0 !important;
    overflow: hidden;
    background: #FBF7F0;
    position: relative;
}
.mk-kat-vitrin .mk-kat-gorsel img{
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s cubic-bezier(.2,.7,.3,1);
}
.mk-kat-vitrin .mk-kat-kart:hover .mk-kat-gorsel img{ transform: scale(1.06); }

.mk-kat-vitrin .mk-kat-gorsel.mk-kat-bos{
    background: linear-gradient(150deg, #1A4245, #0D2426);
}

/* Gorsel ile yazi arasinda ince altin ayrim */
.mk-kat-vitrin .mk-kat-gorsel::after{
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
    background: linear-gradient(90deg, transparent, var(--mk-altin, #C0A071), transparent);
    opacity: .55; transition: opacity .24s;
}
.mk-kat-vitrin .mk-kat-kart:hover .mk-kat-gorsel::after{ opacity: 1; }

/* --- govde --- */
.mk-kat-govde{
    display: flex; flex-direction: column; align-items: center; gap: 7px;
    padding: 15px 12px 17px;
    flex: 1; justify-content: center;
}
.mk-kat-vitrin .mk-kat-ad{
    font-size: 15.5px; font-weight: 650; line-height: 1.28;
    letter-spacing: -.01em;
    color: var(--mk-petrol, #123133);
    transition: color .2s;
}
.mk-kat-vitrin .mk-kat-kart:hover .mk-kat-ad{ color: var(--mk-bordo, #351D2A); }

/* Adet artik solgun gri yazi degil, kucuk altin rozet */
.mk-kat-vitrin .mk-kat-sayi{
    font-size: 11.5px; font-weight: 600; letter-spacing: .02em;
    color: var(--mk-altin-antik, #A9834A);
    background: rgba(192,160,113,.13);
    border-radius: 20px;
    padding: 3px 10px;
    white-space: nowrap;
}

/* Uzerine gelince beliren ok — karta tiklanabilirlik hissi veriyor */
.mk-kat-vitrin .mk-kat-kart::after{
    content: "→";
    position: absolute; right: 12px; bottom: 12px;
    width: 26px; height: 26px; border-radius: 50%;
    display: grid; place-items: center;
    font-size: 14px; line-height: 1;
    background: var(--mk-altin, #C0A071);
    color: var(--mk-petrol, #123133);
    opacity: 0; transform: translateX(-6px);
    transition: opacity .24s, transform .24s;
}
.mk-kat-vitrin .mk-kat-kart:hover::after{ opacity: 1; transform: translateX(0); }

/* Kaydirma cubugu daha sakin — oklar zaten var */
.mk-kat-vitrin .mk-kat-serit{ scrollbar-color: rgba(192,160,113,.35) transparent; }
.mk-kat-vitrin .mk-kat-serit::-webkit-scrollbar{ height: 4px; }
.mk-kat-vitrin .mk-kat-serit::-webkit-scrollbar-thumb{
    background: rgba(192,160,113,.3); border-radius: 3px;
}

@media (prefers-reduced-motion: reduce){
    .mk-kat-vitrin .mk-kat-kart,
    .mk-kat-vitrin .mk-kat-gorsel img,
    .mk-kat-vitrin .mk-kat-kart::after{ transition: none; }
    .mk-kat-vitrin .mk-kat-kart:hover{ transform: none; }
    .mk-kat-vitrin .mk-kat-kart:hover .mk-kat-gorsel img{ transform: none; }
}

@media (max-width: 768px){
    .mk-kat-vitrin{ padding: 24px 16px 20px; }
    .mk-kat-vitrin::before{ left: 16px; right: 16px; }
    .mk-kat-vitrin-ust h2{ font-size: 23px; }
    .mk-kat-araclar{ justify-content: space-between; }
    .mk-kat-vitrin .mk-kat-kart{ flex: 0 0 156px; }
    .mk-kat-vitrin .mk-kat-ad{ font-size: 14px; }
    .mk-kat-govde{ padding: 12px 8px 14px; }
    .mk-kat-vitrin .mk-kat-kart::after{ display: none; }
    .mk-zemin{ padding: 22px 16px 18px; }
    .mk-baslik-logo{ height: 28px; }
    .mk-baslik-logo img{ max-height: 20px; max-width: 96px; }
}


/* ==========================================================================
   BASLIK ALTI KAYAN BANT
   Icerik iki kez basiliyor; ray %50 kaydirilip sifira dogru animasyon
   ediliyor. Basa dondugunde goruntu ayni oldugu icin sicrama olmuyor.
   ========================================================================== */
.mk-kargo-bant{
    --mk-bant-hiz: 34s;
    background: linear-gradient(90deg, #2C1622 0%, #4A2A3B 50%, #2C1622 100%);
    border-bottom: 1px solid rgba(192,160,113,.32);
    overflow: hidden;
    position: relative;
}
/* Kenarlarda yumusak kaybolma — yazi aniden kesilmesin */
.mk-kargo-bant::before,
.mk-kargo-bant::after{
    content: ""; position: absolute; top: 0; bottom: 0; width: 68px; z-index: 2;
    pointer-events: none;
}
.mk-kargo-bant::before{ left: 0;  background: linear-gradient(90deg, #2C1622, transparent); }
.mk-kargo-bant::after{  right: 0; background: linear-gradient(270deg, #2C1622, transparent); }

.mk-bant-ray{
    display: flex;
    width: max-content;
    animation: mk-bant-kay var(--mk-bant-hiz, 34s) linear infinite;
    will-change: transform;
}
@keyframes mk-bant-kay{
    from{ transform: translateX(-50%); }
    to{   transform: translateX(0); }
}
.mk-kargo-bant:hover .mk-bant-ray{ animation-play-state: paused; }

.mk-bant-grup{ display: flex; align-items: center; flex: none; }

.mk-bant-oge{
    display: inline-flex; align-items: center; gap: 10px;
    padding: 11px 0;
    font-size: 13.5px; font-weight: 600; letter-spacing: .01em;
    color: var(--mk-altin-acik, #E2CD96);
    white-space: nowrap;
}
.mk-bant-ek{ color: rgba(226,205,150,.72); font-weight: 500; }

.mk-bant-ikon{
    width: 19px; height: 19px; flex: none;
    color: var(--mk-altin, #C0A071);
}

/* Altigen ayrac — logodaki bicimin kucuk hali */
.mk-bant-ayrac{
    width: 7px; height: 8px; flex: none; margin: 0 26px;
    background: var(--mk-altin, #C0A071);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    opacity: .75;
}

@media (max-width: 768px){
    .mk-bant-oge{ font-size: 12.5px; padding: 9px 0; }
    .mk-bant-ayrac{ margin: 0 18px; }
    .mk-kargo-bant::before, .mk-kargo-bant::after{ width: 36px; }
}

/* Hareket hassasiyeti olanlarda akis dursun */
@media (prefers-reduced-motion: reduce){
    .mk-bant-ray{ animation: none; transform: translateX(0); }
    .mk-kargo-bant::before, .mk-kargo-bant::after{ display: none; }
}


/* ==========================================================================
   KAYNAK ALANI VE HESAP SAYFASI
   ========================================================================== */
.mk-kaynak-alan select,
.mk-hesap-kaynak select{
    width: 100%; padding: 11px 12px;
    border: 1px solid var(--mk-cizgi, #e4e4e4); border-radius: 8px;
    background: #fff; font-size: 14px; color: var(--mk-metin, #2A2521);
}
.mk-kaynak-alan label{ display: block; margin-bottom: 6px; font-weight: 600; }

.mk-onay{ font-size: 13.5px; line-height: 1.55; }
.mk-onay label{ display: flex; gap: 9px; align-items: flex-start; cursor: pointer; }
.mk-onay input{ margin-top: 3px; flex: none; }
.mk-onay a{ color: var(--mk-petrol, #123133); text-decoration: underline; }

/* Parola tekrar uyarisi */
.mk-parola-durum{
    display: block; margin-top: 5px; font-size: 12.5px; min-height: 16px;
}
.mk-parola-durum.mk-uyus{ color: #1a7f37; }
.mk-parola-durum.mk-uyusmaz{ color: #b32d2e; }

/* Toptan hesabim sekmesi */
.mk-hesap-tablo{ width: 100%; border-collapse: collapse; margin-top: 10px; }
.mk-hesap-tablo th,
.mk-hesap-tablo td{
    text-align: left; padding: 11px 0;
    border-bottom: 1px solid var(--mk-cizgi, #e4e4e4);
    font-size: 14.5px;
}
.mk-hesap-tablo th{ width: 190px; color: #6f6558; font-weight: 600; }
.mk-hesap-bayi .mk-kucuk{ font-size: 12.5px; color: #8a8272; margin-top: 14px; }
.mk-hesap-kaynak legend{ font-weight: 600; margin-bottom: 8px; }

/* Odeme sayfasindaki kaynak sorusu */
.mk-odeme-kaynak{ margin-top: 22px; }
.mk-odeme-kaynak h3{ font-size: 17px; margin-bottom: 10px; }

/* --------------------------------------------------------------------------
   Kargo takibi — sipariş detayı
   -------------------------------------------------------------------------- */

.mk-kargo-takip {
    margin: 30px 0;
    padding: 22px 24px;
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 10px;
}

.mk-kargo-takip > h2 {
    margin: 0 0 16px;
    font-size: 18px;
    color: var(--mk-petrol);
}

.mk-kargo-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 26px;
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--mk-cizgi);
}

.mk-kargo-etiket {
    display: block;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #8a8a8a;
    margin-bottom: 2px;
}

.mk-kargo-ust strong {
    font-size: 15px;
    color: var(--mk-petrol);
}

.mk-kargo-link {
    margin-left: auto;
    padding: 9px 18px;
    border-radius: 6px;
    background: var(--mk-petrol);
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.mk-kargo-link:hover {
    background: var(--mk-petrol-acik);
}

/* Adımlar yatay ilerliyor; çizgi noktaların arasından geçiyor. */
.mk-kargo-adimlar {
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mk-kargo-adim {
    position: relative;
    flex: 1 1 0;
    padding: 26px 8px 0;
    text-align: center;
    font-size: 13px;
    color: #9a9a9a;
}

.mk-kargo-adim::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--mk-cizgi);
}

.mk-kargo-adim:first-child::before { left: 50%; width: 50%; }
.mk-kargo-adim:last-child::before  { width: 50%; }

/* Zemin gri kalıyor; altın çizgi bunun üstüne soldan sağa doluyor. */
.mk-kargo-adim.mk-gecti::before {
    background-color: var(--mk-cizgi);
}

/* Aktif adımda çizginin sağ yarısı henüz tamamlanmadı. */
.mk-kargo-adim.mk-aktif::before {
    background: linear-gradient(to right, var(--mk-altin) 50%, var(--mk-cizgi) 50%);
}

.mk-kargo-adim:last-child.mk-aktif::before {
    background: var(--mk-altin);
}

.mk-kargo-nokta {
    position: absolute;
    top: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--mk-cizgi);
}

.mk-kargo-adim.mk-gecti .mk-kargo-nokta {
    background: var(--mk-altin);
    border-color: var(--mk-altin);
}

.mk-kargo-adim.mk-aktif .mk-kargo-nokta {
    background: var(--mk-petrol);
    border-color: var(--mk-altin);
    box-shadow: 0 0 0 4px rgba(192, 160, 113, .25);
}

.mk-kargo-ad {
    display: block;
    font-weight: 600;
}

.mk-kargo-adim.mk-gecti .mk-kargo-ad { color: var(--mk-petrol); }

.mk-kargo-adim.mk-aktif .mk-kargo-ad {
    color: var(--mk-petrol);
    font-weight: 700;
}

.mk-kargo-not {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #7a7a7a;
}

.mk-kargo-gecmis {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--mk-cizgi);
}

.mk-kargo-gecmis summary {
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--mk-petrol);
}

.mk-kargo-gecmis ul {
    margin: 14px 0 0;
    padding: 0 0 0 18px;
    list-style: none;
    border-left: 2px solid var(--mk-cizgi);
}

.mk-kargo-gecmis li {
    position: relative;
    margin-bottom: 14px;
    font-size: 13px;
    line-height: 1.5;
}

.mk-kargo-gecmis li::before {
    content: "";
    position: absolute;
    left: -24px;
    top: 6px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--mk-altin);
}

.mk-kargo-gecmis li span,
.mk-kargo-gecmis li em {
    display: block;
    color: #8a8a8a;
    font-size: 12px;
}

@media (max-width: 600px) {
    .mk-kargo-adimlar { display: block; }

    .mk-kargo-adim {
        padding: 0 0 18px 30px;
        text-align: left;
    }

    /* Dikey düzende çizgi sola geçiyor. */
    .mk-kargo-adim::before {
        top: 10px;
        left: 7px;
        width: 3px;
        height: 100%;
    }

    .mk-kargo-adim:first-child::before { left: 7px; width: 3px; }
    .mk-kargo-adim:last-child::before  { height: 0; }
    .mk-kargo-adim.mk-aktif::before    { background: var(--mk-cizgi); }
    .mk-kargo-nokta { left: 0; transform: none; }
    .mk-kargo-link  { margin-left: 0; }
}

/* --------------------------------------------------------------------------
   İade talepleri
   -------------------------------------------------------------------------- */

.mk-iade-form-kutu,
.mk-iade-ozet {
    margin: 30px 0;
    padding: 22px 24px;
    background: #fff;
    border: 1px solid var(--mk-cizgi);
    border-radius: 10px;
}

.mk-iade-form-kutu > h2,
.mk-iade-ozet > h2 {
    margin: 0 0 8px;
    font-size: 18px;
    color: var(--mk-petrol);
}

.mk-iade-form fieldset {
    margin: 16px 0;
    padding: 14px 16px;
    border: 1px solid var(--mk-cizgi);
    border-radius: 8px;
}

.mk-iade-form legend {
    padding: 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mk-petrol);
}

.mk-iade-urun {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
}

.mk-iade-urun:last-child { border-bottom: 0; }

.mk-iade-urun-ad   { flex: 1; font-size: 14px; }
.mk-iade-urun-adet { color: #8a8a8a; font-size: 13px; }

.mk-iade-form > p > label {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mk-petrol);
}

.mk-iade-form select,
.mk-iade-form textarea {
    width: 100%;
    max-width: 520px;
    padding: 10px 12px;
    border: 1px solid var(--mk-cizgi);
    border-radius: 6px;
    font-size: 14px;
}

.mk-iade-gonder {
    background: var(--mk-petrol) !important;
    color: #fff !important;
}

.mk-iade-gonder:hover { background: var(--mk-petrol-acik) !important; }

.mk-iade-uyari {
    margin: 16px 0;
    padding: 12px 16px;
    background: #fdf6e8;
    border-left: 3px solid var(--mk-altin);
    border-radius: 4px;
    font-size: 14px;
}

.mk-iade-yanit {
    margin-top: 10px;
    padding: 12px 16px;
    background: var(--mk-sayfa-bg);
    border-radius: 6px;
    font-size: 14px;
}

.mk-iade-rozet {
    display: inline-block;
    padding: 4px 11px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    background: #eee;
    color: #555;
}

.mk-iade-beklemede  { background: #fdf1d8; color: #8a6417; }
.mk-iade-onaylandi  { background: #e2f0e5; color: #1f6b33; }
.mk-iade-kargoda    { background: #e4eef5; color: #1c5578; }
.mk-iade-tamamlandi { background: var(--mk-petrol); color: #fff; }
.mk-iade-reddedildi { background: #f7e2e2; color: #8c2b2b; }

/* --------------------------------------------------------------------------
   İskonto gösterimi
   -------------------------------------------------------------------------- */

.mk-iskonto-rozet {
    margin: 14px 0 18px;
    padding: 11px 16px;
    background: linear-gradient(90deg, rgba(192, 160, 113, .16), rgba(192, 160, 113, .04));
    border-left: 3px solid var(--mk-altin);
    border-radius: 4px;
    font-size: 14px;
    color: var(--mk-petrol);
}

.mk-iskonto-rozet strong { color: var(--mk-petrol); }

.mk-iskonto-rozet-not {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #7f7f7f;
}

.mk-iskonto-satir th { color: var(--mk-petrol); }

.mk-iskonto-satir td strong { color: #1f6b33; }

.mk-iskonto-satir td small {
    color: #8a8a8a;
    font-weight: 400;
}

.mk-iskonto-oran {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 20px;
    background: var(--mk-altin);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

/* --------------------------------------------------------------------------
   Kargo takibi — hareket
   Aktif adım nefes alıyor, tamamlanan çizgi soldan sağa doluyor.
   -------------------------------------------------------------------------- */

@keyframes mk-nabiz {
    0%   { box-shadow: 0 0 0 0   rgba(192, 160, 113, .55); }
    70%  { box-shadow: 0 0 0 11px rgba(192, 160, 113, 0);  }
    100% { box-shadow: 0 0 0 0   rgba(192, 160, 113, 0);   }
}

@keyframes mk-cizgi-dol {
    from { background-size: 0 100%; }
    to   { background-size: 100% 100%; }
}

.mk-kargo-adim.mk-aktif .mk-kargo-nokta {
    animation: mk-nabiz 2.1s ease-out infinite;
}

.mk-kargo-adim.mk-gecti::before {
    background-image: linear-gradient(var(--mk-altin), var(--mk-altin));
    background-repeat: no-repeat;
    animation: mk-cizgi-dol .5s ease-out both;
}

/* Adımlar sırayla dolsun; sonraki biraz gecikmeli başlıyor. */
.mk-kargo-adim:nth-child(2).mk-gecti::before { animation-delay: .12s; }
.mk-kargo-adim:nth-child(3).mk-gecti::before { animation-delay: .24s; }
.mk-kargo-adim:nth-child(4).mk-gecti::before { animation-delay: .36s; }

.mk-kargo-adim.mk-gecti .mk-kargo-nokta,
.mk-kargo-adim.mk-aktif .mk-kargo-nokta {
    transition: background-color .3s ease, border-color .3s ease;
}

.mk-kargo-adim.mk-teslim .mk-kargo-nokta {
    background: #1f6b33;
    border-color: #1f6b33;
    animation: none;
}

/* Hareketi kapatanlarda sabit dursun. */
@media (prefers-reduced-motion: reduce) {
    .mk-kargo-adim.mk-aktif .mk-kargo-nokta,
    .mk-kargo-adim.mk-gecti::before {
        animation: none;
    }
}

/* --------------------------------------------------------------------------
   İade talimatı
   -------------------------------------------------------------------------- */

.mk-iade-talimat {
    margin-top: 14px;
    padding: 16px 18px;
    background: var(--mk-sayfa-bg);
    border: 1px solid var(--mk-cizgi);
    border-radius: 8px;
}

.mk-iade-talimat h4 {
    margin: 0 0 10px;
    font-size: 14px;
    color: var(--mk-petrol);
}

.mk-iade-talimat ul {
    margin: 0;
    padding-left: 18px;
    font-size: 13.5px;
    line-height: 1.65;
}

.mk-iade-kod {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
    padding: 12px 16px;
    background: var(--mk-petrol);
    border-radius: 6px;
}

.mk-iade-kod-etiket {
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .7);
}

.mk-iade-kod strong {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 20px;
    letter-spacing: .08em;
    color: var(--mk-altin-acik);
}

.mk-iade-takip-form {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--mk-cizgi);
}

.mk-iade-takip-form label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: #6a6a6a;
}

.mk-iade-takip-satir {
    display: flex;
    gap: 8px;
    max-width: 420px;
}

.mk-iade-takip-satir input {
    flex: 1;
    padding: 9px 12px;
    border: 1px solid var(--mk-cizgi);
    border-radius: 6px;
    font-size: 14px;
}

.mk-iade-takip-var {
    margin: 12px 0 0;
    font-size: 13.5px;
    color: #1f6b33;
}

.mk-iade-talimat-satir > td {
    padding-top: 0 !important;
    background: transparent;
}

@media (max-width: 520px) {
    .mk-iade-takip-satir { flex-direction: column; }
    .mk-iade-kod { flex-direction: column; align-items: flex-start; gap: 4px; }
}

/* --------------------------------------------------------------------------
   Mobil menü
   Tema iki sekme basıyor ("Menü" ve "Categories") ama ikisi de aynı menüye
   bağlı — kullanıcı için anlamsız bir seçim. Sekme şeridini kaldırıp tek
   liste bırakıyoruz. Favoriler ve Karşılaştır da temanın kendi eklediği
   maddeler; kullanılmadıkları için gizli.
   -------------------------------------------------------------------------- */

/* Panel gövdesi */
.mobile-nav {
    width: 310px !important;
    background: linear-gradient(180deg, #3d2231 0%, var(--mk-bordo, #351D2A) 45%, #2a1622 100%) !important;
    color: var(--mk-altin-acik, #E2CD96) !important;
    box-shadow: 4px 0 26px rgba(0, 0, 0, .35);
}

/* Üstte ince altın şerit — panelin markaya ait olduğunu belli ediyor. */
.mobile-nav::before {
    content: "";
    position: sticky;
    top: 0;
    display: block;
    height: 3px;
    background: linear-gradient(90deg, var(--mk-altin, #C0A071), var(--mk-altin-acik, #E2CD96), var(--mk-altin, #C0A071));
    z-index: 2;
}

/* İkiz sekme şeridi ve ikinci liste: gizli. */
.mobile-nav .wd-nav-mob-tab,
.mobile-nav .mobile-categories-menu {
    display: none !important;
}

.mobile-nav .mobile-pages-menu {
    display: block !important;
    padding: 10px 0 26px !important;
    margin: 0 !important;
}

/* Temanın eklediği favoriler / karşılaştır maddeleri. */
.mobile-nav .menu-item-wishlist,
.mobile-nav .menu-item-compare {
    display: none !important;
}

/* ---- Maddeler ---- */

.mobile-nav .wd-nav-mobile > li {
    border-bottom: 1px solid rgba(192, 160, 113, .16) !important;
}

.mobile-nav .wd-nav-mobile > li:last-child {
    border-bottom: 0 !important;
}

.mobile-nav .wd-nav-mobile a {
    padding: 14px 22px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: var(--mk-altin-acik, #E2CD96) !important;
    letter-spacing: .01em;
    transition: background-color .18s ease, color .18s ease;
}

.mobile-nav .wd-nav-mobile a:hover,
.mobile-nav .wd-nav-mobile a:focus {
    background: rgba(192, 160, 113, .12) !important;
    color: #fff !important;
}

/* Bulunulan sayfa: solda altın çubuk. */
.mobile-nav .wd-nav-mobile > li.current-menu-item > a,
.mobile-nav .wd-nav-mobile > li.current_page_item > a {
    color: #fff !important;
    background: rgba(192, 160, 113, .14) !important;
    box-shadow: inset 3px 0 0 var(--mk-altin, #C0A071);
}

/* ---- Alt menüler ---- */

.mobile-nav .wd-sub-menu,
.mobile-nav .sub-sub-menu {
    background: rgba(0, 0, 0, .22) !important;
    border-top: 1px solid rgba(192, 160, 113, .14);
}

.mobile-nav .wd-sub-menu > li,
.mobile-nav .sub-sub-menu > li {
    border-bottom: 1px solid rgba(192, 160, 113, .1) !important;
}

.mobile-nav .wd-sub-menu > li:last-child,
.mobile-nav .sub-sub-menu > li:last-child {
    border-bottom: 0 !important;
}

.mobile-nav .item-level-1 > a {
    padding-left: 36px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: rgba(226, 205, 150, .82) !important;
}

.mobile-nav .item-level-2 > a {
    padding-left: 50px !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    color: rgba(226, 205, 150, .68) !important;
}

/* ---- Açma okları ---- */

.mobile-nav .wd-nav-opener {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 52px !important;
    border-left: 1px solid rgba(192, 160, 113, .14);
}

/* Temanın ikon-font glifi (\f113) kapatıldı. Döndürme yerine iki ayrı
   SVG kullanıyoruz: pseudo ögede transform bu temada güvenilir
   çalışmıyor (tema kendi rotate(90deg) kuralını basıyor). Böylece alt
   menüsü olduğu ve aşağı açıldığı ilk bakışta anlaşılıyor. */
.mobile-nav .wd-nav-opener::before {
    content: none !important;
}

.mobile-nav .wd-nav-opener::after {
    content: "" !important;
    font-family: inherit !important;
    font-size: 0 !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    border: 0 !important;
    transform: none !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C0A071' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat center / 16px 16px !important;
    transition: background-image .15s ease;
}

/* Açıkken ok yukarı bakıyor; hangi maddenin açık olduğu belli oluyor. */
.mobile-nav .wd-nav-opener.wd-active {
    background: rgba(192, 160, 113, .14) !important;
}

.mobile-nav .wd-nav-opener.wd-active::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E2CD96' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 15 12 9 18 15'/%3E%3C/svg%3E") !important;
}

/* Alt seviyelerde ok biraz küçülüyor. */
.mobile-nav .item-level-1 > .wd-nav-opener::after {
    width: 13px !important;
    height: 13px !important;
    background-size: 13px 13px !important;
}

/* ---- Kapatma düğmesi ve perde ---- */

.wd-close-side {
    background: rgba(20, 10, 16, .55) !important;
}

.mobile-nav .wd-close-side,
.mobile-nav ~ .wd-close-side {
    color: var(--mk-altin-acik, #E2CD96) !important;
}

/* Panelde kaydırma çubuğu koyu zeminle uyumlu olsun. */
.mobile-nav {
    scrollbar-width: thin;
    scrollbar-color: rgba(192, 160, 113, .45) transparent;
}

.mobile-nav::-webkit-scrollbar {
    width: 6px;
}

.mobile-nav::-webkit-scrollbar-thumb {
    background: rgba(192, 160, 113, .45);
    border-radius: 3px;
}

/* Dar telefonlarda panel ekranın çoğunu kaplasın. */
@media (max-width: 380px) {
    .mobile-nav {
        width: 86vw !important;
    }
}

/* --------------------------------------------------------------------------
   Kademeli bayi fiyatı — ürün sayfası
   -------------------------------------------------------------------------- */

.mk-kademe {
    width: 100%;
    margin: 18px 0 22px;
    padding: 18px 20px;
    background: linear-gradient(160deg, rgba(18, 49, 51, .04), rgba(192, 160, 113, .07));
    border: 1px solid rgba(192, 160, 113, .45);
    border-radius: 10px;
}

.mk-kademe-baslik {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.mk-kademe-baslik h4 {
    margin: 0;
    font-size: 16px;
    color: var(--mk-petrol, #123133);
}

.mk-kademe-rozet {
    padding: 4px 11px;
    border-radius: 20px;
    background: var(--mk-petrol, #123133);
    color: var(--mk-altin-acik, #E2CD96);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* ---- Tablo ---- */

.mk-kademe-tablo {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.mk-kademe-tablo th {
    padding: 9px 12px;
    background: var(--mk-petrol, #123133);
    color: rgba(255, 255, 255, .82);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-align: left;
    border: 0;
}

.mk-kademe-tablo td {
    padding: 10px 12px;
    border-top: 1px solid #eee;
    font-size: 14px;
    color: #333;
}

.mk-kademe-tablo tbody tr:first-child td {
    border-top: 0;
}

.mk-kademe-tablo td:first-child {
    font-weight: 600;
    color: var(--mk-petrol, #123133);
    white-space: nowrap;
}

.mk-kademe-fiyat {
    font-weight: 700;
    color: var(--mk-petrol, #123133);
}

.mk-kademe-oran {
    color: #1f6b33;
    font-weight: 600;
    white-space: nowrap;
}

/* Seçili adede denk gelen satır. */
.mk-kademe-tablo tbody tr.mk-aktif {
    background: rgba(192, 160, 113, .16);
    box-shadow: inset 3px 0 0 var(--mk-altin, #C0A071);
}

.mk-kademe-tablo tbody tr.mk-aktif td {
    color: var(--mk-petrol, #123133);
}

/* ---- Canlı özet ---- */

.mk-kademe-ozet {
    margin-top: 14px;
    padding: 14px 16px;
    background: var(--mk-petrol, #123133);
    border-radius: 8px;
    color: #fff;
}

.mk-kademe-ozet-satir {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 0;
    font-size: 14px;
}

.mk-kademe-ozet-satir span {
    color: rgba(255, 255, 255, .68);
}

.mk-kademe-ozet-satir strong {
    color: var(--mk-altin-acik, #E2CD96);
    font-weight: 700;
}

.mk-kademe-toplam-satir {
    margin-top: 6px;
    padding-top: 10px;
    border-top: 1px solid rgba(226, 205, 150, .25);
}

.mk-kademe-toplam-satir span {
    color: #fff;
    font-weight: 600;
}

.mk-kademe-toplam-satir strong {
    font-size: 20px;
}

.mk-kademe-ipucu {
    margin: 10px 0 0;
    padding-top: 10px;
    border-top: 1px dashed rgba(226, 205, 150, .25);
    font-size: 13px;
    color: var(--mk-altin-acik, #E2CD96);
    line-height: 1.45;
}

.mk-kademe-not {
    margin: 12px 0 0;
    font-size: 12.5px;
    color: #7a7a7a;
}

.mk-kademe-not s {
    color: #999;
}

@media (max-width: 480px) {
    .mk-kademe {
        padding: 14px;
    }

    .mk-kademe-tablo th,
    .mk-kademe-tablo td {
        padding: 8px 9px;
        font-size: 13px;
    }

    .mk-kademe-baslik {
        flex-wrap: wrap;
        gap: 6px;
    }
}

/* --------------------------------------------------------------------------
   Kullanıcı listesindeki bayi onay düğmeleri
   -------------------------------------------------------------------------- */

.mk-bayi-islem {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 7px;
}

.mk-bayi-islem .button-small {
    height: auto;
    padding: 3px 11px;
    font-size: 12px;
    line-height: 1.7;
}

.mk-onay-dugme {
    background: #1f6b33 !important;
    border-color: #1a5a2b !important;
    color: #fff !important;
    text-shadow: none !important;
}

.mk-onay-dugme:hover,
.mk-onay-dugme:focus {
    background: #1a5a2b !important;
    border-color: #144623 !important;
    color: #fff !important;
}

.mk-red-dugme {
    color: #b32d2e !important;
    border-color: #cfa3a3 !important;
}

.mk-red-dugme:hover,
.mk-red-dugme:focus {
    background: #fdf0f0 !important;
    border-color: #b32d2e !important;
    color: #8c2b2b !important;
}

/* Bayi başvurusundaki parola alanları */
.mk-parola-satir .mk-alan-not {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #8a8a8a;
}

.mk-parola-satir .mk-parola-durum {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    font-weight: 600;
}

/* ==========================================================================
   ÜRÜN SAYFASI
   Tema demo şablonu kapatıldığında sayfa çıplak kalıyordu; buradaki
   kurallar özet sütununu, güven şeridini ve sekmeleri markaya oturtuyor.
   ========================================================================== */

/* ---- Başlık üstü: marka + ürün kodu ---- */

.mk-urun-ust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
}

.mk-urun-marka {
    padding: 4px 12px;
    border-radius: 20px;
    background: var(--mk-petrol, #123133);
    color: var(--mk-altin-acik, #E2CD96);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.mk-urun-kod {
    font-size: 12.5px;
    color: #8a8a8a;
}

/* ---- Ürün başlığı ve fiyat ---- */

.single-product .summary .product_title {
    margin-bottom: 8px;
    font-size: 27px;
    line-height: 1.28;
    color: var(--mk-petrol, #123133);
}

.single-product .summary .price {
    display: block;
    margin: 4px 0 14px;
    font-size: 30px;
    font-weight: 700;
    color: var(--mk-petrol, #123133);
}

.single-product .summary .price del {
    font-size: 18px;
    font-weight: 400;
    opacity: .5;
}

.single-product .summary .price ins {
    text-decoration: none;
}

.single-product .woocommerce-product-details__short-description {
    padding-bottom: 14px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--mk-cizgi, #e4e4e4);
    font-size: 14.5px;
    line-height: 1.65;
    color: #555;
}

/* ---- Sepete ekle satırı ---- */

.single-product form.cart {
    margin-top: 6px;
}

.single-product .summary .single_add_to_cart_button {
    min-height: 48px;
    padding: 0 30px !important;
    border-radius: 8px !important;
    background: var(--mk-petrol, #123133) !important;
    color: #fff !important;
    font-weight: 700 !important;
    letter-spacing: .01em;
}

.single-product .summary .single_add_to_cart_button:hover {
    background: var(--mk-petrol-acik, #1a4245) !important;
}

/* ---- Güven şeridi ---- */

.mk-urun-guven {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 20px 0 6px;
    background: var(--mk-cizgi, #e4e4e4);
    border: 1px solid var(--mk-cizgi, #e4e4e4);
    border-radius: 10px;
    overflow: hidden;
}

.mk-ug-madde {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 14px;
    background: #fff;
    text-decoration: none !important;
    color: inherit !important;
    transition: background-color .18s ease;
}

a.mk-ug-madde:hover {
    background: rgba(192, 160, 113, .1);
}

.mk-ug-ikon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 9px;
    background: rgba(192, 160, 113, .16);
    color: var(--mk-petrol, #123133);
}

.mk-ug-ikon svg {
    width: 20px;
    height: 20px;
}

.mk-ug-yazi {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.mk-ug-yazi strong {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--mk-petrol, #123133);
    line-height: 1.3;
}

.mk-ug-yazi em {
    font-size: 12px;
    font-style: normal;
    color: #8a8a8a;
    line-height: 1.35;
}

a.mk-ug-madde .mk-ug-yazi strong {
    text-decoration: underline;
    text-decoration-color: rgba(192, 160, 113, .5);
    text-underline-offset: 3px;
}

@media (max-width: 520px) {
    .mk-urun-guven {
        grid-template-columns: 1fr;
    }
}

/* ---- Sekmeler ---- */

.single-product .product-tabs-wrapper {
    margin-top: 34px;
    padding-top: 6px;
    border-top: 1px solid var(--mk-cizgi, #e4e4e4);
}

.single-product .wd-nav-tabs > li > a,
.single-product .woocommerce-tabs .wd-nav-tabs a {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #7a7a7a !important;
}

.single-product .wd-nav-tabs > li.active > a,
.single-product .woocommerce-tabs .wd-nav-tabs li.active a {
    color: var(--mk-petrol, #123133) !important;
}

.single-product .wd-tab-content,
.single-product .woocommerce-Tabs-panel {
    font-size: 14.5px;
    line-height: 1.75;
    color: #444;
}

.single-product .wd-tab-content h2,
.single-product .woocommerce-Tabs-panel h2 {
    font-size: 19px;
    color: var(--mk-petrol, #123133);
}

/* ---- Ürün özellikleri tablosu ---- */

.single-product .shop_attributes {
    width: 100%;
    max-width: 620px;
    border-collapse: collapse;
    border: 1px solid var(--mk-cizgi, #e4e4e4);
    border-radius: 10px;
    overflow: hidden;
}

.single-product .shop_attributes th,
.single-product .shop_attributes td {
    padding: 11px 16px;
    border: 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    text-align: left;
}

.single-product .shop_attributes tr:last-child th,
.single-product .shop_attributes tr:last-child td {
    border-bottom: 0;
}

.single-product .shop_attributes th {
    width: 42%;
    background: rgba(18, 49, 51, .04);
    font-weight: 600;
    color: var(--mk-petrol, #123133);
}

.single-product .shop_attributes td p {
    margin: 0;
}

/* ---- Ürün açıklamasındaki listeler ---- */

.single-product .wd-tab-content ul,
.single-product .woocommerce-Tabs-panel ul {
    margin: 0 0 14px;
    padding-left: 0;
    list-style: none;
}

.single-product .wd-tab-content ul > li,
.single-product .woocommerce-Tabs-panel ul > li {
    position: relative;
    padding-left: 22px;
    margin-bottom: 7px;
}

.single-product .wd-tab-content ul > li::before,
.single-product .woocommerce-Tabs-panel ul > li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 9px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--mk-altin, #C0A071);
}

/* ---- Benzer ürünler başlığı ---- */

.single-product .related-and-upsells .title-wrapper .title,
.single-product .related.products > h2,
.single-product .upsells.products > h2 {
    color: var(--mk-petrol, #123133);
}

/* ==========================================================================
   BAYİ ŞERİDİ — açılır iskonto detayı
   Şerit artık iki katmanlı: üst satır özet, altında açılır panel.
   Yukarıdaki eski .mk-bayi-serit flex kuralını burada geçersiz kılıyoruz.
   ========================================================================== */

.mk-bayi-serit {
    display: block !important;
    padding: 0 !important;
    gap: 0 !important;
}

.mk-bs-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 18px;
    padding: 8px 16px;
    font-size: 13px;
}

.mk-bs-firma strong {
    color: #fff;
    font-weight: 600;
}

.mk-bs-oran {
    padding: 2px 12px;
    border: 1px solid var(--mk-altin, #C0A071);
    border-radius: 20px;
    font-weight: 600;
    white-space: nowrap;
}

.mk-bs-not {
    opacity: .72;
}

/* Açma düğmesi */
.mk-bs-ac {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 12px;
    border: 1px solid rgba(226, 205, 150, .45);
    border-radius: 20px;
    background: rgba(226, 205, 150, .1);
    color: var(--mk-altin-acik, #E2CD96);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease;
}

.mk-bs-ac:hover {
    background: rgba(226, 205, 150, .2);
    border-color: var(--mk-altin-acik, #E2CD96);
}

.mk-bs-ac svg {
    width: 13px;
    height: 13px;
    transition: transform .22s ease;
}

.mk-bs-acik .mk-bs-ac svg {
    transform: rotate(180deg);
}

.mk-bs-hesap {
    color: var(--mk-altin-acik, #E2CD96) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

/* ---- Açılır panel ---- */

.mk-bs-detay {
    padding: 18px 20px 20px;
    background: rgba(0, 0, 0, .22);
    border-top: 1px solid rgba(226, 205, 150, .2);
}

.mk-bs-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
    max-width: 1180px;
    margin: 0 auto;
}

.mk-bs-kutu {
    padding: 14px 16px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(226, 205, 150, .18);
    border-radius: 9px;
}

.mk-bs-kutu h4 {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--mk-altin, #C0A071);
}

.mk-bs-kutu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mk-bs-kutu li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
    border-bottom: 1px solid rgba(226, 205, 150, .12);
    font-size: 13.5px;
}

.mk-bs-kutu li:last-child {
    border-bottom: 0;
}

.mk-bs-kutu li span {
    color: rgba(255, 255, 255, .82);
    min-width: 0;
    overflow-wrap: anywhere;
}

.mk-bs-kutu li strong {
    color: var(--mk-altin-acik, #E2CD96);
    font-weight: 700;
    white-space: nowrap;
}

.mk-bs-kutu p {
    margin: 9px 0 0;
    font-size: 11.5px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .55);
}

.mk-bs-kural {
    max-width: 1180px;
    margin: 14px auto 0;
    padding-top: 12px;
    border-top: 1px dashed rgba(226, 205, 150, .2);
    font-size: 12px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .6);
    text-align: center;
}

@media (max-width: 600px) {
    .mk-bs-ust {
        gap: 6px 12px;
        font-size: 12.5px;
    }

    .mk-bs-not {
        display: none;
    }

    .mk-bs-detay {
        padding: 14px;
    }
}

/* ==========================================================================
   B2B KATALOĞU — üst sınır, asgari sepet, katalog dışı uyarı
   ========================================================================== */

.mk-b2b-sinir {
    width: 100%;
    margin: 14px 0 4px;
    padding: 13px 16px;
    background: rgba(18, 49, 51, .05);
    border: 1px dashed rgba(18, 49, 51, .28);
    border-radius: 9px;
}

.mk-bsn-ust {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 7px;
}

.mk-bsn-etiket {
    font-size: 12.5px;
    color: #6f6f6f;
}

.mk-bsn-ust strong {
    font-size: 19px;
    font-weight: 700;
    color: var(--mk-petrol, #123133);
}

.mk-bsn-birim {
    font-size: 13px;
    color: #6f6f6f;
}

.mk-bsn-detay {
    margin: 5px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: #7a7a7a;
}

.mk-bsn-link {
    display: inline-block;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mk-petrol, #123133) !important;
    text-decoration: underline !important;
    text-decoration-color: var(--mk-altin, #C0A071) !important;
    text-underline-offset: 3px;
}

/* ---- Katalog dışı ürün ---- */

.mk-b2b-kapali {
    margin: 16px 0;
    padding: 18px 20px;
    background: var(--mk-bordo, #351D2A);
    border-radius: 10px;
    color: var(--mk-altin-acik, #E2CD96);
}

.mk-b2b-kapali strong {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
    color: #fff;
}

.mk-b2b-kapali p {
    margin: 0 0 12px;
    font-size: 13.5px;
    line-height: 1.55;
    color: rgba(255, 255, 255, .78);
}

/* ---- Asgari sepet tutarı ---- */

.mk-b2b-asgari {
    margin: 0 0 22px;
    padding: 15px 18px;
    background: #fff;
    border: 1px solid var(--mk-altin, #C0A071);
    border-radius: 10px;
}

.mk-b2b-asgari.mk-tamam {
    border-color: #1f6b33;
    background: rgba(31, 107, 51, .05);
}

.mk-ba-yazi strong {
    display: block;
    font-size: 15px;
    color: var(--mk-petrol, #123133);
}

.mk-b2b-asgari.mk-tamam .mk-ba-yazi strong {
    color: #1f6b33;
}

.mk-ba-yazi span {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    color: #7a7a7a;
}

.mk-ba-cubuk {
    height: 7px;
    margin-top: 11px;
    background: rgba(18, 49, 51, .1);
    border-radius: 4px;
    overflow: hidden;
}

.mk-ba-cubuk span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--mk-altin, #C0A071), var(--mk-altin-acik, #E2CD96));
    border-radius: 4px;
    transition: width .35s ease;
}

.mk-b2b-asgari.mk-tamam .mk-ba-cubuk span {
    background: #1f6b33;
}

/* ---- Yönetim: toptan fiyat tablosu ---- */

.mk-toptan-tablo td,
.mk-toptan-tablo th {
    font-size: 13px;
    vertical-align: middle;
}

.mk-toptan-tablo thead th {
    background: #f6f7f7;
}

/* WhatsApp iletişim düğmesi — üst sınır kutusu */
.mk-bsn-wa {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 9px 16px;
    border-radius: 8px;
    background: #25D366;
    color: #0b3d1f !important;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none !important;
    transition: background-color .18s ease, transform .12s ease;
}

.mk-bsn-wa:hover {
    background: #1fb757;
    color: #08301a !important;
}

.mk-bsn-wa:active {
    transform: translateY(1px);
}

.mk-bsn-wa svg {
    width: 18px;
    height: 18px;
    flex: none;
}

/* ==========================================================================
   HAVALE / EFT DEKONTU
   ========================================================================== */

.mk-dekont {
    margin: 26px 0;
    padding: 20px 22px;
    background: #fff;
    border: 1px solid var(--mk-cizgi, #e4e4e4);
    border-radius: 10px;
}

.mk-dekont > h2 {
    margin: 0 0 12px;
    font-size: 18px;
    color: var(--mk-petrol, #123133);
}

.mk-dekont-var {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    margin-bottom: 14px;
    background: rgba(31, 107, 51, .06);
    border: 1px solid rgba(31, 107, 51, .25);
    border-radius: 8px;
}

.mk-dekont-ikon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #1f6b33;
    color: #fff;
}

.mk-dekont-ikon svg {
    width: 17px;
    height: 17px;
}

.mk-dekont-var strong {
    display: block;
    color: #1f6b33;
    font-size: 14.5px;
}

.mk-dekont-var span {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    color: #5a5a5a;
    line-height: 1.5;
}

.mk-dekont-var a {
    display: inline-block;
    margin-top: 6px;
    font-size: 13px;
    font-weight: 600;
}

.mk-dekont-aciklama {
    margin: 0 0 12px;
    font-size: 13.5px;
    line-height: 1.6;
    color: #6a6a6a;
}

.mk-dekont-satir {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.mk-dekont-satir input[type="file"] {
    flex: 1;
    min-width: 220px;
    padding: 9px 12px;
    border: 1px dashed var(--mk-altin, #C0A071);
    border-radius: 8px;
    background: rgba(192, 160, 113, .06);
    font-size: 13.5px;
}

.mk-dekont-satir .button {
    background: var(--mk-petrol, #123133) !important;
    color: #fff !important;
    border-color: var(--mk-petrol, #123133) !important;
}

.mk-dekont-uyari {
    margin: 0 0 12px;
    padding: 11px 15px;
    background: #fdf0f0;
    border-left: 3px solid #b32d2e;
    border-radius: 4px;
    font-size: 13.5px;
    color: #8c2b2b;
}

/* ==========================================================================
   ÜRÜN KARTI GÖRSELİ
   Fotoğrafların oranı ürüne göre değişiyor (yatay, dikey, kare). Görsel
   alanını sabit kareye oturtup içine sığdırıyoruz: hiçbir ürün kırpılmıyor,
   ızgara da düzgün hizada kalıyor.
   ========================================================================== */

/* Görsel alanı KARE, ama kareyi <img>'in kendisi taşıyor.

   NEDEN SARICIYA DEĞİL — tema, birden fazla galeri görseli olan üründe
   araya iki sarıcı koyuyor:
     .product-image-link > .wd-product-grid-slider > .wd-product-grid-slide > img
   Sarıcıya aspect-ratio + img'e height:100% verince yüzde yükseklik bu
   zincirde çözülemiyor ve kutu 0x0'a çöküyordu; kart bomboş görünüyor,
   üstelik sıfır boyutlu kutu ekranda "görünmediği" için lazy-load da hiç
   tetiklenmiyordu. Kareyi doğrudan img'e vermek her iç içe yapıda çalışıyor.

   width/height AUTO da yazılmaz: tema <img>'e width="600" height="271"
   basıyor, auto bunları ezip yükleme öncesi kutuyu sıfırlıyor. */

.product-image-link,
.wd-product .product-image-link {
    display: block;
    background: #fff;
}

.product-image-link img,
.wd-product .product-image-link img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: contain !important;
    object-position: center;
    display: block;
}

/* Ürün sayfasındaki büyük görsel de kırpılmasın. */
.single-product .woocommerce-product-gallery__image img,
.single-product .wd-carousel-item img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Küçük galeri kareleri hizada dursun. */
.single-product .wd-gallery-thumb img,
.single-product .flex-control-thumbs img {
    aspect-ratio: 1 / 1;
    object-fit: contain;
    background: #fff;
}

/* ==========================================================================
   ALT İMZA
   ========================================================================== */

.mk-alt-imza {
    padding: 14px 20px;
    background: var(--mk-petrol-koyu, #0d2426);
    color: rgba(226, 205, 150, .62);
    font-size: 12.5px;
    letter-spacing: .02em;
    text-align: center;
}

.mk-alt-imza a {
    color: var(--mk-altin-acik, #E2CD96) !important;
    font-weight: 600;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(226, 205, 150, .35);
    padding-bottom: 1px;
    transition: color .18s ease, border-color .18s ease;
}

.mk-alt-imza a:hover,
.mk-alt-imza a:focus {
    color: #fff !important;
    border-bottom-color: #fff;
}

/* --------------------------------------------------------------------------
   HUUB etiketi — kırmızı "öne çıkan" etiketinin metni
   Ayrı bir rozet basmak yerine temanın kendi etiketinin yazısını
   değiştiriyoruz; kartta tek etiket kalıyor.
   -------------------------------------------------------------------------- */

.mk-huub-urun .product-label.featured {
    font-size: 0 !important;
    letter-spacing: 0;
}

.mk-huub-urun .product-label.featured::after {
    content: "HUUB";
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
}

/* ================================================================
   MOBİL — ANASAYFA ÜRÜN IZGARALARI İKİ SÜTUN

   SORUN — 375 px'lik ekranda "Çok Satanlar" düzgün görünürken HUUB
   Home Collection ve altındaki bütün bölümler tek sütuna düşüp
   kartları devleştiriyordu (kart 309–345 px, görsel 285–325 px).

   SEBEP — Yukarıdaki ızgara kuralı:

       .mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products)
       { grid-template-columns: repeat(auto-fit, minmax(200px,1fr)) !important }

   :not() içine BİLEŞİK bir seçici (.mk-serit .wd-products) yazıldığı
   için özgüllük 0,4,0'a şişiyor. Sonradan yazılan mobil kurallar
   (.mk-huub-vitrin .wd-products = 0,2,0) !important taşımasına
   rağmen bunu geçemiyordu. Mobilde 200 px'lik iki sütun 309 px'lik
   kaba sığmadığı için auto-fit tek sütuna çöküyordu — hesaplanan
   309.2px / 345.2px değerleri tam olarak kabın kendi genişliğiydi.

   "Çok Satanlar" etkilenmiyordu çünkü o .mk-serit içinde yatay
   kayan bir şerit; :not() onu zaten dışarıda bırakıyor.

   ÇÖZÜM — Aynı seçici şekli, başına body eklenip özgüllük 0,4,1'e
   çıkarılıyor ve dosyanın en sonuna konuyor. Böylece hem özgüllük
   hem kaynak sırası bakımından kesin kazanıyor. Şerit bölümlerine
   dokunulmuyor.
   ================================================================ */
@media (max-width: 768px) {
    body .mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products),
    body .mk-anasayfa-bolum .products:not(.mk-serit .products) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
    }

    body .mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products) > .product,
    body .mk-anasayfa-bolum .products:not(.mk-serit .products) > .product {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Dar sütunda ürün adı ve fiyat taşmasın. */
    body .mk-anasayfa-bolum .wd-products:not(.mk-serit .wd-products) .wd-entities-title {
        font-size: 12px !important;
        line-height: 1.35 !important;
    }
}

/* ================================================================
   SEPET / ÖDEME ADIM ÇUBUĞU

   WoodMart bu şeridi kendi varsayılan mavisiyle (#1c61e7) basıyordu.
   Site paletine çekiliyor: zemin petrol yeşili, yazılar altın.

   Bu başlık çubuğu YALNIZCA sepet, ödeme ve sipariş-alındı
   sayfalarında çıkıyor (diğer sayfalarda .wd-page-title hiç
   basılmıyor), o yüzden genel bir kural güvenli.

   Adım numaraları CSS sayacıyla üretiliyor; tema kendi numarasını
   basmıyordu, sıra algısı bu yüzden zayıftı.
   ================================================================ */
.wd-page-title.page-title {
    background-color: var(--mk-petrol) !important;
    background-image: linear-gradient( 135deg, #123133 0%, #1a4245 55%, #123133 100% ) !important;
    border-bottom: 3px solid var(--mk-altin);
    padding-top: 22px !important;
    padding-bottom: 22px !important;
}

.wd-checkout-steps {
    counter-reset: mkadim;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 28px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wd-checkout-steps li {
    counter-increment: mkadim;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: .2px;
    line-height: 1.2;
}

/* Adım numarası — daire */
.wd-checkout-steps li::before {
    content: counter(mkadim);
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
    border: 1.5px solid rgba(226, 205, 150, .45);
    color: rgba(226, 205, 150, .75);
    background: transparent;
    transition: all .18s ease;
}

/* Adımlar arası ayraç */
.wd-checkout-steps li + li::after {
    content: "";
    order: -1;
    width: 26px;
    height: 1px;
    margin-right: 18px;
    background: rgba(226, 205, 150, .3);
}

/* Pasif adım */
.wd-checkout-steps li.step-inactive,
.wd-checkout-steps li.step-inactive a,
.wd-checkout-steps li.step-inactive span {
    color: rgba(226, 205, 150, .6) !important;
}

/* Etkin adım — dolu altın daire, açık altın yazı */
.wd-checkout-steps li.step-active,
.wd-checkout-steps li.step-active a,
.wd-checkout-steps li.step-active span {
    color: var(--mk-altin-acik) !important;
}
.wd-checkout-steps li.step-active::before {
    background: var(--mk-altin);
    border-color: var(--mk-altin);
    color: var(--mk-petrol);
    box-shadow: 0 0 0 4px rgba(192, 160, 113, .18);
}

.wd-checkout-steps li a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color .18s ease;
}
.wd-checkout-steps li a:hover { color: var(--mk-altin-acik) !important; }
.wd-checkout-steps li.step-inactive a:hover::before {
    border-color: var(--mk-altin);
    color: var(--mk-altin);
}

@media (max-width: 768px) {
    .wd-page-title.page-title { padding-top: 14px !important; padding-bottom: 14px !important; }
    .wd-checkout-steps { gap: 6px 14px; }

    /* WoodMart mobilde pasif adımları display:none yapıyor; şerit tek
       adıma düşüp ilerleme göstergesi olmaktan çıkıyordu. Üçü de
       gösteriliyor — 375 px'de tek satıra sığdığı ölçülerek ayarlandı. */
    .wd-checkout-steps li { display: flex !important; font-size: 11px !important; gap: 5px; }
    .wd-checkout-steps li::before { width: 19px; height: 19px; font-size: 10px; }

    /* Ayraç kaldırılıyor: dar ekranda hem yer yemiyor hem de gizli
       adım kalmadığı için boşta çizgi bırakma riski kalkıyor. */
    .wd-checkout-steps li + li::after { display: none !important; }
}

/* ================================================================
   ÖDEME — HESAP OLUŞTURMA ALANI

   Blok ödemedeki "Parola (tekrar)" alanı WooCommerce'in kendi
   metin kutusu görünümünü kullanıyor; buradaki kurallar yalnızca
   eşleşme geri bildirimini ve altın vurguyu ekliyor.
   ================================================================ */
.mk-parola-tekrar-sarmal { margin-top: 12px; }

.mk-parola-tekrar-sarmal.mk-parola-tamam input {
    border-color: #2e7d5b !important;
    box-shadow: 0 0 0 1px #2e7d5b inset;
}
.mk-parola-tekrar-sarmal.mk-parola-hata input {
    border-color: #b3261e !important;
    box-shadow: 0 0 0 1px #b3261e inset;
}

.mk-parola-not {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.4;
    min-height: 1px;
}
.mk-parola-not.mk-hata  { color: #b3261e; font-weight: 600; }
.mk-parola-not.mk-tamam { color: #2e7d5b; font-weight: 600; }

/* Hesap oluşturma kutucuğunu görünür kıl — sıradan bir satır gibi
   durup gözden kaçıyordu. */
.wc-block-checkout__create-account {
    background: #fbf8f2;
    border: 1px solid var(--mk-altin);
    border-radius: 10px;
    padding: 14px 16px;
    margin-top: 14px;
}
.wc-block-checkout__create-account label { font-weight: 600; }