/*
Theme Name:   ILAV Child (Bookory)
Theme URI:    https://demo2.pavothemes.com/bookory/
Description:  İLAV — İlahiyat Vakfı Ankara için Bookory child teması. Altın + siyah + zarif serif kimliği. Tüm özelleştirmeler güncellemeye dayanıklı biçimde burada.
Author:       ACNAR
Template:     bookory
Version:      1.1.0
License:      GNU General Public License v2 or later
Text Domain:  bookory-child
*/

/* ============================================================
   İLAV MARKA SKİNİ
   ------------------------------------------------------------
   Parent tema bu dosyayı OTOMATİK yükler (class-main.php ->
   child_scripts(), priority 30), bu yüzden parent stilini ve
   Elementor'ün body{} renk enjeksiyonunu EZER.

   Renk için en temiz yol yine de:
     Elementor > Site Settings > Global Colors
   (aşağıdaki değerleri oraya da girin). Ama girmeseniz bile bu
   dosyadaki body{} override'ı çoğu yerde işi görür.
   ============================================================ */


/* ------------------------------------------------------------
   1) PALET + FONT DEĞİŞKENLERİ
   `body` seçicisi Elementor'ün enjekte ettiği body{} ile aynı
   özgüllükte olduğu ve child geç yüklendiği için kazanır.
------------------------------------------------------------ */
:root,
body {
  --primary:       #A6883C; /* antik altın — logo */
  --primary_hover: #8A6F2E; /* koyu altın (hover) */
  --text:          #3A3A3A; /* gövde metni */
  --accent:        #141414; /* başlık / near-black */
  --heading:       #141414;
  --light:         #8F8676; /* altına çalan sıcak soluk gri (Elementor: Lighter) */
  --border:        #E7E2D5; /* sıcak krem kenarlık */
  --background:    #FFFFFF;

  /* Tipografi (Elementor bu temada renk enjekte eder, font ETMEZ;
     bu yüzden font değişkenlerini burada güvenle ezebiliyoruz) */
  --e-global-typography-text-font-family:   "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --e-global-typography-accent-font-family: "Fraunces", Georgia, "Times New Roman", serif;
}


/* ------------------------------------------------------------
   2) TİPOGRAFİ — HİBRİT
   Başlıklar: Fraunces (klasik serif)
   Gövde/menü/buton: Outfit (temiz sans — okunaklı arayüz)
   NOT: Elementor ile yapılan sayfalarda tam oturması için Global Fonts'ta:
   Primary/başlık = Fraunces, Text/gövde = Outfit.
------------------------------------------------------------ */
body,
button,
input,
select,
optgroup,
textarea,
.woocommerce-page {
  font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}


h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title,
.widget-title,
.section-title,
.elementor-heading-title,
.woocommerce-loop-product__title,
.product_title,
.products-header__title {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  color: var(--accent);
  letter-spacing: 0.2px;
}

.site-description,
.entry-title,
.product_title {
  font-weight: 600;
}


/* ------------------------------------------------------------
   3) BAĞLANTILAR
------------------------------------------------------------ */
a {
  color: var(--accent);
}
a:hover,
a:focus {
  color: var(--primary);
}


/* ------------------------------------------------------------
   4) BUTONLAR — pill (50px) yerine zarif, köşeli, harf aralıklı
------------------------------------------------------------ */
.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.wp-block-button__link,
.elementor-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  border-radius: 999px !important;   /* buton köşe yuvarlaklığı — pill için 999px, hafif için 4px */
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

