/* ==========================================================================
   Indri Ethnics — Sepet sayfası (is_cart) renk katmanı
   ÖNEMLİ: Bu sitede sepet klasik [woocommerce_cart] template'i DEĞİL,
   WooCommerce Blocks (woocommerce/cart bloğu, Store API) kullanıyor — DOM
   .wp-block-woocommerce-cart altinda wc-block-cart-* / wc-block-components-*
   sınıfları (checkout.css'teki [[checkout-woocommerce-blocks]] dersinin
   aynısı). Blok/sayfa içeriğine (post_content) DOKUNULMAZ; form kontrolleri
   (input/checkbox/radio/label/hata) için WC Blocks'un RESMİ desteklediği
   "has-dark-controls" sınıfı functions.php'de render_block filtresiyle
   eklenir (bkz. sc_wc_block_dark_controls). Ülke/il select popup'ı için
   checkout.css ile aynı yöntem (renk doğrudan gerçek <select>/<option>'a) —
   burada tekrarlanır (dosyalar birbirinden bağımsız, sayfa bazlı yüklenir).
   Kök kapsam: .wp-block-woocommerce-cart — header/footer bunun dışında,
   sızma riski yok.
   ========================================================================== */

/* --- Sayfa çerçevesi ------------------------------------------------------ */

body.woocommerce-cart {
	color-scheme: dark;
}

body.woocommerce-cart,
body.woocommerce-cart #ajax-content-wrap,
body.woocommerce-cart .container-wrap,
body.woocommerce-cart .container-wrap .main-content,
body.woocommerce-cart .container-wrap .main-content > .row,
/* Salient'in "global section / before footer" bloğu: canlı tema ayarlarında
   tanımlı, içeriği BOŞ, ama Salient'in açık zeminiyle geliyordu → içerik ile
   footer arasında beyaz şerit. Sepet/ödeme, Salient şablonunu kullanan tek iki
   sayfamız olduğu için yalnız burada görünüyordu. display:none YERİNE zemin
   eşitleniyor: bölüme ileride gerçekten içerik girilirse kaybolmaz, koyu
   zeminde görünür. Salient bu sınıfı değiştirirse kural boşa düşer, bir şeyi
   bozmaz. */
body.woocommerce-cart .nectar-global-section {
	background-color: var(--sc-bg);
	color: var(--sc-text);
}

/* CLS (layout shift) önlemi — mobil 0.110 / boş sepette 0.239 idi.
   Sebep: sepet bloğu sunucudan 664px gelir, JS hydration sırasında 468px'e
   ÇÖKER, sonra gerçek içerikle tekrar büyür. Kısa sepette footer o sırada
   ekrana girip çıktığı için kayma sayfanın görünen kısmında oluşuyordu.
   Çözüm: içerik alanı en az bir ekran boyu → footer yükleme boyunca ekranın
   altında kalır, kutunun boyu değişse de görünen alanda bir şey oynamaz.
   Bilerek WooCommerce'in kendi markup'ına bağlanmıyor (yalnızca body sınıfı
   + kendi değişkenimiz): blok yapısı güncellemeyle değişse bile bu kural
   çalışmaya devam eder, en kötü ihtimalle etkisiz kalır — hiçbir şeyi bozmaz.
   svh mobil tarayıcı çubuğunu hesaba katar; desteklemeyen tarayıcı ilk
   satırdaki vh'e düşer. */
body.woocommerce-cart .container-wrap {
	min-height: calc(100vh - var(--sc-header-h));
	min-height: calc(100svh - var(--sc-header-h));
}

body.woocommerce-cart .wp-block-woocommerce-cart {
	color: var(--sc-text);
	color-scheme: dark;
}

body.woocommerce-cart .wp-block-woocommerce-cart a:not(.wc-block-cart__submit-button) {
	color: var(--sc-accent);
}

body.woocommerce-cart .wc-block-components-title,
body.woocommerce-cart .wc-block-components-panel__button,
body.woocommerce-cart .wc-block-cart__totals-title,
body.woocommerce-cart .wc-block-cart__empty-cart__title {
	color: var(--sc-text);
}

/* --- Ürün satırları --------------------------------------------------------- */

body.woocommerce-cart .wc-block-cart-items {
	border-color: var(--sc-border);
}

