/* =====================================================================
   KAMPANYALI ÜRÜNLER — [uns_kampanyali_urunler]
   Başlık/sekme düzeni, panel ve kartlar mevcut "sekmeli vitrin"
   bileşenleridir (uns-magaza.css); burada yalnızca bu bölümün çerçevesi,
   kampanya pili ve sekmelerin hap görünümü var.
   ===================================================================== */

.uns-kamp-blok {
	background: #fff;
	border: 1px solid var(--uns-cizgi, #DCE2EB);
	border-radius: 24px;
	padding: 28px 32px 32px;
	box-shadow: 0 10px 30px rgba(21, 34, 50, .04);
}

.uns-kamp-blok .uns-blok__ust {
	align-items: center;
	margin-bottom: 24px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--uns-cizgi, #DCE2EB);
}

.uns-kamp-baslik {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}

.uns-kamp-baslik .uns-blok__baslik { margin: 0; }

/* Başlığın yanındaki kampanya pili — kartlardaki kampanya rozetiyle aynı
   bakır tonu (bkz. .uns-urun-kart__rozet.is-kampanya). */
.uns-kamp-pil {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 13px;
	border-radius: 999px;
	background: linear-gradient(135deg, #B8683F, #7D4229);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .2px;
	white-space: nowrap;
	box-shadow: 0 4px 12px rgba(125, 66, 41, .28);
}

.uns-kamp-pil svg { flex-shrink: 0; }

/* ---------- Sekmeler: bağımsız hap düğmeler (sağda) ---------- */

.uns-kamp-blok .uns-sekme-cubuk {
	background: transparent;
	padding: 0;
	gap: 8px;
	flex-wrap: nowrap;
	overflow-x: auto;
	max-width: 100%;
	scrollbar-width: none;
}

.uns-kamp-blok .uns-sekme-cubuk::-webkit-scrollbar { display: none; }

/* Elementor Kit ve tema, <button>'lara kendi yazı rengini (#223954) ve
   hover zeminini veriyor — aktif sekmede beyaz yazı kayboluyordu. Bilerek
   !important (bkz. slider okları / "+" düğmesi için aynı sorun). */
.uns-kamp-blok .uns-sekme-cubuk__buton {
	flex-shrink: 0;
	padding: 8px 18px;
	border: 1px solid var(--uns-cizgi, #DCE2EB) !important;
	border-radius: 999px;
	background: var(--uns-yumusak, #F4F1ED) !important;
	color: var(--uns-soluk, #64748B) !important;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
}

.uns-kamp-blok .uns-sekme-cubuk__buton:hover,
.uns-kamp-blok .uns-sekme-cubuk__buton:focus-visible {
	background: var(--uns-yumusak, #F4F1ED) !important;
	color: var(--uns-metin, #141A22) !important;
	border-color: var(--uns-renk, #1B3A6B) !important;
}

.uns-kamp-blok .uns-sekme-cubuk__buton.is-aktif,
.uns-kamp-blok .uns-sekme-cubuk__buton.is-aktif:hover,
.uns-kamp-blok .uns-sekme-cubuk__buton.is-aktif:focus-visible {
	background: var(--uns-metin, #141A22) !important;
	color: #fff !important;
	border-color: var(--uns-metin, #141A22) !important;
	box-shadow: 0 4px 12px rgba(21, 34, 50, .15);
}

/* ---------- "2 satır" kuralı ----------
   Sunucu her panele en fazla sutun × satir ürün basar (4 × 2 = 8). Ekran
   daraldıkça ızgara 4 → 3 → 2 sütuna iner; satır sayısı 2 kalsın diye
   fazla kartlar kesilir. Yalnızca satir="2" için (sınıf PHP'den gelir). */

@media (max-width: 1024px) {
	.uns-kamp-blok--satir2 .uns-izgara--4 > .uns-urun-kart:nth-child(n+7) { display: none; }
}

@media (max-width: 782px) {
	.uns-kamp-blok--satir2 .uns-izgara--4 > .uns-urun-kart:nth-child(n+5),
	.uns-kamp-blok--satir2 .uns-izgara--3 > .uns-urun-kart:nth-child(n+5) { display: none; }

	.uns-kamp-blok {
		padding: 20px 14px 22px;
		border-radius: 18px;
	}

	.uns-kamp-blok .uns-blok__ust {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		margin-bottom: 18px;
		padding-bottom: 14px;
	}

	.uns-kamp-blok .uns-blok__baslik { font-size: 22px; }
	.uns-kamp-blok .uns-sekme-cubuk { width: 100%; }
}

/* ---------- "Tümünü Gör" ---------- */

.uns-kamp-alt {
	display: flex;
	justify-content: center;
	margin-top: 24px;
}

/* Tema/Kit a:hover rengini ve altı çizgisini ezmesin diye özgüllük yüksek,
   renkler açıkça !important (bkz. diğer düğmelerde aynı sorun). */
.uns-kamp-blok .uns-kamp-tumu {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 26px;
	border: 1px solid var(--uns-cizgi, #DCE2EB);
	border-radius: 999px;
	background: #fff;
	color: var(--uns-metin, #141A22) !important;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none !important;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.uns-kamp-blok .uns-kamp-tumu:hover,
.uns-kamp-blok .uns-kamp-tumu:focus-visible {
	background: var(--uns-metin, #141A22);
	border-color: var(--uns-metin, #141A22);
	color: #fff !important;
}

.uns-kamp-blok .uns-kamp-tumu svg { transition: transform .18s ease; }
.uns-kamp-blok .uns-kamp-tumu:hover svg { transform: translateX(3px); }

@media (max-width: 782px) {
	.uns-kamp-alt { margin-top: 18px; }
	.uns-kamp-blok .uns-kamp-tumu { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.uns-kamp-blok .uns-kamp-tumu, .uns-kamp-blok .uns-kamp-tumu svg { transition: none; }
}
