/* ============================================================
   Publireportajes — contenido patrocinado
   ============================================================ */

/* ── Variables de color dorado ───────────────────────────── */
:root {
	--publi-oro:     #b8820a;
	--publi-oro-cl:  #d4a832;
	--publi-bg:      #fffdf0;
	--publi-borde:   rgba(184, 130, 10, 0.22);
}

/* ── Badge — etiqueta "Publireportaje" ───────────────────── */
.nl-publi-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 9px 3px 7px;
	background: linear-gradient(135deg, var(--publi-oro) 0%, var(--publi-oro-cl) 100%);
	color: #fff;
	font-family: var(--fuente-ui);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-radius: 4px;
	line-height: 1;
	white-space: nowrap;
	vertical-align: middle;
}

.nl-publi-badge svg { flex-shrink: 0; }

/* ── Card estándar patrocinada ───────────────────────────── */
.nl-card--publi {
	background: var(--publi-bg);
	border-color: var(--publi-borde) !important;
	position: relative;
	overflow: hidden;
}

/* Franja dorada superior */
.nl-card--publi::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--publi-oro) 0%, var(--publi-oro-cl) 50%, var(--publi-oro) 100%);
	z-index: 1;
}

.nl-card--publi:hover { box-shadow: 0 4px 20px rgba(184, 130, 10, 0.14) !important; }

/* Badge dentro de la card estándar */
.nl-card--publi .nl-publi-badge {
	margin-bottom: 6px;
	display: inline-flex;
}

/* ── Badge en hero card — inline junto al meta ── */
.nl-card-featured__meta .nl-publi-badge {
	flex-shrink: 0;
}

/* ── Aviso en artículo ───────────────────────────────────── */
.nl-publi-aviso {
	display: flex;
	align-items: center;
	gap: 10px;
	background: linear-gradient(135deg, #fffdf0 0%, #fff9dc 100%);
	border: 1px solid var(--publi-borde);
	border-left: 3px solid var(--publi-oro);
	border-radius: 0 10px 10px 0;
	padding: 10px 16px;
	margin-bottom: 20px;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}

.nl-publi-aviso__icono {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	background: linear-gradient(135deg, var(--publi-oro), var(--publi-oro-cl));
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
}

.nl-publi-aviso__icono svg { width: 14px; height: 14px; }

.nl-publi-aviso__texto {
	font-family: var(--fuente-ui);
	font-size: 12px;
	font-weight: 600;
	color: var(--publi-oro);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.3;
}

.nl-publi-aviso__texto span {
	display: block;
	font-weight: 400;
	font-size: 11px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--gris, #6b7280);
	margin-top: 1px;
}

/* ── Bloque "Patrocinado por" ────────────────────────────── */
.nl-publi-patrocinador {
	display: flex;
	align-items: center;
	gap: 18px;
	background: linear-gradient(135deg, #fffdf0 0%, #fffae0 100%);
	border: 1px solid var(--publi-borde);
	border-radius: 14px;
	padding: 18px 24px;
	margin: 28px auto;
	max-width: 720px;
	position: relative;
	overflow: hidden;
}

.nl-publi-patrocinador::after {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--publi-oro), var(--publi-oro-cl), var(--publi-oro));
}

.nl-publi-patrocinador__logo-wrap {
	flex-shrink: 0;
	width: 80px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid rgba(184, 130, 10, 0.15);
	border-radius: 8px;
	padding: 6px;
	overflow: hidden;
}

.nl-publi-patrocinador__logo-wrap img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	display: block;
}

.nl-publi-patrocinador__info { flex: 1; min-width: 0; }

.nl-publi-patrocinador__label {
	display: block;
	font-family: var(--fuente-ui);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--publi-oro);
	margin-bottom: 3px;
}

.nl-publi-patrocinador__nombre {
	display: block;
	font-family: var(--fuente-ui);
	font-size: 16px;
	font-weight: 700;
	color: var(--tinta, #1d2327);
	text-decoration: none;
	transition: color 0.15s;
}

.nl-publi-patrocinador__nombre:hover { color: var(--publi-oro); }

.nl-publi-patrocinador__web {
	display: inline-block;
	margin-top: 3px;
	font-size: 12px;
	color: var(--gris, #6b7280);
	text-decoration: none;
	transition: color 0.15s;
}

.nl-publi-patrocinador__web:hover { color: var(--publi-oro); text-decoration: underline; }

/* Solo empresa (sin logo) */
.nl-publi-patrocinador--sin-logo .nl-publi-patrocinador__logo-wrap { display: none; }

@media (max-width: 480px) {
	.nl-publi-patrocinador {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		padding: 16px;
	}
}

/* ── Dark mode ───────────────────────────────────────────── */
.nl-dark-mode .nl-card--publi,
.ct-dark-mode .nl-card--publi {
	background: color-mix(in srgb, #b8820a 8%, #13101a);
	border-color: rgba(184, 130, 10, 0.2) !important;
}

.nl-dark-mode .nl-publi-aviso,
.ct-dark-mode .nl-publi-aviso,
.nl-dark-mode .nl-publi-patrocinador,
.ct-dark-mode .nl-publi-patrocinador {
	background: color-mix(in srgb, #b8820a 8%, #1a1710);
	border-color: rgba(184, 130, 10, 0.2);
}

.nl-dark-mode .nl-publi-patrocinador__logo-wrap,
.ct-dark-mode .nl-publi-patrocinador__logo-wrap {
	background: rgba(255,255,255,0.07);
	border-color: rgba(184, 130, 10, 0.15);
}

.nl-dark-mode .nl-publi-patrocinador__nombre,
.ct-dark-mode .nl-publi-patrocinador__nombre { color: rgba(255,255,255,0.9); }

.nl-dark-mode .nl-publi-aviso__texto span,
.ct-dark-mode .nl-publi-aviso__texto span { color: rgba(255,255,255,0.5); }
