.btk-wrapper {
	--btk-bg: #1e293b;
	--btk-text: #ffffff;
	--btk-icon: #38bdf8;
	--btk-fs: 16px;
	--btk-h: 44px;
	--btk-gap: 48px;
	--btk-duration: 25s;

	width: 100%;
	height: var(--btk-h);
	background-color: var(--btk-bg);
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;
	box-sizing: border-box;
}

.btk-track {
	display: flex;
	white-space: nowrap;
	will-change: transform;
	animation-duration: var(--btk-duration);
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

/* Izquierda -> Derecha: el texto entra por la izquierda y avanza hacia la derecha */
.btk-dir-ltr .btk-track {
	animation-name: btk-scroll-ltr;
}

/* Derecha -> Izquierda: el texto se desplaza hacia la izquierda (efecto clásico de noticias) */
.btk-dir-rtl .btk-track {
	animation-name: btk-scroll-rtl;
}

@keyframes btk-scroll-rtl {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

@keyframes btk-scroll-ltr {
	from { transform: translateX(-50%); }
	to   { transform: translateX(0); }
}

.btk-track-inner {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	padding-right: var(--btk-gap);
}

.btk-pause-hover:hover .btk-track {
	animation-play-state: paused;
}

.btk-item {
	display: inline-flex;
	align-items: center;
	font-size: var(--btk-fs);
	color: var(--btk-text);
	line-height: 1;
}

.btk-item-link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: inherit;
}

.btk-item-link:hover .btk-item-text {
	text-decoration: underline;
}

.btk-item-icon {
	margin-right: 8px;
	color: var(--btk-icon);
	font-size: calc(var(--btk-fs) + 4px);
	width: auto;
	height: auto;
	display: inline-flex;
	align-items: center;
}

.btk-item-icon-img {
	width: calc(var(--btk-fs) + 8px);
	height: calc(var(--btk-fs) + 8px);
	object-fit: contain;
	border-radius: 3px;
}

.btk-item-text {
	white-space: nowrap;
}

.btk-separator {
	display: inline-block;
	margin: 0 var(--btk-gap);
	color: var(--btk-text);
	opacity: 0.5;
	font-size: var(--btk-fs);
}

@media (max-width: 600px) {
	.btk-wrapper {
		--btk-gap: 24px;
	}
}
