/* =====================================================================
   MOTORCU DAYI — Marka Tasarım Katmanı (marka-motorcudayi.css)
   ---------------------------------------------------------------------
   Yükleme sırası:
     ui.css  ->  motorcudayi.css  ->  [BU DOSYA]  ->  inline <style>
                                                      (admin marka rengi)
   Neden bu sırada?
     - Bu dosya yalnızca BİÇİM değiştirir (şekil, gradient, aksan, hover).
     - Renk tokenları (--ac-orange*, --sm-accent) inline blokta basıldığı
       için Admin Panel > Tema Yönetimi'nden yönetilmeye DEVAM eder.
     - Böylece 15 ayrı domainde aynı sistem + farklı görünüm elde edilir:
       tek yapılacak iş bu dosyanın kopyasını oluşturup temaheader.php
       içindeki tek <link> satırını değiştirmektir.

   Marka: MOTORCU DAYI  (varsayılan ana renk: #d81f26)
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) ŞEKİL DİLİ
   Taban tema yumuşak (14px) köşeler kullanır; Motorcu Dayı daha
   "tezgâh/garaj" hissi veren daha keskin köşelerle ayrışır.
   (--sm-radius admin tarafından basılır, ona dokunulmuyor.)
   --------------------------------------------------------------------- */
body.sibertema{
  --ac-r:10px;
  --ac-r-sm:8px;
  --ac-r-lg:14px;
  --ac-sh:0 1px 2px rgba(16,24,40,.05), 0 6px 16px rgba(16,24,40,.07);
  --ac-sh-h:0 12px 30px rgba(16,24,40,.14);
}

/* ---------------------------------------------------------------------
   2) DUYURU BANDI — üstte marka şeridi + derinlik
   --------------------------------------------------------------------- */
.ac-topbar{
  border-top:3px solid var(--ac-orange);
  background:linear-gradient(90deg, #0f1216 0%, #191d24 48%, #23272f 100%);
}
.ac-topbar-inner{ min-height:40px; }
.ac-topbar-item{ letter-spacing:.015em; }

/* ---------------------------------------------------------------------
   3) HEADER — marka tonlu alt çizgi, marka gölgesi
   --------------------------------------------------------------------- */
.ac-header{
  border-bottom:2px solid var(--ac-orange-border);
}
.ac-header.is-stuck{
  box-shadow:0 6px 20px rgba(var(--ac-orange-rgb), .14);
}
.ac-header-inner{ min-height:82px; }

/* Logo: ad büyük harf, alt satır marka renginde */
.ac-logo-name{
  text-transform:uppercase;
  letter-spacing:.005em;
}
.ac-logo-sub{
  color:var(--ac-brand-text);
  letter-spacing:.26em;
  font-weight:700;
}

/* ---------------------------------------------------------------------
   4) ARAMA — kapsül (pill) form
   --------------------------------------------------------------------- */
.ac-search{
  border-radius:999px;
  max-width:660px;
}
.ac-search-cat select{ padding-left:20px; }
.ac-search input[type="text"]{ padding:14px 14px; }
.ac-search-btn{ width:62px; }
.ac-search:focus-within{
  box-shadow:0 0 0 4px rgba(var(--ac-orange-rgb), .15);
}

/* ---------------------------------------------------------------------
   5) SAĞ AKSİYONLAR — kapsül hover, köşeli sepet sayacı
   --------------------------------------------------------------------- */
.ac-act{ border-radius:999px; }
.ac-act-stack{ border-radius:12px; }
.ac-cart-badge{
  border-radius:6px;
  box-shadow:0 2px 6px rgba(var(--ac-orange-rgb), .40);
}
.ac-cart-sum{ font-weight:800; }

/* ---------------------------------------------------------------------
   6) ANA MENÜ — kapsül "Tüm Kategoriler", yumuşak hover zemini
   --------------------------------------------------------------------- */
.ac-allcats{
  border-radius:999px;
  background:linear-gradient(180deg, var(--ac-orange-2) 0%, var(--ac-orange) 100%);
  box-shadow:0 4px 12px rgba(var(--ac-orange-rgb), .28);
}
.ac-allcats:hover{
  background:linear-gradient(180deg, var(--ac-orange) 0%, var(--ac-orange-d) 100%);
}
.ac-nav-link{
  padding:16px 14px;
  border-radius:8px 8px 0 0;
}
.ac-nav-link:hover,
.ac-nav-item:hover > .ac-nav-link{
  background:var(--ac-orange-soft);
}

/* ---------------------------------------------------------------------
   7) BUTONLAR — hafif gradient + kalkma efekti
   --------------------------------------------------------------------- */
.ac-btn{
  background:linear-gradient(180deg, var(--ac-orange-2) 0%, var(--ac-orange) 100%);
  box-shadow:0 2px 8px rgba(var(--ac-orange-rgb), .22);
}
.ac-btn:hover{
  background:linear-gradient(180deg, var(--ac-orange) 0%, var(--ac-orange-d) 100%);
  transform:translateY(-1px);
}
.ac-btn-ghost{ background:#fff; }
.ac-btn-ghost:hover{ transform:translateY(-1px); }

/* ---------------------------------------------------------------------
   8) BÖLÜM BAŞLIKLARI — sol marka çubuğu
   --------------------------------------------------------------------- */
.ac-sec-title,
.ac-col-title,
.ac-finder-title{
  position:relative;
  padding-left:13px;
}
.ac-sec-title::before,
.ac-col-title::before,
.ac-finder-title::before{
  content:"";
  position:absolute; left:0; top:50%;
  transform:translateY(-50%);
  width:4px; height:1em;
  border-radius:2px;
  background:var(--ac-orange);
}

/* ---------------------------------------------------------------------
   9) KATEGORİ KARTLARI — marka tonlu görsel zemini
   --------------------------------------------------------------------- */
.ac-cat-media,
.ac-cat-media.is-empty{ background:var(--ac-orange-soft); }
.ac-cat:hover{ transform:translateY(-2px); }
.ac-cat-name{ letter-spacing:.03em; }

/* ---------------------------------------------------------------------
   10) ROZETLER / PARÇA BULUCU — sol ve üst marka aksanı
   --------------------------------------------------------------------- */
.ac-badge{
  border-radius:10px;
  border-left:3px solid var(--ac-orange);
}
.ac-finder{
  border-top:3px solid var(--ac-orange);
}

/* ---------------------------------------------------------------------
   11) ÜRÜN KARTLARI (ui.css) — kalkma + marka kenarlığı
   --------------------------------------------------------------------- */
body.sibertema .sm-product-card{
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
body.sibertema .sm-product-card:hover{
  border-color:var(--ac-orange) !important;
  box-shadow:var(--ac-sh-h);
  transform:translateY(-2px);
}

/* ---------------------------------------------------------------------
   12) FOOTER — üstte marka şeridi
   --------------------------------------------------------------------- */
.ac-footer{ border-top:3px solid var(--ac-orange); }

/* ---------------------------------------------------------------------
   13) MOBİL
   --------------------------------------------------------------------- */
@media (max-width:900px){
  .ac-search{ border-radius:var(--ac-r-sm); }
  .ac-header-inner{ min-height:64px; }
}