/* Ana (dolu) butonlar: altın zemin */
.button:not(.outline),
input[type="submit"],
.wp-block-button__link,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.single_add_to_cart_button,
.elementor-button.elementor-button-primary {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.button:not(.outline):hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.single_add_to_cart_button:hover,
.elementor-button.elementor-button-primary:hover {
  background-color: var(--primary_hover);
  border-color: var(--primary_hover);
  color: #fff;
}


/* ------------------------------------------------------------
   5) WOOCOMMERCE — ürün kartları, fiyat, rozet
------------------------------------------------------------ */
/* Fiyat: altın vurgu */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.price ins {
  color: var(--primary);
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
}

/* İndirim / yeni rozet: altın zemin, köşeli */
.woocommerce span.onsale,
.onsale,
.new-label {
  background-color: var(--primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  letter-spacing: .5px;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
}

/* Ürün kartına ince, zarif hover çerçevesi */
.woocommerce ul.products li.product,
.products li.product {
  transition: box-shadow .3s ease, transform .3s ease;
}
.woocommerce ul.products li.product:hover,
.products li.product:hover {
  box-shadow: 0 10px 30px rgba(20, 20, 20, .08);
}

/* Yıldız derecelendirme rengi */
.woocommerce .star-rating span::before,
.star-rating span::before {
  color: var(--primary);
}

/* ------------------------------------------------------------
   5b) VİTRİN / MAĞAZA KARTI PUNTOSU
   Yalnızca ürün gridindeki kartları büyütür (ana sayfa + mağaza +
   kategori). Footer/menü/blog/tekil ürün ETKİLENMEZ — seçiciler
   sadece "ul.products li.product" içinde geçerlidir.
   Değeri değiştirmek istersen: aşağıdaki font-size'lar tek ayar yeri.
   Baz değerler: başlık 16px, yazar 12px, fiyat 20px.
------------------------------------------------------------ */
/* Ürün adı */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title a {
  font-size: 18px !important;   /* ← ÜRÜN ADI (16px → 18px) */
}
/* Yazar */
.woocommerce ul.products li.product .woocommerce-loop-product__author,
.woocommerce ul.products li.product .woocommerce-loop-product__author a {
  font-size: 14px !important;   /* ← YAZAR (12px → 14px) */
}
/* Fiyat */
.woocommerce ul.products li.product .price {
  font-size: 21px !important;   /* ← FİYAT (20px → 21px) */
}


/* ------------------------------------------------------------
   6) BAŞLIK ALTI ZARİF ALTIN ÇİZGİ (bölüm başlıkları)
   Aşağıdaki class'lar temanın bölüm başlıklarında sık kullanılır.
   Fazla agresif olmaması için ince bir çizgi ekliyoruz.
------------------------------------------------------------ */
.section-title,
.products-header__title,
.widget-title {
  position: relative;
  padding-bottom: 14px;
}
.section-title::after,
.products-header__title::after,
.widget-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48px;
  height: 2px;
  background-color: var(--primary);
}
/* Ortalanmış başlıklarda çizgiyi de ortala */
.text-center .section-title::after,
.elementor-widget-heading[data-widget_type*="heading"] .elementor-heading-title.elementor-align-center::after {
  left: 50%;
  transform: translateX(-50%);
}


/* ------------------------------------------------------------
   7) HEADER / MENÜ — altın hover vurgusu
------------------------------------------------------------ */
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a,
.header-account a:hover,
.header .mini-cart:hover {
  color: var(--primary);
}


/* ------------------------------------------------------------
   8) BÖLÜM ARKA PLANI (hafif krem) — yardımcı sınıf
   Elementor bölümlerinin arka planını EZMEYİZ (kendi ayarları
   var). Sadece temanın kendi "krem/gri" alanlarını sıcaklaştırır.
------------------------------------------------------------ */
.bg-light,
.section-gray,
.widget_area.bg-light {
  background-color: #FAF8F2 !important;
}


/* ------------------------------------------------------------
   9) FORM ODAK / KENARLIKLAR — altın vurgusu
------------------------------------------------------------ */
input:focus,
textarea:focus,
select:focus,
.form-control:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 1px rgba(166, 136, 60, .25);
  outline: none;
}


/* ------------------------------------------------------------
   10) SEÇİM RENGİ
------------------------------------------------------------ */
::selection {
  background-color: var(--primary);
  color: #fff;
}


/* ------------------------------------------------------------
   11) ÜRÜN SAYFASI ÜST / ALT BAŞLIK (yalnızca tekil ürün)
------------------------------------------------------------ */
.single-product .ilav-ust-baslik {
  font-family: "Outfit", -apple-system, "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: .98rem;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 0px;
}
.single-product .ilav-alt-baslik {
  font-family: "Outfit", -apple-system, "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: .98rem;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 6px;
}


