/* Batuvalve İkon Kutusu — uicore-icon-box'ın kullanılan düzenlerinin birebir karşılığı.
   🔑 Yalnız iki konum var: `top` (varsayılan, 251 kayıt) ve `left` (91 kayıt).
      bottom/right ve tüm animasyon sınıfları sitede HİÇ kullanılmıyordu, taşınmadı.
   🔴 Kutunun arka planı / kenarlığı / dolgusu buraya YAZILMAZ — Elementor'ün
      Advanced sekmesi zaten `.elementor-widget-container`a basıyor. */

.btvlv-ib {
	--btvlv-ib-medya: 50px;
	--btvlv-ib-ara: 9px;
	--btvlv-ib-hiza: left;
	position: relative;
	width: 100%;
	text-align: var(--btvlv-ib-hiza);
}

/* ── Medya ─────────────────────────────────────────────────────────
   `min-width:fit-content` + `box-sizing:content-box`: dolgu verilen ikon
   kutusu daralmasın; uicore'daki davranışın aynısı. */
.btvlv-ib__ikon {
	display: inline-block;
	min-width: fit-content;
	height: fit-content;
	box-sizing: content-box;
	overflow: hidden;
	transition: background-color .3s cubic-bezier(.24, 1, .3, 1),
		border-radius .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__ikon > * {
	display: block;
	margin: auto;
	transition: opacity .3s cubic-bezier(.24, 1, .3, 1),
		filter .3s cubic-bezier(.24, 1, .3, 1),
		color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__ikon i {
	font-size: var(--btvlv-ib-medya);
	width: var(--btvlv-ib-medya);
	height: var(--btvlv-ib-medya);
	text-align: center;
}

.btvlv-ib__ikon svg {
	width: var(--btvlv-ib-medya);
	height: var(--btvlv-ib-medya);
}

/* 🔴 `img` yalnız GENİŞLİK alır; yükseklik oranla gelir. uicore da öyle
      yapıyordu — sabit yükseklik verilirse logolar eziliyor. */
.btvlv-ib__ikon img {
	width: var(--btvlv-ib-medya);
	height: auto;
}

/* ── Başlık / metin ────────────────────────────────────────────── */
.btvlv-ib__baslik-kutu { width: 100%; }

.btvlv-ib__baslik {
	margin: 0 0 10px;
	transition: color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__baslik a { color: inherit; text-decoration: none; }

/* 🔴 Temanın `a:hover{color:var(--uicore-primary-color)}` kuralı aynı özgüllükte
      ve sonra yükleniyor: başlık linki hover'da lacivert oluyor, lacivert kutuda
      yazı kayboluyordu; widget'taki "Hover" rengi de işlemiyordu (o rengi
      başlığa veriyor, link devralmıyordu). */
.btvlv-ib__baslik a:hover,
.btvlv-ib__baslik a:focus { color: inherit; }

.btvlv-ib__alt {
	font-size: 14px;
	transition: color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__govde { position: relative; }

.btvlv-ib__aciklama {
	transition: color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__aciklama p { margin: 0; color: inherit; }
.btvlv-ib__aciklama > p + p { margin-top: .75em; }

/* ── Devamı ────────────────────────────────────────────────────── */
.btvlv-ib__devam {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	transition: background-color .3s cubic-bezier(.24, 1, .3, 1),
		color .3s cubic-bezier(.24, 1, .3, 1),
		border-color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-ib__devam-ikon { display: inline-flex; }
.btvlv-ib__devam-ikon svg { width: 1em; height: 1em; vertical-align: middle; }

/* ── Konum: ÜST (varsayılan) ───────────────────────────────────── */
.btvlv-ib-top .btvlv-ib__ikon { margin-bottom: var(--btvlv-ib-ara); }
.btvlv-ib-top .btvlv-ib__govde { width: 100%; }

/* ── Konum: SOL ────────────────────────────────────────────────────
   uicore: `.ui-e-left:not(.ui-e-inline-yes) .ui-e-ico-box{flex-direction:row}`
   İkon sarmalayıcısı içerik kadar yer kaplar, gövde kalanı alır. */
.btvlv-ib-left .btvlv-ib {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
}

.btvlv-ib-left .btvlv-ib__ust { width: fit-content; flex: 0 0 auto; }
.btvlv-ib-left .btvlv-ib__ikon { margin-right: var(--btvlv-ib-ara); }
.btvlv-ib-left .btvlv-ib__govde { flex: 1 1 auto; min-width: 0; }

/* 🔴 Mobilde SOL düzen alt alta iner — dar ekranda ikon+metin yan yana
      sığmıyor, uicore'un `ui-e-mobile-yes` davranışının karşılığı. */
@media (max-width: 767px) {
	.btvlv-ib-left .btvlv-ib { flex-direction: column; }
	.btvlv-ib-left .btvlv-ib__ikon {
		margin-right: 0;
		margin-bottom: var(--btvlv-ib-ara);
	}
}

/* ═══ İKON LİSTESİ ═════════════════════════════════════════════════
   uicore-icon-list'in kullanılan düzeni: tek/çok sütunlu ızgara, ikon
   solda (varsayılan) veya sağda. Numara ve bağlayıcı çizgi taşınmadı —
   34 örneğin hiçbirinde kullanılmıyordu. */

.btvlv-il {
	--btvlv-il-ara: 0px;
	--btvlv-il-ikon-ara: 18px;
	--btvlv-il-ikon: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--btvlv-il-ara);
}

.btvlv-il > li { list-style-type: none; }

.btvlv-il__satir {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	text-decoration: none;
	color: inherit;
	transition: all .3s cubic-bezier(.24, 1, .3, 1);
}

/* 🔑 uicore isaretlemede ikon METINDEN SONRA geliyordu, sinifla one
      aliniyordu. Bizde ikon zaten once basiliyor; `right` secilince
      ters cevriliyor. Gorunum ayni, DOM daha dogal. */
.btvlv-il-ikon-right .btvlv-il__satir { flex-direction: row-reverse; }

.btvlv-il__ikon {
	display: inline-flex;
	align-items: center;
	height: max-content;
	flex: 0 0 auto;
	margin-right: var(--btvlv-il-ikon-ara);
	color: var(--btvlv-il-ikon-renk, inherit);
	transition: color .3s cubic-bezier(.24, 1, .3, 1);
}

.btvlv-il-ikon-right .btvlv-il__ikon {
	margin-right: 0;
	margin-left: var(--btvlv-il-ikon-ara);
}

.btvlv-il__ikon i {
	font-size: var(--btvlv-il-ikon);
	width: var(--btvlv-il-ikon);
	height: var(--btvlv-il-ikon);
	text-align: center;
}

.btvlv-il__ikon svg {
	width: var(--btvlv-il-ikon);
	height: var(--btvlv-il-ikon);
	fill: var(--btvlv-il-ikon-renk, currentColor);
}

.btvlv-il__govde { display: block; width: 100%; min-width: 0; }
.btvlv-il__baslik { display: block; margin: 0; }
.btvlv-il__metin { display: block; margin: 0; }