/* ═══════════════════════════════════════════════════════════════════════
   ÜRÜN VİTRİNİ — qs_showcase
   ---------------------------------------------------------------------------
   Tüm sınıflar .qs-sc- / .qs-card- önekiyle başlar. Böylece mağaza temasının
   kendi .product/.card sınıflarıyla ÇAKIŞMA olmaz; tema değişse de blok
   aynı görünür.
   ---------------------------------------------------------------------------
   Tema değişkenleri:
     --qs-sc-accent   : vurgu rengi (rozet, buton)
     --qs-sc-title    : başlık rengi
     --qs-sc-text     : metin rengi
   Üst blok .qs-showcase üzerinde bu değişkenler tanımlıdır.
   ═══════════════════════════════════════════════════════════════════════ */

.qs-showcase {
	/* Kullanıcı renk vermediyse makul temalarla uyumlu güvenli varsayılanlar */
	--qs-sc-accent: var(--qs-red, #7c3aed);
	--qs-sc-title: #1e1b24;
	--qs-sc-text: #4b5563;

	/* Kart ölçüleri — JS tarafında da kullanılır, tek kaynak burada */
	--qs-sc-gap: .5rem;
	--qs-sc-radius: 10px;
	--qs-sc-border: rgba(0, 0, 0, .08);

	margin: 0 0 1.75rem;
	color: var(--qs-sc-text);
	border: var(--qs-sc-frame-border-width, 0) solid var(--qs-sc-frame-border-color, transparent);
	border-radius: var(--qs-sc-frame-radius, 0);
}

.qs-showcase.qs-sc-frame-visible {
	padding: clamp(.5rem, 1.25vw, 1rem);
}

@media (max-width: 575.98px) {
	.qs-showcase.qs-sc-frame-visible {
		padding: .5rem;
	}
}

/* ── Başlık ──────────────────────────────────────────────────────────── */
.qs-sc-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: .875rem;
}

.qs-sc-title {
	margin: 0;
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--qs-sc-title);
}

.qs-sc-subtitle {
	margin: .25rem 0 0;
	font-size: .875rem;
	opacity: .8;
}

/* ── Sekmeler ────────────────────────────────────────────────────────── */
.qs-sc-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: .375rem;
	margin-bottom: 1rem;
	border-bottom: 1px solid var(--qs-sc-border);
}

.qs-sc-tab {
	position: relative;
	padding: .5rem .875rem;
	font-size: .9375rem;
	font-weight: 500;
	color: var(--qs-sc-text);
	background: none;
	border: 0;
	cursor: pointer;
	transition: color .15s ease;
}

.qs-sc-tab:hover {
	color: var(--qs-sc-accent);
}

.qs-sc-tab.is-active {
	color: var(--qs-sc-accent);
	font-weight: 600;
}

/* Alt çizgi — tema butonlarıyla çakışmasın diye kendi çizgimiz */
.qs-sc-tab.is-active::after {
	content: "";
	position: absolute;
	inset-inline: .5rem;
	bottom: -1px;
	height: 2px;
	background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;
	border-radius: 2px 2px 0 0;
}

.qs-sc-tab-count {
	display: inline-block;
	margin-inline-start: .375rem;
	padding: .0625rem .375rem;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--qs-sc-accent);
	background: color-mix(in srgb, var(--qs-sc-accent) 12%, transparent);
	border-radius: 999px;
}

.qs-sc-group-title {
	margin: 0 0 .75rem;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--qs-sc-title);
}

/* ── Izgara ──────────────────────────────────────────────────────────── */
.qs-sc-grid {
	display: grid;
	grid-template-columns: repeat(var(--qs-sc-cols, 4), minmax(0, 1fr));
	gap: var(--qs-sc-gap);
}

/* ── Karusel ─────────────────────────────────────────────────────────
   Sayfa KAYDIRILMAZ. Sabit yükseklikte yatay kaydırma yapılır; yalnız
   ürün alanının içinde hareket eder. Birden fazla sayfa varsa sayfalama
   düğmeleri altta çıkar.
   ──────────────────────────────────────────────────────────────────── */