body.woocommerce-cart .wc-block-cart-items__header {
	color: var(--sc-muted);
}

body.woocommerce-cart .wc-block-cart-items__row {
	border-color: var(--sc-border);
}

body.woocommerce-cart .wc-block-components-product-name {
	color: var(--sc-text);
}

body.woocommerce-cart .wc-block-components-product-price__value,
body.woocommerce-cart .wc-block-components-product-price {
	color: var(--sc-accent);
}

body.woocommerce-cart .wc-block-components-product-metadata {
	color: var(--sc-muted);
}

body.woocommerce-cart .wc-block-cart-item__remove-link {
	color: var(--sc-muted);
}

body.woocommerce-cart .wc-block-cart-item__remove-link:hover {
	color: var(--sc-accent);
}

/* Adet seçici — site genelindeki oval form dili (bkz. [[butonlar-oval]]). */
body.woocommerce-cart .wc-block-components-quantity-selector {
	border-color: var(--sc-border) !important;
	border-radius: 999px !important;
	overflow: hidden;
}

body.woocommerce-cart .wc-block-components-quantity-selector__button:hover {
	color: var(--sc-accent);
}

/* --- Metin alanı / textarea (has-dark-controls'un üstüne marka renkleri;
   kupon input'u da .wc-block-components-text-input class'ını taşır) -------- */

body.woocommerce-cart .wc-block-components-text-input input {
	background-color: var(--sc-surface) !important;
	border-color: var(--sc-border) !important;
	color: var(--sc-text) !important;
	border-radius: 999px !important;
}

body.woocommerce-cart .wc-block-components-text-input input:focus {
	border-color: var(--sc-accent) !important;
	color: var(--sc-text) !important;
}

body.woocommerce-cart .wc-block-components-text-input label {
	color: var(--sc-muted) !important;
}

/* --- Ülke/il seçimi: native <select> ----------------------------------------
   Renk doğrudan gerçek <select>/<option> elemanına uygulanır — checkout.css'teki
   detaylı açıklamanın aynısı geçerli. İki class de tutulur: eski
   (wc-block-components-select-input) ve yeni (wc-blocks-components-select__select)
   — bir güncelleme birini kaldırsa bile diğeri eşleşmeye devam etsin. -------- */
body.woocommerce-cart .wc-block-components-select-input,
body.woocommerce-cart .wc-blocks-components-select__select {
	background-color: var(--sc-surface) !important;
	border-color: var(--sc-border) !important;
	color: var(--sc-text) !important;
	border-radius: 999px !important;
	color-scheme: dark;
}

body.woocommerce-cart .wc-block-components-select-input option,
body.woocommerce-cart .wc-blocks-components-select__select option {
	background: var(--sc-surface) !important;
	color: var(--sc-text) !important;
}

/* --- Onay kutusu / radyo (teslimat seçenekleri) — has-dark-controls dolguyu/
   kontrastı otomatik ayarlıyor; sadece seçili çerçeve marka accent'i. ------ */

body.woocommerce-cart .wc-block-components-radio-control__input:checked,
body.woocommerce-cart .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--sc-accent) !important;
}

/* --- Sipariş özeti / toplamlar ---------------------------------------------- */

body.woocommerce-cart .wc-block-components-totals-item__value,
body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--sc-accent);
}

body.woocommerce-cart .wc-block-components-totals-item,
body.woocommerce-cart .wc-block-components-panel,
body.woocommerce-cart .wc-block-components-sidebar {
	border-color: var(--sc-border);
}

/* --- Bildirimler ------------------------------------------------------------ */

body.woocommerce-cart .wc-block-components-notice-banner {
	background-color: var(--sc-surface);
	border-color: var(--sc-border);
	color: var(--sc-text);
}

/* --- Kupon "Uygula" butonu — ikincil, outline dili -------------------------- */

body.woocommerce-cart .wc-block-components-totals-coupon__button {
	background-color: transparent !important;
	color: var(--sc-accent) !important;
	border: 1px solid var(--sc-accent) !important;
}

/* Salient'in kapsamsız button[type=submit]:hover kuralı (bkz.
   [[salient-css-sizmasi]]) tek-class'lı hover kuralımızı eziyor; ata class
   ile özgüllüğü artırıp kesin kazandırıyoruz. */