/* ------------------------------------------------------------
   12) SEPET (CART) İKONUNU GİZLE — bu sitede satış/sepet yok.
   NOT: İstek listesi (wishlist) ve Hesabım (account) BİLEREK
   gizlenmedi; onlar çalışmaya devam eder.
------------------------------------------------------------ */
.site-header-cart,
.header-cart-mobile,
.site-header-cart-side,
.cart-side-overlay,
.bookory-sticky-add-to-cart {
  display: none !important;
}


/* ------------------------------------------------------------
   13) KİTAP KAPAĞI — ince kenar + çok hafif gölge
   Beyaz kapaklar beyaz zeminle karışmasın diye kapağın kenarını
   belirginleştirir. Gölge çok hafiftir; kenar çizgisi asıl işi görür.
   (Sadece gölge istersen 'border' satırını sil; daha belirgin gölge
    için rgba'daki .05'i .08–.10 yap.)
------------------------------------------------------------ */
.product-image {
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 6px 18px rgba(20, 20, 20, .05);
  transition: box-shadow .3s ease, transform .3s ease;
}
.product-image img {
  display: block;
  width: 100%;
}
/* Kart üzerine gelince gölge biraz belirginleşsin */
.product:hover .product-image,
li.product:hover .product-image {
  box-shadow: 0 12px 28px rgba(20, 20, 20, .10);
}


/* ------------------------------------------------------------
   14) TEKİL ÜRÜN SAYFASI KAPAĞI — aynı ince kenar + hafif gölge
   (Zoom/lightbox ve göz ikonunu bozmamak için overflow:hidden
    KULLANILMADI; köşe yuvarlaklığı görselin kendisine de verildi.)
------------------------------------------------------------ */
.single-product .woocommerce-product-gallery__image {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(20, 20, 20, .05);
}
.single-product .woocommerce-product-gallery__image img {
  border-radius: 8px;
}


/* ------------------------------------------------------------
   15) BLOG TEKİL YAZI — sidebar ve üst meta satırını kaldır
   (Kuruluş Broşürü gibi belge sayfaları için temiz görünüm)
------------------------------------------------------------ */
/* Sağdaki kenar çubuğu (Archives / Categories) gizle + içerik tam genişlik */
.single-post #secondary {
  display: none !important;
}
.single-post #primary.content-area {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
  float: none;
}
/* Üstteki "Kategori / Tarih / Yazan: …" meta satırı */
.single-post .entry-header .entry-meta {
  display: none;
}


/* ------------------------------------------------------------
   16) BLOG LİSTELEME (arşiv) düzenlemeleri
------------------------------------------------------------ */
/* (a) "Yazan: …" (yazar) gizle — TARİH kalır */
.post-author {
  display: none !important;
}
/* Yazar gizlenince tarihten sonra kalan "/" ayracını da kaldır */
.entry-meta > .posted-on::after {
  display: none !important;
  content: "" !important;
}

/* (b) Blog kenar çubuğu widget'ları (Ara/Search, Recent Posts, Recent
   Comments) buradan CSS ile GİZLENMİYOR — bunlar Görünüm → Widget'lar
   ekranından silinecek. */


/* ------------------------------------------------------------
   17) BURS BANNER ARKA PLAN EFEKTİ — yıldızlar + ışık süpürmesi
   ------------------------------------------------------------
   AKTİF ETMEK İÇİN: Elementor'da burs banner'ının SECTION/CONTAINER
   ayarına git → Gelişmiş (Advanced) → CSS Sınıfları (CSS Classes)
   kutusuna şunu yaz:  ilav-burs-banner
   (Sınıf eklenmeden hiçbir şey değişmez; efekt yalnızca o banner'da
   çalışır, site geneli etkilenmez.)
------------------------------------------------------------ */
.ilav-burs-banner {
  position: relative;
  overflow: hidden;              /* efektler yuvarlak köşelerin içinde kalsın */
}
/* Gerçek içerik (yazı/buton) efektlerin ÜSTÜNDE kalsın */
.ilav-burs-banner > * {
  position: relative;
  z-index: 2;
}

