/* ═══════════════════════════════════════════════════════════
   Unimart köprüsü — görünümü DEĞİŞTİRMEZ

   Unimart'ın style.min.css'i olduğu gibi duruyor. Bu dosya ondan
   sonra yüklenir ve yalnızca iki şey yapar:

   1. Panelde seçilen renkleri Unimart değişkenlerine bağlar.
      Tema varsayılanları Unimart'ın kendi değerleri olduğu için
      kiracı renk değiştirmedikçe görünüm birebir aynıdır.

   2. Vitrin kabuğunun (storefront.css) genel kurallarını nötrler.
   ═══════════════════════════════════════════════════════════ */

:root {
  --color-primary:   var(--primary, #215ADA);
  --color-secondary: var(--accent, #FF4C1A);
}

/* Modül stil sarmalayıcısı düzen kutusu olmasın */
.module-scope { display: contents; }

/* storefront.css [data-error]'u hep gizliyor; hata kutuları
   görünürlüğü hidden özniteliğiyle yönetiliyor */
[data-error]:not([hidden]) { display: block; }

/* Sunucu HTML'inde hidden özniteliği her zaman kazansın */
[hidden] { display: none !important; }

/* Unimart'ın "Karşılaştırmaya / favorilere eklendi" bildirimleri şablonda
   sürekli görünüyor (orijinal demoda da). Yalnızca main.js tetiklediğinde
   (is-visible) görünsün. */
.rbt-toaster:not(.is-visible) { display: none; }

/* ── Gerçek mağaza verisi (demo'dan uzun/dik içerik) ───────── */

/* Menü ve kayan kategori şeridi: uzun kategori adları alt alta
   kırılıp şeridi/menüyü bozmasın */
.mainmenu > li > a,
.rbt-category-list a { white-space: nowrap; }

/* Kategori mega menüsü: kategori görseli dik/büyük olabiliyor;
   demo görseli gibi sabit yükseklikte kırpılsın */
.rbt-megamenu .rbt-menu-offer-card .product-img { display: block; width: 100%; }
.rbt-megamenu .rbt-menu-offer-card .product-img img {
  width: 100%; height: 200px; object-fit: cover; object-position: center;
  border-radius: var(--radius-md, 8px);
}
.rbt-megamenu .mega-menu-item li a { white-space: normal; }

/* "Diğer" açılır menüsü: çok kategori olursa kaydırılsın */
.mainmenu .has-dropdown > .submenu { max-height: 70vh; overflow-y: auto; }
.rbt-megamenu .rbt-short-title a { color: inherit; }

/* header-9 (Mobilya/Gıda): logo + "Kategoriler" + menü + ikonlar tek
   satır. Dar masaüstünde uzun kategori adları ikonları ekran dışına
   itiyor; "Kategoriler" açılır menüsü bütün kategorileri zaten
   listelediği için burada Ana Sayfa ve 3.-4. kategori gizlenir. */
@media (max-width: 1599px) {
  .rbt-header-content .mainmenu > li.u-menu-home,
  .rbt-header-content .mainmenu > li.u-menu-cat:nth-child(n+4) { display: none; }
}
@media (max-width: 1399px) {
  .rbt-header-content .mainmenu > li > a { padding: 0 7px; font-size: 15px; }
}

/* Logo yerine uzun mağaza adı "Kategoriler" düğmesini sağa itiyor;
   gizli alt panel (734px) sayfaya yatay kaydırma ekliyordu */
@media (max-width: 1399px) {
  header .rbt-dropdown-child-wrapper-lg { min-width: 620px; width: 620px; }
}
html, body { overflow-x: clip; }

/* style.min.css body'ye overflow-y:scroll veriyor; html'in overflow-x'i
   visible olmadığından bu viewport'a geçmiyor, body kaydırmayan bir
   scroll kabı oluyor ve içindeki position:sticky'ler (ürün galerisi,
   filtre kenar çubuğu) hiç yapışmıyordu. Kalıcı kaydırma çubuğu html'de. */
html { overflow-y: scroll; }
body { overflow-y: visible; }

/* ── Kart hizası (gerçek ürün verisi) ─────────────────────────
   Demo görselleri aynı orandaydı; gerçek ürün fotoğrafları farklı
   oranlarda geldiği için aynı satırdaki kartlar farklı boyda
   kalıyordu. Görsel alanı modüldeki en sık orana sabitlenir
   (oran unimart-app.js'ten --u-card-ratio olarak gelir), başlık
   iki satıra sabitlenir. Yalnızca dikey kartlar: yatay kartlarda
   (sınıfında list-view geçenler — ürün detayındaki alternatifler,
   mağaza liste görünümü) görsel küçük ve yan yana kalmalı. */
[data-card-ratio] .rbt-product-card:not([class*="list-view"]) .rbt-card-img img {
  width: 100%;
  height: auto;
  aspect-ratio: var(--u-card-ratio);
  object-fit: cover;
}
.rbt-product-card:not([class*="list-view"]) .rbt-card-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 2lh;
}
/* Aynı satırdaki kartlar eşit boyda; fiyat satırı kırılsa da
   (indirimli ürün) butonlar kartın altında hizalı kalır */
.swiper-slide:has(> .rbt-product-card:not([class*="list-view"])),
[class*="col"]:has(> .rbt-product-card:not([class*="list-view"])) {
  display: flex;
  height: auto;
}
.swiper-slide > .rbt-product-card:not([class*="list-view"]),
[class*="col"] > .rbt-product-card:not([class*="list-view"]) {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.rbt-product-card:not([class*="list-view"]) > .inner {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.rbt-product-card:not([class*="list-view"]) .rbt-card-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.rbt-product-card:not([class*="list-view"]) .rbt-card-body > .pricing-part + *,
.rbt-product-card:not([class*="list-view"]) .rbt-card-body > .rbt-card-footer {
  margin-top: auto;
}

/* Mağaza sayfası kampanya afişi: altındaki kategori şeridi yapışıyordu
   (style.min.css .mega-top-banner{margin:0}) */
.mega-top-banner.bg-three { margin-bottom: 32px; }
@media (max-width: 767px) { .mega-top-banner.bg-three { margin-bottom: 20px; } }

/* Mobil menü altı: mağaza sosyal hesap / iletişim girmemişse boş başlık
   ve boş satır kalmasın */
.mobile-menu-bottom .social-share-wrapper:not(:has(li)),
.mobile-menu-bottom .rbt-information-list:not(:has(li)) { display: none; }

/* Açılış ekranı logosu (header ayarı splash_logo): hafif nabız */
.rbt-preloader .u-splash-logo { display: block; margin: 0 auto 1.5em; animation: uSplashPulse 1.6s ease-in-out infinite; }
@keyframes uSplashPulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .55; transform: scale(.96); } }

/* ── Kategori mega menüsü ─────────────────────────────────────
   Az alt kategoride sol sütun kısa kalıp kargo etiketi ortada
   asılı duruyordu: sol sütun banner boyunda, etiket dipte;
   alt kategoriler satır, altında "Tüm X ürünleri". */
.rbt-megamenu.grid-item-2 .u-mega-left { display: flex; flex-direction: column; }
.rbt-megamenu.grid-item-2 .u-mega-left > .rbt-quick-info-tag { margin-top: auto !important; }
.rbt-megamenu.grid-item-2 .mega-menu-item li { margin: 0; }
.rbt-megamenu.grid-item-2 .mega-menu-item li a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 9px 12px; border-radius: 8px;
  transition: background-color .15s ease, color .15s ease;
}
.rbt-megamenu.grid-item-2 .mega-menu-item li a::after {
  content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 10px;
  opacity: 0; transform: translateX(-4px); transition: opacity .15s ease, transform .15s ease;
}
.rbt-megamenu.grid-item-2 .mega-menu-item li a:hover { background: var(--color-gray-light, #f4f5f7); color: var(--primary); }
.rbt-megamenu.grid-item-2 .mega-menu-item li a:hover::after { opacity: 1; transform: none; }
.rbt-megamenu.grid-item-2 .u-mega-all {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  margin: 14px 0 0 12px; font-weight: 600; color: var(--primary);
}
.rbt-megamenu.grid-item-2 .u-mega-all i { font-size: 12px; transition: transform .15s ease; }
.rbt-megamenu.grid-item-2 .u-mega-all:hover i { transform: translateX(3px); }

/* Alt kategori satırı: görsel + ad + ürün sayısı. Sütunda 6'dan fazla
   kategori varsa görseller gizlenir, menü uzamasın. */
.rbt-megamenu.grid-item-2 .mega-menu-item li a { justify-content: flex-start; }
.rbt-megamenu.grid-item-2 .mega-menu-item li a::after { margin-left: auto; }
.rbt-megamenu.grid-item-2 .u-mega-thumb {
  flex: none; width: 44px; height: 44px; border-radius: 8px; overflow: hidden;
  background: var(--color-gray-light, #f4f5f7); display: flex; align-items: center; justify-content: center;
}
.rbt-megamenu.grid-item-2 .u-mega-thumb img { width: 100%; height: 100%; object-fit: contain; }
.rbt-megamenu.grid-item-2 .u-mega-name { display: flex; flex-direction: column; line-height: 1.3; }
.rbt-megamenu.grid-item-2 .u-mega-name small { font-size: 12px; color: var(--color-body, #737373); font-weight: 400; }
.rbt-megamenu.grid-item-2 .mega-menu-item:has(> li:nth-child(7)) .u-mega-thumb,
.rbt-megamenu.grid-item-2 .mega-menu-item:has(> li:nth-child(7)) .u-mega-name small { display: none; }

/* Mobil alt araç çubuğu: Unimart'ta sayfanın sonunda, bizde header'la
   birlikte başta çiziliyor. position:sticky akışta yer tuttuğu için
   header ile breadcrumb arasında 55px boşluk bırakıyordu. Ekrana
   sabitlenir; görünürken en alttaki içerik arkasında kalmasın. */
.rbt-toolbar { position: fixed; left: 0; right: 0; bottom: 0; }
body:has(.rbt-toolbar.visible) { padding-bottom: 55px; }

/* ── Kart varyant özeti ─────────────────────────────────────
   Kart şablonları başlığın altına basar ("5 seçenek");
   unimart-app.js eksen adlarıyla yazar ("3 renk · 4 beden"). */
.u-card-variants {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-gray-500, #6b7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Sepet satırı varyant etiketi ──────────────────────────
   unimart-header.js doldurur ("Renk: Kırmızı · Beden: L"). */
.u-cart-variant {
    display: block;
    margin: 2px 0 4px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--color-gray-500, #6b7280);
}
.u-cart-variant[hidden],
[data-cart-variant][hidden] { display: none; }