/**
 * Batuvalve Tag Cloud — tasarımlar.
 *
 * Her kural tek sınıf + eleman seviyesinde (0,1,1) tutuldu; Elementor'un
 * `.elementor-element-xxx .batuvalve-tag-cloud a` kuralları (0,2,1) bunları
 * her zaman yener, yani Stil sekmesindeki her ayar tasarımı ezebilir.
 */

.batuvalve-tag-cloud {
	--btvlv-tag-accent: #2382C4;
	--btvlv-tag-soft:   #eef2f7;
	--btvlv-tag-line:   #d6dde6;
	--btvlv-tag-ink:    #33404d;
	--btvlv-tag-gap:    8px;
	--btvlv-tag-cols:   3;

	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--btvlv-tag-gap);
}

.batuvalve-tag-cloud a {
	display: inline-flex;
	align-items: center;
	/* WCAG 2.2 dokunma hedefi asgarisi (olculdu: onceki yukseklik 18px). */
	min-height: 24px;
	gap: 6px;
	text-decoration: none;
	line-height: 1.35;
	transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.btvlv-tag-empty {
	opacity: .7;
	font-style: italic;
}

/* Başlık yan yanayken araya boşluk (konum sınıfları batuvalve-widgets.css'te). */
.btvlv-tag-cloud-wrap.btvlv-title-pos-left,
.btvlv-tag-cloud-wrap.btvlv-title-pos-right {
	gap: 12px;
}

/* ── Tasarım: Satır içi (varsayılan) ─────────────────────────────── */
.btvlv-tags-inline a       { color: var(--btvlv-tag-ink); }
.btvlv-tags-inline a:hover { color: var(--btvlv-tag-accent); }

/* ── Tasarım: Hap ────────────────────────────────────────────────── */
.btvlv-tags-pill a {
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--btvlv-tag-soft);
	color: var(--btvlv-tag-ink);
}
.btvlv-tags-pill a:hover {
	background: var(--btvlv-tag-accent);
	color: #fff;
}

/* ── Tasarım: Çerçeve ────────────────────────────────────────────── */
.btvlv-tags-outline a {
	padding: 5px 13px;
	border: 1px solid var(--btvlv-tag-line);
	border-radius: 4px;
	color: var(--btvlv-tag-ink);
}
.btvlv-tags-outline a:hover {
	border-color: var(--btvlv-tag-accent);
	color: var(--btvlv-tag-accent);
}

/* ── Tasarım: Dolu ───────────────────────────────────────────────── */
/* Hover'da sabit renk yerine parlaklık: Stil sekmesinden arka plan
   değiştirildiğinde hover kendiliğinden uyumlu kalır. */
.btvlv-tags-solid a {
	padding: 6px 14px;
	border-radius: 4px;
	background: var(--btvlv-tag-accent);
	color: #fff;
}
.btvlv-tags-solid a:hover {
	filter: brightness(.88);
	color: #fff;
}

/* ── Tasarım: Diyez ──────────────────────────────────────────────── */
.btvlv-tags-hash a { color: var(--btvlv-tag-ink); }
.btvlv-tags-hash .btvlv-tag-text::before {
	content: "#";
	opacity: .55;
	margin-right: 1px;
}
.btvlv-tags-hash a:hover { color: var(--btvlv-tag-accent); }

/* ── Tasarım: Izgara ─────────────────────────────────────────────── */
.btvlv-tags-grid {
	display: grid;
	grid-template-columns: repeat(var(--btvlv-tag-cols), minmax(0, 1fr));
}
.btvlv-tags-grid a {
	justify-content: center;
	text-align: center;
	padding: 10px 12px;
	border-radius: 4px;
	background: var(--btvlv-tag-soft);
	color: var(--btvlv-tag-ink);
}
.btvlv-tags-grid a:hover {
	background: var(--btvlv-tag-accent);
	color: #fff;
}

/* ── Tasarım: Liste ──────────────────────────────────────────────── */
.btvlv-tags-list {
	flex-direction: column;
	align-items: stretch;
}
.btvlv-tags-list a {
	justify-content: space-between;
	padding: 9px 2px;
	border-bottom: 1px solid var(--btvlv-tag-line);
	color: var(--btvlv-tag-ink);
}
.btvlv-tags-list a:last-child { border-bottom: 0; }
.btvlv-tags-list a:hover      { color: var(--btvlv-tag-accent); }

/* ── Tasarım: Bulut ──────────────────────────────────────────────── */
/* --btvlv-tag-fs widget tarafından etiket başına yazılır. */
.btvlv-tags-cloud { align-items: baseline; }
.btvlv-tags-cloud a {
	font-size: var(--btvlv-tag-fs, 16px);
	line-height: 1.2;
	color: var(--btvlv-tag-ink);
}
.btvlv-tags-cloud a:hover { color: var(--btvlv-tag-accent); }

/* ── Yazı sayısı ─────────────────────────────────────────────────── */
.btvlv-tag-count {
	font-size: .82em;
	opacity: .75;
}

.btvlv-tag-count.btvlv-count-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.7em;
	height: 1.7em;
	padding: 0 .45em;
	border-radius: 999px;
	background: rgba(0, 0, 0, .08);
	font-size: .72em;
	line-height: 1;
	opacity: 1;
}

/* Koyu zeminde rozet okunur kalsın. */
.btvlv-tags-solid .btvlv-tag-count.btvlv-count-badge,
.btvlv-tags-pill a:hover .btvlv-tag-count.btvlv-count-badge,
.btvlv-tags-grid a:hover .btvlv-tag-count.btvlv-count-badge {
	background: rgba(255, 255, 255, .25);
}

/* ── Başlık şeridi: ikon ─────────────────────────────────────────── */
/* 🔑 Flex YALNIZ ikon varken açılıyor. Koşulsuz verilseydi başlık tam
   genişlikten çıkıp içeriğe daralırdı; widget'ın ekli olduğu ikonsuz
   sayfaların hizası bozulurdu. Arka plan/köşe/dolgu kontrolleri blok
   düzende de çalıştığı için şerit görünümü ikon olmadan da kurulabilir. */
.btvlv-tag-cloud-title.btvlv-title-has-icon {
	display: flex;
	align-items: center;
	gap: 12px;
}
.btvlv-tag-cloud-title.btvlv-title-has-icon > .btvlv-tag-title {
	margin: 0;
}

.btvlv-tag-title-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	font-size: 24px;
	line-height: 1;
}
/* SVG'ye 1em: tek "İkon puntosu" kuralı hem ikon fontunu hem SVG'yi ölçekler. */
.btvlv-tag-title-icon svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}
.btvlv-tag-title-icon i {
	font-size: inherit;
	line-height: 1;
}