/* Parlayan küçük yıldızlar */
.ilav-burs-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-repeat: no-repeat;
  background-image:
    radial-gradient(1.6px 1.6px at 14% 26%, rgba(255,255,255,.95), transparent),
    radial-gradient(1.3px 1.3px at 26% 64%, rgba(255,255,255,.75), transparent),
    radial-gradient(1px   1px   at 38% 18%, rgba(255,255,255,.85), transparent),
    radial-gradient(1.5px 1.5px at 55% 40%, rgba(255,255,255,.70), transparent),
    radial-gradient(1px   1px   at 66% 22%, rgba(255,255,255,.85), transparent),
    radial-gradient(1.4px 1.4px at 74% 60%, rgba(255,255,255,.80), transparent),
    radial-gradient(1px   1px   at 84% 34%, rgba(255,255,255,.75), transparent),
    radial-gradient(1.6px 1.6px at 92% 52%, rgba(255,255,255,.90), transparent),
    radial-gradient(1px   1px   at 48% 74%, rgba(255,255,255,.70), transparent);
  animation: ilavBannerTwinkle 7s ease-in-out infinite;
}
@keyframes ilavBannerTwinkle {
  0%, 100% { opacity: .35; }
  50%      { opacity: .95; }
}

/* Yavaş ışık süpürmesi (light sweep) */
.ilav-burs-banner::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 45%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(115deg, transparent, rgba(255,255,255,.10), transparent);
  transform: skewX(-15deg);
  animation: ilavBannerSweep 10s ease-in-out infinite;
}
@keyframes ilavBannerSweep {
  0%       { left: -60%; }
  45%,100% { left: 130%; }
}

/* Hareket azaltma tercihi açık kullanıcıda efektleri durdur */
@media (prefers-reduced-motion: reduce) {
  .ilav-burs-banner::before,
  .ilav-burs-banner::after { animation: none; }
}


/* ------------------------------------------------------------
   18) ÖNE ÇIKAN KİTAPLAR — dikey "top" widget'ı
       (Elementor "bookory-products", "product list style 6" düzeni)

   GERÇEK DOM (canlı sitede doğrulandı):
     .elementor-widget-bookory-products
       .woocommerce-product-list-6 ul.products li.product
         > .product-block-list-6
             > .left  (a.menu-thumb > img  = KAPAK)   ← rozet: .left:before
             + .right (başlık / yazar)

   NOT: Bu widget'ın kapağı ".product-image" DEĞİLDİR; o yüzden 13)
   kuralı buraya UYMAZ, kapak stilini burada ayrıca kuruyoruz.
   KAPSAM KİLİTLİ: ".woocommerce-product-list-6" ve ".product-block-list-6"
   yalnızca bu widget'ta bulunur → ana ürün gridi (ul.products > li.product,
   iç blok .product-block) ve mağaza liste görünümü (li.product-list)
   ETKİLENMEZ.
------------------------------------------------------------ */

/* (a) SATIRA/ÖĞEYE binen çirkin gölgeyi KALDIR.
   Kaynak: 5) kuralı → ".products li.product:hover { box-shadow:0 10px 30px }".
   Bu widget'ın kapsayıcısı çıplak "products" token'ı taşıdığından o kural
   BURADA de tetikleniyordu. Yüksek özgüllük + !important ile eziyoruz. */
.elementor-widget-bookory-products .woocommerce-product-list-6 ul.products li.product,
.elementor-widget-bookory-products .woocommerce-product-list-6 ul.products li.product:hover {
  box-shadow: none !important;
}

/* (b) KAPAĞA ince krem kenar + sıkı/yumuşak gölge (beyaz kapak beyaz
   zeminden ayrışsın). Border/gölge doğrudan KAPAK GÖRSELİNE verilir:
   böylece sol-üst köşeye binen numara rozeti (.left:before, left:-11px/
   top:-8px) KIRPILMAZ — bu yüzden .left'e overflow:hidden EKLENMEZ. */
