/**
 * El Post Liveblog - Estilos del front-end
 *
 * Identidad visual El Post: Montserrat, paleta de marca, mobile-first.
 * Todo el CSS esta scopeado bajo .elp-liveblog para no chocar con el tema.
 */

.elp-liveblog-wrap {
	max-width: 720px;
	margin: 0 auto;
	padding: 24px 16px 48px;
}

.elp-liveblog,
.elp-liveblog * {
	box-sizing: border-box;
}

.elp-liveblog {
	font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
	color: #1A1A2E;
}

/* ---------- Cabecera del evento ---------- */
.elp-lb-header {
	border-bottom: 2px solid #E5E7EB;
	padding-bottom: 20px;
	margin-bottom: 24px;
}

.elp-lb-live-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: #E63B3B;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	padding: 5px 12px;
	border-radius: 4px;
	margin-bottom: 14px;
}

.elp-lb-live-dot {
	width: 8px;
	height: 8px;
	background: #fff;
	border-radius: 50%;
	animation: elp-lb-pulse 1.6s ease-in-out infinite;
}

@keyframes elp-lb-pulse {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.3; }
}

.elp-lb-title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 12px 0;
	color: #1A1A2E;
}

.elp-lb-intro {
	font-size: 16px;
	line-height: 1.6;
	color: #6B7280;
}

.elp-lb-intro p {
	margin: 0 0 10px 0;
}

.elp-lb-last-update {
	font-size: 13px;
	color: #6B7280;
	margin: 14px 0 0 0;
	font-weight: 600;
}

/* ---------- Etiqueta de seccion ---------- */
.elp-lb-section-label {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #3B6BE3;
	margin: 0 0 14px 0;
}

/* ---------- Seccion de fijadas ---------- */
.elp-lb-pinned {
	margin-bottom: 28px;
}

/* ---------- Cada actualizacion ---------- */
.elp-lb-update {
	position: relative;
	padding: 0 0 24px 24px;
	margin-bottom: 24px;
	border-left: 3px solid #E5E7EB;
}

.elp-lb-update:last-child {
	border-left-color: transparent;
	padding-bottom: 0;
	margin-bottom: 0;
}

/* Punto en la linea de tiempo */
.elp-lb-update::before {
	content: '';
	position: absolute;
	left: -8px;
	top: 4px;
	width: 13px;
	height: 13px;
	background: #3B6BE3;
	border: 3px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 2px #3B6BE3;
}

/* Variante fijada */
.elp-lb-update--pinned {
	background: #F5F7FA;
	border-left: 3px solid #3B6BE3;
	border-radius: 0 10px 10px 0;
	padding: 16px 16px 16px 20px;
}

.elp-lb-update--pinned::before {
	left: -8px;
	top: 18px;
	background: #E63B3B;
	box-shadow: 0 0 0 2px #E63B3B;
}

/* Meta (hora + tag) */
.elp-lb-update-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.elp-lb-pin-tag {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #fff;
	background: #3B6BE3;
	padding: 2px 8px;
	border-radius: 3px;
}

.elp-lb-time {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.elp-lb-time-hour {
	font-size: 16px;
	font-weight: 700;
	color: #1C3B7A;
	font-variant-numeric: tabular-nums;
}

.elp-lb-time-date {
	font-size: 12px;
	color: #6B7280;
	font-variant-numeric: tabular-nums;
}

/* Cuerpo */
.elp-lb-update-title {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 10px 0;
	color: #1A1A2E;
}

.elp-lb-update-image {
	margin: 0 0 12px 0;
	border-radius: 8px;
	overflow: hidden;
}

.elp-lb-update-image img {
	display: block;
	width: 100%;
	height: auto;
}

.elp-lb-update-text {
	font-size: 15px;
	line-height: 1.65;
	color: #1A1A2E;
}

.elp-lb-update-text p {
	margin: 0 0 12px 0;
}

.elp-lb-update-text p:last-child {
	margin-bottom: 0;
}

/* Estado vacio */
.elp-lb-empty {
	font-size: 15px;
	color: #6B7280;
	text-align: center;
	padding: 32px 0;
}

/* ---------- Desktop ---------- */
@media (min-width: 768px) {
	.elp-lb-title {
		font-size: 36px;
	}
	.elp-lb-update-title {
		font-size: 21px;
	}
}

/* ---------- Estado: cobertura finalizada ---------- */
.elp-lb-live-badge--closed {
	background: #6B7280;
}

/* ---------- Pie de cabecera (ultima act. + compartir) ---------- */
.elp-lb-header-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 14px;
}