.qs-sc-carousel {
	position: relative;
}

.qs-sc-track-wrap {
	overflow: hidden;
}

/* Kaydırma sırasında geçici olarak kaydırma çubuğu gizlenir */
.qs-sc-track {
	--qs-sc-visible-cols: var(--qs-sc-cols, 4);
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(var(--qs-sc-rows, 1), auto);
	grid-auto-columns: calc((100% - (var(--qs-sc-visible-cols, 4) - 1) * var(--qs-sc-gap)) / var(--qs-sc-visible-cols, 4));
	gap: var(--qs-sc-gap);
	overflow-x: auto;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	/* Dikey kaydırma sayfaya kalmalı */
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
}

.qs-sc-track::-webkit-scrollbar {
	display: none;
}

.qs-sc-item {
	min-width: 0;
	scroll-snap-align: start;
}

/* Gezinme düğmeleri — sayfa dışına taşmaz, ürünün üstüne yaslanır */
.qs-sc-nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: .375rem;
	flex-shrink: 0;
}

.qs-sc-nav--overlay {
	position: absolute;
	inset: 0;
	z-index: 5;
	align-items: center;
	justify-content: space-between;
	pointer-events: none;
}

.qs-sc-nav--overlay .qs-sc-nav-btn {
	width: 34px;
	height: 42px;
	border-radius: 8px;
	color: #fff;
	background: rgba(20, 24, 32, .58);
	border-color: rgba(255, 255, 255, .42);
	box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
	opacity: 0;
	pointer-events: none;
}

.qs-sc-nav--overlay .js-sc-prev { margin-left: .375rem; }
.qs-sc-nav--overlay .js-sc-next { margin-right: .375rem; }
.qs-showcase:hover .qs-sc-nav--overlay .qs-sc-nav-btn,
.qs-showcase:focus-within .qs-sc-nav--overlay .qs-sc-nav-btn { opacity: .88; pointer-events: auto; }
.qs-showcase .qs-sc-nav--overlay .qs-sc-nav-btn:disabled { opacity: .3; }
.qs-sc-nav--overlay .qs-sc-nav-btn:hover { background: rgba(20, 24, 32, .82); }

@media (hover: none) {
	.qs-sc-nav--overlay .qs-sc-nav-btn { opacity: .82; pointer-events: auto; }
}

.qs-sc-nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	color: var(--qs-sc-text);
	background: var(--qs-sc-card-bg, #fff);
	border: 1px solid var(--qs-sc-border);
	border-radius: 50%;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, opacity .15s ease;
}

