/* =========================================================
   Barra ÚLTIMA HORA (ticker)
   ========================================================= */

.dnk-breaking {
	background: var(--wp--preset--color--dnk-red, #d92d20);
	color: var(--wp--preset--color--dnk-white, #fff);
	overflow: hidden;
}

.dnk-breaking__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.5rem 1.25rem;
}

/* Etiqueta estática a la izquierda. El ticker se desvanece
   justo antes de llegar a ella. */
.dnk-breaking__label {
	flex: 0 0 auto;
	position: relative;
	z-index: 2;
	background: var(--wp--preset--color--dnk-red, #d92d20);
	padding-right: 1rem;
	margin-right: 0.25rem;
	border-right: 1px solid rgba(255, 255, 255, 0.35);
	color: var(--wp--preset--color--dnk-white, #fff);
	font-size: var(--wp--preset--font-size--dnk-meta, 0.8125rem);
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Ventana del ticker con desvanecido: fade-in desde la derecha
   y fade-out hacia la izquierda (antes de ÚLTIMA HORA). */
.dnk-breaking__track-wrap {
	flex: 0 1 70%;
	max-width: 70%;
	min-width: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 3rem, #000 calc(100% - 2rem), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 3rem, #000 calc(100% - 2rem), transparent 100%);
}

.dnk-breaking__track {
	display: flex;
	align-items: center;
	width: max-content;
	white-space: nowrap;
	animation: dnk-breaking-marquee var(--dnk-breaking-duration, 28s) linear infinite;
}

/* Con un solo titular no se duplica: queda fijo y centrado. */
.dnk-breaking--single .dnk-breaking__track {
	animation: none;
	width: 100%;
	justify-content: center;
}

.dnk-breaking__track:hover,
.dnk-breaking__track:focus-within {
	animation-play-state: paused;
}

.dnk-breaking__item {
	display: inline-flex;
	align-items: center;
	color: var(--wp--preset--color--dnk-white, #fff);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--dnk-body, 1.0625rem);
	font-weight: 600;
	line-height: 1.4;
}

.dnk-breaking__item:hover,
.dnk-breaking__item:focus {
	color: var(--wp--preset--color--dnk-white, #fff);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.dnk-breaking__sep {
	flex: 0 0 auto;
	margin: 0 10px;
	color: rgba(255, 255, 255, 0.7);
	font-weight: 700;
}

@keyframes dnk-breaking-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.dnk-breaking__track {
		animation: none;
	}
}

/* =========================================================
   Placeholder en el editor de bloques
   ========================================================= */

.dnk-breaking-editor {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem 1.25rem;
	border-radius: 8px;
	background: #fff0e5;
	border: 1px dashed var(--wp--preset--color--dnk-orange, #ff5c00);
	color: #171717;
}

.dnk-breaking-editor__label {
	flex: 0 0 auto;
	padding: 0.3rem 0.75rem;
	border-radius: 6px;
	background: var(--wp--preset--color--dnk-red, #d92d20);
	color: #fff;
	font-size: var(--wp--preset--font-size--dnk-meta, 0.8125rem);
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.dnk-breaking-editor__note {
	font-size: 0.9rem;
	opacity: 0.85;
}