body.woocommerce-cart .wc-block-components-totals-coupon__button:hover,
body.woocommerce-cart .wc-block-components-totals-coupon__button:focus {
	background-color: transparent !important;
	color: var(--sc-accent) !important;
	border-color: var(--sc-accent) !important;
}

/* --- "Ödemeye geç" — .sc-btn diliyle (buttons.css'te tam kural). ----------- */

body.woocommerce-cart .wc-block-cart__submit-button .wc-block-components-button__text > svg {
	fill: var(--sc-bg) !important;
}

body.woocommerce-cart .wc-block-cart__submit-button:hover .wc-block-components-button__text > svg,
body.woocommerce-cart .wc-block-cart__submit-button:focus .wc-block-components-button__text > svg {
	fill: var(--sc-accent) !important;
}

/* --- Boş sepet bloğu --------------------------------------------------------
   Sepet boşken WooCommerce'in empty-cart bloğu görünür: başlık + nokta ayraç +
   "Mağazada yeni" başlığı + ürün ızgarası. Izgaranın markup'ı functions.php'de
   (sc_empty_cart_products_grid) shop/ilgili ürünlerle birebir aynı .sc-card
   grid'iyle değiştirilir — kart görünümü ve animasyonu TEK kaynaktan, paylaşılan
   cards.css'ten gelir; burada sadece grid yerleşimi ve blok metinleri var
   (product.css .sc-related__grid ile aynı kalıp). Blok/post_content'e dokunulmaz.
   -------------------------------------------------------------------------- */

body.woocommerce-cart .wp-block-woocommerce-empty-cart-block {
	background: transparent;
}

/* Blok içindeki iki h2 de sıradan core/heading; "Mağazada yeni" başlığı
   wc-block-cart__empty-cart__title sınıfını taşımadığı için yukarıdaki renk
   kuralına takılmıyor ve Salient'in h1-h6 rengiyle (#444) koyu kalıyordu.
   DİKKAT: bu seçiciye font-size VERİLMEZ — "sepet boş" ikonu WC'de
   `height: 5em` ile çizilir, başlığı büyütmek ikonu da katlıyor. */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block h2 {
	color: var(--sc-text);
}

/* "Mağazada yeni" — ilgili ürünler başlığıyla aynı ölçek (.sc-related__title). */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block h2:not(.wc-block-cart__empty-cart__title) {
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: 0.06em;
}

body.woocommerce-cart .wp-block-woocommerce-empty-cart-block p {
	color: var(--sc-muted);
}

/* Nokta ayraç: is-style-dots noktaları currentColor ile çizilir. */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wp-block-separator {
	color: var(--sc-muted);
	border-color: var(--sc-border);
	margin-block: clamp(2rem, 5vw, 3.5rem);
}

/* --- Öneri ızgarası (.sc-card) — shop/ilgili ürünlerle aynı yerleşim -------- */

.sc-cart-suggest__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 2rem);
	text-align: left;
}

.sc-cart-suggest__grid .sc-card {
	padding: 0.6rem;
	border: 0;
}

.sc-cart-suggest__grid .sc-card__body {
	padding: 1rem 0.6rem 0.6rem;
}

/* "İncele" — shop kartıyla aynı düz sarı link + hover'da soldan açılan çizgi. */
.sc-cart-suggest__grid .sc-card__view {
	position: relative;
	margin-top: auto;
	align-self: flex-start;
	padding-top: 0.5rem;
	color: var(--sc-accent);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
}

.sc-cart-suggest__grid .sc-card__view::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 1px;
	background: var(--sc-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
	pointer-events: none;
}

.sc-cart-suggest__grid .sc-card__view:hover::after,
.sc-cart-suggest__grid .sc-card__view:focus-visible::after {
	transform: scaleX(1);
}

/* Mobil: 2 üstte 2 altta (site mobil kırılımıyla aynı eşik). */
@media (max-width: 880px) {
	.sc-cart-suggest__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.sc-cart-suggest__grid {
		gap: 0.75rem;
	}

	.sc-cart-suggest__grid .sc-card__body {
		padding: 0.85rem 0.5rem 0.5rem;
	}
}