.qs-sc-nav-btn:hover {
	color: var(--qs-sc-accent);
	background: color-mix(in srgb, var(--qs-sc-accent) 8%, #fff);
}

.qs-sc-nav-btn:disabled {
	opacity: .35;
	cursor: default;
}

.qs-sc-nav-btn:disabled:hover {
	color: var(--qs-sc-text);
	background: var(--qs-sc-card-bg, #fff);
}

/* Karuselde tek sayfa varken gezinme gereksiz */
.qs-sc-nav.is-hidden {
	visibility: hidden;
}

/* ═══════════════════════════════════════════════════════════════════════
   ÜRÜN KARTI
   ═══════════════════════════════════════════════════════════════════════ */
.qs-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--qs-pcard-bg, var(--qs-sc-card-bg, #fff));
	border: var(--qs-pcard-border-width, 1px) solid var(--qs-pcard-border-color, var(--qs-sc-border));
	border-radius: var(--qs-sc-radius);
	overflow: hidden;
	transition: box-shadow .2s ease, transform .2s ease;
}

.qs-card:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
	transform: translateY(-2px);
}

.qs-card-media {
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	line-height: 0;
	background: #f8f9fa;
}

.qs-card-media > a { display:block; margin:0; padding:0; line-height:0; }

.qs-card-media img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

/* Sekiz seçilebilir ürün kartı stili. */
.qs-showcase .qs-pcard--clean { border-color: transparent; box-shadow: 0 2px 10px rgba(20,30,50,.05); }
.qs-showcase .qs-pcard--outline { border-width: 2px; box-shadow: none; }
.qs-showcase .qs-pcard--soft { border-color: transparent; border-radius: 18px; box-shadow: 0 8px 24px rgba(20,30,50,.12); }
.qs-showcase .qs-pcard--dark { color: #f8fafc; }
.qs-showcase .qs-pcard--dark .qs-card-title,.qs-showcase .qs-pcard--dark .qs-card-title a,.qs-showcase .qs-pcard--dark .qs-card-price { color: #f8fafc; }
.qs-showcase .qs-pcard--compact .qs-card-body { padding: .5rem; gap: .25rem; }
.qs-showcase .qs-pcard--editorial { border-radius: 0; box-shadow: none; }
.qs-showcase .qs-pcard--glass { backdrop-filter: blur(8px); border-radius: 16px; box-shadow: 0 8px 28px rgba(30,40,60,.12); }
.qs-showcase .qs-pcard-border-off { border:0 !important; }
.qs-showcase .qs-card-badges { align-items: flex-start; }
.qs-showcase .qs-pcard-badge { display: inline-flex; align-items: center; gap: 0; box-sizing: border-box; width: 26px; max-width: 26px; overflow: hidden; padding: .2rem .45rem; border-radius: 4px; color:#fff; font-size:.65rem; font-weight:700; line-height:1.2; white-space:nowrap; transition:max-width .22s ease,width .22s ease,gap .22s ease; }
.qs-showcase .qs-pcard-badge > i { flex:0 0 auto; }
.qs-showcase .qs-pcard-badge-label { display:inline-block; max-width:0; overflow:hidden; opacity:0; transition:max-width .22s ease,opacity .16s ease; }
.qs-showcase .qs-pcard-badge:hover,.qs-showcase .qs-pcard-badge:focus-within { width:max-content; max-width:180px; gap:.25rem; }
.qs-showcase .qs-pcard-badge:hover .qs-pcard-badge-label,.qs-showcase .qs-pcard-badge:focus-within .qs-pcard-badge-label { max-width:140px; opacity:1; }
@media (hover:none) { .qs-showcase .qs-pcard-badge { width:max-content; max-width:180px; gap:.25rem; } .qs-showcase .qs-pcard-badge-label { max-width:140px; opacity:1; } }
.qs-showcase .qs-pcard-stock { background:#16834b; }
.qs-showcase .qs-pcard-stock-out { background:#5b6470; }
.qs-showcase .qs-pcard-shipping { background:#087da5; }
.qs-showcase .qs-pcard-discount { background:var(--qs-red, #d7193f); }
.qs-showcase .qs-pcard-size-pop { position:absolute; left:.5rem; bottom:.5rem; z-index:4; display:flex; flex-direction:row; align-items:center; }
.qs-showcase .qs-pcard-size-toggle { width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; gap:2px; padding:2px; border:0; border-radius:4px; color:var(--qs-pcard-color-text,#fff); background:var(--qs-pcard-color,#000); cursor:pointer; box-shadow:0 2px 8px #0003; }
.qs-showcase .qs-pcard-size-toggle i { font-size:10px; }
.qs-showcase .qs-pcard-size-toggle span { font-size:9px; line-height:1; font-weight:800; }
.qs-showcase .qs-pcard-size-panel { display:flex; gap:3px; max-width:0; overflow:hidden; padding:0; background:var(--qs-pcard-color,#000); border-radius:6px; opacity:0; transition:max-width .2s,opacity .2s,padding .2s; }
.qs-showcase .qs-pcard-size-panel span { color:var(--qs-pcard-color-text,#fff); font-size:.65rem; font-weight:700; padding:5px 3px; }
.qs-showcase .qs-pcard-size-pop:hover .qs-pcard-size-panel,.qs-showcase .qs-pcard-size-pop:focus-within .qs-pcard-size-panel,.qs-showcase .qs-pcard-size-pop.is-open .qs-pcard-size-panel { max-width:180px; opacity:1; padding:3px 5px; margin-left:5px; }
.qs-showcase .qs-card-color-variants { position:absolute; right:.5rem; bottom:.5rem; z-index:5; display:flex; flex-direction:row-reverse; align-items:center; gap:.3rem; }
.qs-showcase .qs-card-color-toggle { width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; gap:2px; padding:2px; border:1px solid #ffffffaa; border-radius:4px; color:#f59e0b; background:#20222ecc; cursor:pointer; box-shadow:0 2px 8px #0003; }
.qs-showcase .qs-card-color-toggle i { font-size:10px; }
.qs-showcase .qs-card-color-toggle span { color:#fff; font-size:9px; line-height:1; font-weight:800; }
.qs-showcase .qs-card-color-list { display:flex; align-items:center; gap:4px; max-width:0; overflow:hidden; padding:0; border-radius:6px; background:#20222ecc; opacity:0; transition:max-width .2s,opacity .2s,padding .2s; }
.qs-showcase .qs-card-color-dot { display:inline-block; width:16px; height:16px; flex:0 0 16px; border:1.5px solid #fff; border-radius:3px; background:var(--qs-card-color,#000); box-shadow:0 1px 3px #0007; }
.qs-showcase .qs-card-color-dot.is-active { outline:2px solid #f59e0b; outline-offset:1px; }
.qs-showcase .qs-card-color-more { color:#fff; font-size:10px; font-weight:700; padding:0 2px; }
.qs-showcase .qs-card-color-variants:hover .qs-card-color-list,.qs-showcase .qs-card-color-variants:focus-within .qs-card-color-list,.qs-showcase .qs-card-color-variants.is-open .qs-card-color-list { max-width:180px; opacity:1; padding:5px 7px; }

.qs-card-badges {
	position: absolute;
	inset-block-start: .5rem;
	inset-inline-start: .5rem;
	display: flex;
	flex-direction: column;
	gap: .25rem;
	z-index: 1;
}

.qs-badge {
	display: inline-block;
	padding: .125rem .5rem;
	font-size: .6875rem;
	font-weight: 600;
	line-height: 1.6;
	color: #fff;
	background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;
	border-radius: 999px;
	white-space: nowrap;
}

.qs-badge--out {
	background: #6b7280;
}

.qs-badge--low {
	background: #f59e0b;
}

.qs-badge--new {
	background: #10b981;
}

.qs-badge--disc {
	background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;
}

/* ── Beden rozetleri ────────────────────────────────────────────────── */
.qs-card-sizes {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
}

.qs-card-size {
	padding: .0625rem .375rem;
	font-size: .6875rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--qs-sc-text);
	background: rgba(0, 0, 0, .05);
	border-radius: 4px;
}

.qs-card-size--more {
	color: var(--qs-sc-accent);
	background: color-mix(in srgb, var(--qs-sc-accent) 12%, transparent);
}

.qs-card-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: .375rem;
	padding: .75rem;
}

.qs-card-title {
	margin: 0;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--qs-sc-title);
}

.qs-card-title a {
	color: inherit;
	text-decoration: none;
}

.qs-card-title a:hover {
	color: var(--qs-sc-accent);
}

/* Satır sayısı sabit: 2 satırda kes, 3 satırda nokta */
.qs-card-title--2 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.qs-card-title--3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.qs-card-desc {
	margin: 0;
	font-size: .8125rem;
	line-height: 1.45;
	opacity: .75;
}

.qs-card-meta {
	display: flex;
	align-items: center;
	gap: .375rem;
	font-size: .75rem;
}

.qs-card-rating {
	color: #f59e0b;
	font-weight: 600;
}

.qs-card-rating i { font-size: .75rem; }
.qs-card-review-count { margin-inline-start: .2rem; color: var(--qs-sc-text, #4b5563); font-size: .7rem; font-weight: 400; }

.qs-card-stock {
	padding: .0625rem .375rem;
	font-weight: 600;
	border-radius: 999px;
}

.qs-card-stock--in {
	color: #047857;
	background: rgba(16, 185, 129, .12);
}

.qs-card-stock--low {
	color: #b45309;
	background: rgba(245, 158, 11, .16);
}

.qs-card-stock--out {
	color: #6b7280;
	background: rgba(107, 114, 128, .14);
}

.qs-card-price {
	margin-top: auto;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: .375rem;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--qs-sc-title);
}

.qs-card-price-old {
	font-size: .8125rem;
	font-weight: 400;
	text-decoration: line-through;
	opacity: .55;
}

.qs-card-price-new {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--qs-sc-accent);
}

/* Normal ve indirimli fiyatlar bütün vitrin kartlarında kırmızı görünür. */
.qs-showcase .qs-card-price,
.qs-showcase .qs-card-price > span,
.qs-showcase .qs-card-price-old,
.qs-showcase .qs-card-price-new {
	color: var(--qs-red-dark, #6d28d9) !important;
}

.qs-card-actions {
	display: flex;
	gap: .375rem;
	padding: 0 .75rem .75rem;
}

.qs-card-btn {
	flex: 1 1 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .25rem;
	padding: .4375rem .75rem;
	font-size: .8125rem;
	font-weight: 600;
	color: #fff;
	background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;
	border: 1px solid var(--qs-sc-accent);
	border-radius: 6px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: filter .15s ease;
}

.qs-card-btn:hover {
	color: #fff;
	filter: brightness(.93);
}

.qs-card-btn:disabled {
	opacity: .5;
	cursor: not-allowed;
	filter: none;
}

.qs-card-btn--ghost {
	color: var(--qs-sc-accent);
	background: transparent;
}

.qs-card-btn--ghost:hover {
	background: color-mix(in srgb, var(--qs-sc-accent) 8%, transparent);
}

/* ═══════════════════════════════════════════════════════════════════════
   STİL VARYANTLARI
   ═══════════════════════════════════════════════════════════════════════ */

/* FLASH — renkli kenar, geri sayım bandı */
.qs-sc-flash .qs-card {
	border-width: 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}

.qs-sc-flash .qs-card-media {
	aspect-ratio: 4 / 3;
}

.qs-sc-flash .qs-sc-title {
	color: var(--qs-sc-accent);
}

.qs-sc-countdown {
	display: flex;
	align-items: center;
	gap: .375rem;
	margin-bottom: .75rem;
	padding: .5rem .75rem;
	font-size: .8125rem;
	color: #fff;
	background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;
	border-radius: var(--qs-sc-radius);
}

.qs-sc-countdown-unit {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	min-width: 2rem;
	padding: .125rem .25rem;
	background: rgba(0, 0, 0, .22);
	border-radius: 4px;
}

.qs-sc-countdown-num {
	font-size: .9375rem;
	font-weight: 700;
	line-height: 1.1;
}

.qs-sc-countdown-label {
	font-size: .625rem;
	opacity: .85;
}

/* KAMPANYALI — indizimli fiyat ve orijinal fiyat vurgulu */
.qs-sc-campaign .qs-card-price {
	flex-direction: column;
	align-items: flex-start;
	gap: .125rem;
}

.qs-sc-campaign .qs-card-price-old {
	order: -1;
	font-size: .875rem;
	color: #6b7280;
}

/* MİNİMAL — çerçevesiz, yalnız metin */
.qs-showcase.qs-sc-minimal .qs-card {
	background: transparent;
	border: 0;
}

.qs-showcase.qs-sc-minimal .qs-card:hover {
	box-shadow: none;
	transform: none;
}

.qs-showcase.qs-sc-minimal .qs-card-media {
	border-radius: var(--qs-sc-radius);
	overflow: hidden;
}

.qs-showcase.qs-sc-minimal .qs-card-body {
	padding: .625rem 0 0;
}

.qs-showcase.qs-sc-minimal .qs-card-actions {
	padding: 0;
}

/* KART STİLİ: ÖZEL HTML
   Kullanıcı [ürünler] yer tutucusuna istediği düzeni yazabilir. */
.qs-sc-custom .qs-card {
	width: 100%;
}

/* ── "Tümünü Gör" ────────────────────────────────────────────────────── */
.qs-sc-more {
	display: flex;
	justify-content: flex-end;
	margin-top: .875rem;
}

.qs-sc-more-link {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	font-size: .875rem;
	font-weight: 600;
	color: var(--qs-sc-accent);
	text-decoration: none;
}

.qs-sc-more-link:hover {
	text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════════
   DUYARLI DAVRANIŞ
   Mobilde sütun sayısı sabit kalmaz; ekrana sığan kadar daralır.
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1199.98px) {
	.qs-sc-grid {
		grid-template-columns: repeat(min(var(--qs-sc-cols, 4), 3), minmax(0, 1fr));
	}

	.qs-sc-track {
		--qs-sc-visible-cols: min(var(--qs-sc-cols, 4), 3);
	}
}

@media (max-width: 767.98px) {
	.qs-sc-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .375rem;
	}

	.qs-sc-track {
		--qs-sc-visible-cols: 2;
		gap: .375rem;
	}

	.qs-sc-title {
		font-size: 1.125rem;
	}

	/* Karuselde gezinme düğmeleri mobilde gereksiz yere yer kaplar */
	.qs-sc-nav-btn {
		width: 26px;
		height: 26px;
	}

	.qs-card-body {
		padding: .5rem;
	}

	.qs-card-actions {
		padding: 0 .5rem .5rem;
	}
}

@media (max-width: 399.98px) {
	.qs-sc-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.qs-sc-track {
		--qs-sc-visible-cols: 1;
	}
}

/* Hareket duyarlılığı: geçişleri kapat */
@media (prefers-reduced-motion: reduce) {
	.qs-sc-track {
		scroll-behavior: auto;
	}

	.qs-card,
	.qs-sc-nav-btn,
	.qs-sc-tab {
		transition: none;
	}
}

/* Yazdırmada ürün grid'i bozulmasın */
@media print {
	.qs-sc-nav {
		display: none !important;
	}

	.qs-sc-track {
		overflow: visible;
		grid-auto-flow: row;
		grid-auto-columns: auto;
		grid-template-columns: repeat(var(--qs-sc-cols, 4), minmax(0, 1fr));
		grid-template-rows: none;
	}
}

/* ── Kart kök varyantları (kart.twig) ────────────────────────────────── */
.qs-card.is-flash {
	border-color: color-mix(in srgb, var(--qs-sc-accent) 25%, transparent);
}

.qs-card.is-flash .qs-card-media {
	aspect-ratio: 4 / 3;
}

.qs-card-countdown {
	margin-bottom: .5rem;
	padding: .35rem .55rem;
	border-radius: .35rem;
	background: color-mix(in srgb, var(--qs-sc-accent) 12%, transparent);
	color: var(--qs-sc-accent);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	text-align: center;
}

.qs-card.is-campaign .qs-card-price {
	flex-direction: column;
	align-items: flex-start;
	gap: .125rem;
}

.qs-card.is-campaign .qs-card-price-old {
	order: -1;
}

.qs-card.is-minimal {
	background: transparent;
	border: 0;
}

.qs-card.is-minimal:hover {
	box-shadow: none;
	transform: none;
}

.qs-card.is-minimal .qs-card-body {
	padding: .625rem 0 0;
}

.qs-card.is-minimal .qs-card-actions {
	padding: 0;
}