.elementor-widget-bookory-products .woocommerce-product-list-6 .product-block-list-6 .left img {
  display: block;
  box-sizing: border-box;
  border: 1px solid var(--border);              /* #E7E2D5 — sıcak krem */
  border-radius: 8px !important;                /* tema 15px'i ez */
  background: #fff;
  box-shadow: 0 6px 16px rgba(20, 20, 20, .10); /* sıkı/yumuşak ayrışma */
  transition: transform .25s ease, box-shadow .25s ease;
}

/* (c) HOVER — kapak zarifçe yükselsin + gölge biraz belirginleşsin. */
.elementor-widget-bookory-products .woocommerce-product-list-6 ul.products li.product:hover .product-block-list-6 .left img {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(20, 20, 20, .14);
}

/* prefers-reduced-motion: hareketi ve geçişi sustur */
@media (prefers-reduced-motion: reduce) {
  .elementor-widget-bookory-products .woocommerce-product-list-6 .product-block-list-6 .left img {
    transition: none !important;
  }
  .elementor-widget-bookory-products .woocommerce-product-list-6 ul.products li.product:hover .product-block-list-6 .left img {
    transform: none !important;
  }
}

/* (d) HOVER'da kapak, numara rozetinin ÜSTÜNE geçiyordu: kapağa verilen
   transform img'ye yeni bir stacking context açıp rozeti (.left:before)
   altında bırakıyordu. Çözüm: .left'i kendi stacking context'i yap ve
   rozete kapaktan yüksek z-index ver → rozet her zaman üstte kalır. */
.elementor-widget-bookory-products .woocommerce-product-list-6 .product-block-list-6 .left {
  isolation: isolate;
}
.elementor-widget-bookory-products .woocommerce-product-list-6 .product-block-list-6 .left:before {
  z-index: 3;
}


/* ============================================================
 * 18) MOBİL YÜZEN ALT MENÜ BARI — HER ZAMAN EN ÜSTTE
 * ------------------------------------------------------------
 * Bar, footer şablonundaki (elementor-751) sabit bölümdür
 * (.elementor-element-5c1c1fa) ve yalnızca mobil/tablette görünür.
 * Giriş animasyonlu (grow) Elementor kartları kendi stacking-
 * context'ini açıp barın ÜSTÜNE biniyordu. Bara çok yüksek
 * z-index vererek her koşulda en üstte kalmasını sağlıyoruz.
 * (Bölüm zaten hidden-desktop; ayrı media query gerekmez.)
 * ========================================================== */
.elementor-751 .elementor-element-5c1c1fa {
  z-index: 99999 !important;
  /* ORTALAMA: Elementor'un satır-içi (inline) "width:420px; left:0"
     değerini !important ile ez ve barı viewport'a göre tam ortala.
     (CSS !important, important olmayan inline stili geçersiz kılar;
     Elementor tekrar yazsa bile bu kural kazanır.) */
  left: 50% !important;
  right: auto !important;
  width: 100vw !important;
  max-width: 100vw !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
}
/* Arka plan kaplaması da barın altında kalsın */
.elementor-751 .elementor-element-5c1c1fa > .elementor-background-overlay {
  z-index: 0 !important;
}


/* ============================================================
 * 19) SAĞ ÜST HESAP AÇILIR MENÜSÜ — satış olmadığı için
 *     Siparişler / Adresi Düzenle / İndirmeler bağlantılarını gizle
 * ------------------------------------------------------------
 * Bu açılır menü, "Hesabım" sayfası kenar çubuğundan AYRI bir tema
 * öğesidir (functions.php §9 filtresi buraya işlemez). Bağlantıları
 * hedefe göre (href) gizliyoruz. URL'den doğrudan erişim §9'daki
 * yönlendirmeyle zaten engelli.
 * ========================================================== */
.site-header-account a[href*="/orders"],
.site-header-account a[href*="edit-address"],
.site-header-account a[href*="/downloads"] {
  display: none !important;
}
