/* ==========================================================================
   Proje özel stil düzeltmeleri — style.min.css'ten SONRA yüklenir.
   Tema dosyalarına (style.min.css / essential.css) dokunulmaz; ezmeler burada.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Sayfa banner'ı (.page-banner)

   Tema CSS'inde .page-banner'ın kendi yüksekliği YOKTUR; yalnızca
   .page-banner.article (500-600px) ve .banner-basket (400-450px, >=1360px)
   varyantlarında yükseklik tanımlıdır. Bunun sonucu:

     - background-image ile kullanılan banner'lar (ör. ürün detay) 0px yükseklik
       alıp hiç görünmüyordu,
     - <img> ile kullanılanlar (ör. ürün listesi) görselin doğal en-boy oranıyla
       geriliyordu: bg-products.jpg 1300x339 iken 1600px genişlikte upscale
       oluyor, altında ölçüsüz beyaz alan bırakıyordu.

   Referans temanın script.js dosyasında yoruma alınmış olan
   "banner_height = header_height * 2.5" (154 * 2.5 ≈ 385px) hesabının kalıcı
   CSS karşılığı aşağıdadır. .article / .banner-basket varyantları hariç
   tutulur ki kendi yükseklikleri geçerli kalsın.
   -------------------------------------------------------------------------- */

.page-banner:not(.article):not(.banner-basket) {
    height: 385px;
}

/* <img> ile gelen banner'lar: mutlak konumlanıp alanı "cover" ile doldurur.
   Böylece görsel gerilmez/kırpılarak sığar ve üstündeki .page-title / nav
   içerikleri (haber detayı vb.) görselin üzerinde kalır. */
.page-banner > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.page-banner > .page-title,
.page-banner > nav {
    position: relative;
    z-index: 2;
}

/* --------------------------------------------------------------------------
   Ürün listesi marka bandı (.product-page.brand-list)

   Tema CSS'i yalnızca logolu (<img>) varyantı stillendiriyor. Markaların logosu
   yüklenmemişse referans tasarımdaki gibi marka ADI basılır; isim tek satırda
   kalsın (aksi hâlde dar slaytta iki satıra kırılıp swiper'ın yüksekliğini
   bozuyor) ve link rengini alsın.
   -------------------------------------------------------------------------- */

.product-page.brand-list .swiper-slide {
    width: auto;
}

/* Hover'da renk/kalınlık DEĞİŞMEZ: font-weight değişimi metni genişletip
   yanındaki markaları kaydırıyordu. Yalnızca seçili marka (.active) vurgulanır
   ve o da kalınlık yerine alt çizgiyle işaretlenir — genişlik sabit kalır. */
.product-page.brand-list .brand-item .name,
.product-page.brand-list .brand-item a:hover .name,
.product-page.brand-list .brand-item a:focus .name {
    white-space: nowrap;
    color: #139eef;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 400;
    text-decoration: none;
}

.product-page.brand-list .brand-item .name.active {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Anasayfa marka bandında logosu olan ve olmayan markalar yan yana gelebilir.
   Tema `justify-content: center` kullandığı için logosuz markanın adı slaytın
   ortasına, logolu markanınki logonun altına düşüyor ve isimler hizasız kalıyordu.
   İsimler alt kenara hizalanır. */
.home-page.brand-list .swiper-slide.brand-item {
    /* autoHeight modunda slaytlar kendi yükseklikleri kadardır; logosuz slayt
       kısa kalıp satırın üstüne yapışıyordu. Satır yüksekliğine gerilir. */
    align-self: stretch;
    height: auto;
    justify-content: flex-end;
    /* slidesPerView:'auto' — slayt içeriği kadar yer kaplar. Genişlik 103px'e
       kilitlenir (min = max): marka sayısı değişse de slaytlar aynı ölçüde
       kalır, logoların en/boy oranı farkı hizayı bozmaz. */
    width: 103px;
    min-width: 103px;
    max-width: 103px;
}

/* Logo yüksekliği band içinde sabitlenir: aksi hâlde geniş logolar (MERCEDES)
   dar olanların (DAF) iki katı yer kaplayıp hizayı bozuyor. */
.home-page.brand-list .brand-item img {
    max-height: 100px;
    max-width: 100%;
    width: auto;
}

.home-page.brand-list .brand-item > a {
    justify-content: flex-end;
    flex: 1 1 auto;
}

/* Kurumsal (hakkımızda) banner'ı.

   Tema CSS'i .page-banner.about-us-image için sabit negatif offset uygular
   (>=1360px: "top -438px left 0", >=1601px: "top -704px left 0"). Bu değerler
   referans sitedeki ÇOK UZUN hakkımızda görseline göre elle ayarlanmıştı;
   normal ölçülerdeki bir görselde resim tamamen yukarı kayıyor ve banner'ın
   altında kocaman beyaz alan kalıyordu. Diğer banner'larla aynı davranışa
   (cover + ortalı) çekiliyor. */
.page-banner.about-us-image {
    background-position: center center !important;
}

@media screen and (max-width: 1199px) {
    .page-banner:not(.article):not(.banner-basket) {
        height: 300px;
    }
}

@media screen and (max-width: 767px) {
    .page-banner:not(.article):not(.banner-basket) {
        height: 200px;
    }

    .page-banner.article {
        height: 260px;
    }

    .page-banner-with-breadcrumb {
        padding-top: 0;
    }
}

@media screen and (max-width: 575px) {
    .page-banner:not(.article):not(.banner-basket) {
        height: 160px;
    }

    .page-banner.article {
        height: 200px;
    }
}

/* Header e-posta: ikon-metin boşluğu markup boşluğundan değil margin'den gelir. */
.header-phone a i {
  margin-right: 6px; }
