/* ============================================================
   İKON KATMANI  (her sayfada yüklenir)

   `.fc-ikon` hem flex hem blok bağlamında çalışsın diye
   `inline-block` + `vertical-align` ile kurulur: butonlarımızın
   bir kısmı inline-flex, bir kısmı düz blok/inline; tek kural
   ikisini birden karşılasın diye boşluk `gap` değil `margin`.
   ============================================================ */

.fc-ikon{
	width:18px;height:18px;flex:0 0 auto;
	display:inline-block;vertical-align:-.22em;
	pointer-events:none;
}

/*
 * Boşluk YAPISAL SEÇİCİYLE verilemez: etiket metni bir metin düğümü olduğu
 * için ikon hem :first-child hem :last-child olur. Eski kuraldaki
 * `:only-child{margin:0}` bu yüzden ikon+metin butonlarında da eşleşip
 * boşluğu siliyordu — ölçüldü, ikon ile yazı arası 0px'ti.
 * Konumu artık PHP tarafı bildiriyor (bkz. fitchair_ikon_arkada_olanlar).
 */
/*
 * `svg.` öneki ZORUNLU. Kapsam dosyalarının hemen hepsi `.fc-urun *{margin:0}`
 * gibi bir joker sıfırlama ile başlıyor; o kural (0,1,0) özgüllüğünde ve
 * ikon.css'ten SONRA yüklendiği için sade `.fc-ikon` (0,1,0) kaybediyordu —
 * ölçüldü: ikon ile yazı arası 0px, suçlu stil sayfası tek tek kapatılarak
 * bulundu. `svg.fc-ikon` (0,1,1) sıraya bakılmaksızın kazanır.
 */
svg.fc-ikon{margin-right:9px}                       /* varsayılan: ikon metnin ÖNÜNDE */
svg.fc-ikon--arka{margin-right:0;margin-left:9px}   /* yön oku: metnin ARDINDA */

/* Satır/liste içinde kullanılan ikonlar boşluğunu sarmalayıcıdan alır. */
.fc-ikon.fc-ikon--satir{margin:0}

/* Marka glifi DOLGU tabanlıdır. Sarmalayıcı kurallar (`.kunye__i svg`,
   `.serit__i svg` …) `fill:none;stroke:currentColor` yazıyor ve ikon.css
   onlardan ÖNCE yükleniyor; sunum attribute'ı da CSS'e karşı kaybediyor.
   Bu iki satır bilinçli !important — aksi halde WhatsApp logosu görünmez
   ya da içi boş bir kontur olarak çıkar. */
.fc-ikon--whatsapp{fill:currentColor !important;stroke:none !important}

/* Marka glifi dolgu tabanlı; stroke ikonlardan bir tık büyük durur,
   optik olarak eşitliyoruz. */
.fc-ikon--whatsapp{width:17px;height:17px}

/* Ok ikonu hover'da yönünü belli etsin — süs değil, yön bildirimi. */
:is(a,button):hover > .fc-ikon--ok{transform:translateX(3px)}
.fc-ikon--ok{transition:transform .18s ease}

@media (prefers-reduced-motion:reduce){
	.fc-ikon--ok{transition:none}
	:is(a,button):hover > .fc-ikon--ok{transform:none}
}

/* ------------------------------------------------------------
   WooCommerce'in KENDİ ürettiği "Sepete ekle" butonu.
   Metni `esc_html` ile basıldığı için içine SVG konulamaz;
   ikon maske ile eklenir ve `currentColor`'ı alır.
   ------------------------------------------------------------ */
.fc-urun .alma .single_add_to_cart_button::before{
	content:"";
	width:19px;height:19px;flex:0 0 auto;margin-right:10px;
	background-color:currentColor;
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6.5V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.5L18 2Z'/%3E%3Cpath d='M3 6.5h18'/%3E%3Cpath d='M16 10.5a4 4 0 0 1-8 0'/%3E%3C/svg%3E") center/contain no-repeat;
	        mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6.5V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.5L18 2Z'/%3E%3Cpath d='M3 6.5h18'/%3E%3Cpath d='M16 10.5a4 4 0 0 1-8 0'/%3E%3C/svg%3E") center/contain no-repeat;
}