.elp-lb-header-foot .elp-lb-last-update {
	margin: 0;
}

/* ---------- Boton compartir ---------- */
.elp-lb-share {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #3B6BE3;
	background: #fff;
	border: 1.5px solid #3B6BE3;
	border-radius: 4px;
	padding: 7px 14px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
	min-height: 38px;
}

.elp-lb-share:hover {
	background: #3B6BE3;
	color: #fff;
}

.elp-lb-share:active {
	transform: scale(0.97);
}

.elp-lb-share--done {
	background: #10B981;
	border-color: #10B981;
	color: #fff;
}

.elp-lb-share-icon {
	font-size: 15px;
	line-height: 1;
}

/* ============================================================
   Shortcode [elpost_coberturas] - tarjetas para el home
   ============================================================ */
.elp-cob-list {
	font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 720px;
	margin: 0 auto;
}

.elp-cob-list-title {
	font-size: 18px;
	font-weight: 700;
	color: #1A1A2E;
	margin: 0 0 4px 0;
}

.elp-cob-card {
	display: flex;
	align-items: stretch;
	gap: 0;
	background: #fff;
	border: 1px solid #E5E7EB;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.elp-cob-card:hover {
	border-color: #3B6BE3;
	box-shadow: 0 2px 10px rgba(59, 107, 227, 0.12);
}

.elp-cob-thumb {
	flex: 0 0 96px;
	width: 96px;
	background: #F5F7FA;
	overflow: hidden;
}

.elp-cob-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.elp-cob-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 14px 16px;
	min-width: 0;
}

.elp-cob-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	align-self: flex-start;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #fff;
	background: #E63B3B;
	padding: 3px 9px;
	border-radius: 4px;
}

.elp-cob-badge--closed {
	background: #6B7280;
}

.elp-cob-dot {
	width: 7px;
	height: 7px;
	background: #fff;
	border-radius: 50%;
	animation: elp-lb-pulse 1.6s ease-in-out infinite;
}

.elp-cob-card-title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.35;
	color: #1A1A2E;
}

@media (min-width: 768px) {
	.elp-cob-thumb {
		flex-basis: 120px;
		width: 120px;
	}
	.elp-cob-card-title {
		font-size: 18px;
	}
}

/* ============================================================
   Variante formato="portada" - calza junto a notas de portada
   Miniatura cuadrada izquierda + titular derecha, ancho 100%
   ============================================================ */
.elp-cob-list--portada {
	max-width: 100%;
	margin: 0;
	gap: 0;
}

/* Separacion inferior para que no quede pegado a la nota de abajo. */
.elp-cob-list--portada .elp-cob-card {
	width: 100%;
	border-radius: 8px;
	margin-bottom: 12px;
}

/* Sin foto en formato portada: solo badge + titular grande,
   se diferencia visualmente de las notas con foto del resto. */
.elp-cob-list--portada .elp-cob-thumb {
	display: none;
}

.elp-cob-list--portada .elp-cob-body {
	flex: 1 1 100%;
	min-width: 0;
	justify-content: center;
	padding: 14px 18px;
	gap: 8px;
}

.elp-cob-list--portada .elp-cob-card-title {
	font-size: 20px;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Ajustes para movil sin foto: titulo mas chico que en desktop,
   pero a\u00fan generoso. */
@media (max-width: 480px) {
	.elp-cob-list--portada .elp-cob-card-title {
		font-size: 17px;
	}
	.elp-cob-list--portada .elp-cob-body {
		padding: 12px 14px;
		gap: 6px;
	}
	/* Badge un poco mas compacto */
	.elp-cob-list--portada .elp-cob-badge {
		font-size: 10px;
		padding: 2px 7px;
	}
}