/* Podcast player component (PulsoTechCo) — dark by default, .light-mode overrides, same palette as theme-3.css */

.podcast-player{
	background:#1e2738;
	border-radius:.75rem;
	padding:1.75rem;
	margin:1.5rem 0 2.5rem;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:1.25rem;
	box-shadow:0 .5rem 1.5rem rgba(0,0,0,.25);
	max-width:100%;
	box-sizing:border-box;
}
@media (max-width:420px){
	.podcast-player{ padding:1.25rem .9rem; gap:1rem; }
}
.light-mode .podcast-player{
	background:#fff;
	box-shadow:0 .5rem 1.5rem rgba(18,24,34,.08);
	border:1px solid #e4e9f2;
}

/* Cover tile + equalizer */
.podcast-cover{
	position:relative;
	width:96px;
	height:96px;
	border-radius:1rem;
	background:linear-gradient(145deg,#3b7eeb,#1d4ed8);
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	overflow:hidden;
	box-shadow:0 .35rem 1rem rgba(59,126,235,.35);
}
.podcast-cover .podcast-cover-icon{
	color:rgba(255,255,255,.9);
	font-size:2.1rem;
}
.podcast-cover .podcast-eq{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	gap:4px;
	height:34px;
	padding-bottom:6px;
	background:linear-gradient(to top, rgba(10,18,32,.35), transparent);
}
.podcast-cover .eq-bar{
	width:4px;
	height:6px;
	border-radius:2px;
	background:#fff;
	opacity:.85;
	animation:podcast-eq 1s ease-in-out infinite;
	animation-play-state:paused;
}
.podcast-player.is-playing .eq-bar{ animation-play-state:running; }
.eq-bar:nth-child(1){ animation-duration:.8s; }
.eq-bar:nth-child(2){ animation-duration:1.1s; animation-delay:.1s; }
.eq-bar:nth-child(3){ animation-duration:.7s; animation-delay:.2s; }
.eq-bar:nth-child(4){ animation-duration:1s; animation-delay:.05s; }
.eq-bar:nth-child(5){ animation-duration:.9s; animation-delay:.15s; }

@keyframes podcast-eq{
	0%, 100%{ height:6px; }
	50%{ height:26px; }
}

@media (prefers-reduced-motion: reduce){
	.podcast-cover .eq-bar{
		animation:none !important;
		height:16px;
	}
}

/* Episode meta */
.podcast-meta{
	text-align:center;
}
.podcast-meta .podcast-title{
	color:#fff;
	font-weight:700;
	font-size:1.05rem;
	margin:0 0 .25rem;
}
.light-mode .podcast-meta .podcast-title{ color:#121822; }
.podcast-meta .podcast-subtitle{
	color:#a5b3ce;
	font-size:.85rem;
	margin:0;
}
.light-mode .podcast-meta .podcast-subtitle{ color:#354765; }

/* Controls */
.podcast-controls{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	gap:1rem 1.25rem;
	width:100%;
}
@media (max-width:420px){
	.podcast-controls{ gap:.75rem .9rem; }
}
.podcast-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:none;
	background:rgba(255,255,255,.08);
	color:#fff;
	cursor:pointer;
	transition:background .15s ease, transform .1s ease;
}
.light-mode .podcast-btn{
	background:rgba(18,24,34,.06);
	color:#121822;
}
.podcast-btn:hover{ background:rgba(255,255,255,.16); }
.light-mode .podcast-btn:hover{ background:rgba(18,24,34,.12); }
.podcast-btn:active{ transform:scale(.94); }
.podcast-btn:focus-visible{ outline:2px solid #3b7eeb; outline-offset:2px; }

.podcast-btn-skip{
	width:44px;
	height:44px;
	border-radius:50%;
	font-size:1.1rem;
	position:relative;
	margin-bottom:1.1rem; /* reserva espacio real para el skip-label, evita que se recorte o solape al envolver en pantallas chicas */
}
.podcast-btn-skip .skip-label{
	position:absolute;
	bottom:-1.1rem;
	left:50%;
	transform:translateX(-50%);
	font-size:.6rem;
	color:#a5b3ce;
	white-space:nowrap;
}
.light-mode .podcast-btn-skip .skip-label{ color:#354765; }

.podcast-btn-play{
	width:64px;
	height:64px;
	border-radius:50%;
	font-size:1.6rem;
	background:#3b7eeb;
	color:#fff;
}
.podcast-btn-play:hover{ background:#2f6fe0; }

.podcast-btn-speed{
	min-width:52px;
	height:36px;
	border-radius:999px;
	padding:0 .75rem;
	font-size:.8rem;
	font-weight:700;
	font-variant-numeric:tabular-nums;
}

@media (max-width:420px){
	.podcast-btn-skip{ width:38px; height:38px; font-size:1rem; }
	.podcast-btn-play{ width:56px; height:56px; font-size:1.4rem; }
	.podcast-btn-speed{ min-width:46px; height:32px; font-size:.75rem; }
}

/* Progress */
.podcast-progress-row{
	width:100%;
}
.podcast-seek{
	-webkit-appearance:none;
	appearance:none;
	width:100%;
	height:6px;
	border-radius:999px;
	/* 3 tramos: reproducido (acento) · precargado por delante (gris medio) · sin descargar aún (gris tenue) */
	background:linear-gradient(to right,
		#3b7eeb var(--pct, 0%),
		rgba(255,255,255,.32) var(--pct, 0%),
		rgba(255,255,255,.32) var(--buffered-pct, var(--pct, 0%)),
		rgba(255,255,255,.12) var(--buffered-pct, var(--pct, 0%))
	);
	outline:none;
	cursor:pointer;
	margin:0;
}
.light-mode .podcast-seek{
	background:linear-gradient(to right,
		#3b7eeb var(--pct, 0%),
		rgba(18,24,34,.2) var(--pct, 0%),
		rgba(18,24,34,.2) var(--buffered-pct, var(--pct, 0%)),
		rgba(18,24,34,.08) var(--buffered-pct, var(--pct, 0%))
	);
}
.podcast-seek::-webkit-slider-thumb{
	-webkit-appearance:none;
	appearance:none;
	width:14px;
	height:14px;
	border-radius:50%;
	background:#fff;
	border:2px solid #3b7eeb;
	cursor:pointer;
}
.podcast-seek::-moz-range-thumb{
	width:14px;
	height:14px;
	border-radius:50%;
	background:#fff;
	border:2px solid #3b7eeb;
	cursor:pointer;
}
.podcast-time-row{
	display:flex;
	justify-content:space-between;
	margin-top:.4rem;
	font-size:.75rem;
	color:#a5b3ce;
	font-variant-numeric:tabular-nums;
}
.light-mode .podcast-time-row{ color:#354765; }

/* Estado de reproducción: buffering/error, distinto del "is-playing" del ecualizador */
.podcast-status{
	min-height:1.1rem;
	font-size:.8rem;
	text-align:center;
	color:#a5b3ce;
}
.light-mode .podcast-status{ color:#5b6b85; }
.podcast-status:empty{ display:none; }
.podcast-status.is-buffering::before{
	content:"";
	display:inline-block;
	width:7px;
	height:7px;
	border-radius:50%;
	background:#eea73b;
	margin-right:.4rem;
	animation:podcast-pulse 1s ease-in-out infinite;
}
.podcast-status.is-error{ color:#ef8ba1; font-weight:600; }
.light-mode .podcast-status.is-error{ color:#b0304a; }

@keyframes podcast-pulse{
	0%, 100%{ opacity:.35; }
	50%{ opacity:1; }
}
@media (prefers-reduced-motion: reduce){
	.podcast-status.is-buffering::before{ animation:none; opacity:1; }
}

.podcast-fallback-link{
	display:inline-block;
	font-size:.75rem;
	color:#a5b3ce;
	text-decoration:underline;
	text-underline-offset:2px;
}
.light-mode .podcast-fallback-link{ color:#5b6b85; }
.podcast-fallback-link:hover{ color:#3b7eeb; }

/* Larger cover variant used on the episode-list card (pulsotechco-podcast-home.html) */
.podcast-card-cover-wrap{
	background:linear-gradient(145deg,#1e2738,#141b29);
	min-height:220px;
}
.light-mode .podcast-card-cover-wrap{
	background:linear-gradient(145deg,#eef2f9,#e4e9f2);
}
.podcast-cover-lg{
	width:140px;
	height:140px;
}
.podcast-cover-lg .podcast-cover-icon{ font-size:3rem; }
.podcast-cover-lg .podcast-eq{ height:46px; }

/* Compact teaser card (used on pulsotechco-home.html) */
.podcast-teaser{
	display:flex;
	align-items:center;
	gap:1rem;
	background:#1e2738;
	border-radius:.75rem;
	padding:1rem 1.25rem;
	margin:1.5rem 0;
	text-decoration:none;
	transition:background .15s ease;
}
.light-mode .podcast-teaser{
	background:#fff;
	border:1px solid #e4e9f2;
}
.podcast-teaser:hover{ background:#242f45; }
.light-mode .podcast-teaser:hover{ background:#f5f7fa; }
.podcast-teaser .podcast-cover{ width:56px; height:56px; border-radius:.6rem; }
.podcast-teaser .podcast-cover .podcast-cover-icon{ font-size:1.3rem; }
.podcast-teaser .podcast-cover .podcast-eq{ height:22px; gap:3px; }
.podcast-teaser .eq-bar{ width:3px; }
.podcast-teaser .podcast-teaser-body{ text-align:left; flex:1; min-width:0; }
.podcast-teaser .podcast-teaser-label{
	font-size:.7rem;
	text-transform:uppercase;
	letter-spacing:.06em;
	color:#3b7eeb;
	font-weight:700;
}
.podcast-teaser .podcast-teaser-title{
	color:#fff;
	font-weight:700;
	margin:.15rem 0 0;
}
.light-mode .podcast-teaser .podcast-teaser-title{ color:#121822; }
.podcast-teaser .podcast-teaser-arrow{
	color:#a5b3ce;
	font-size:1.4rem;
	flex-shrink:0;
}
.light-mode .podcast-teaser .podcast-teaser-arrow{ color:#354765; }

/* Disclaimer panel — deliberately understated, distinct from .blog-quote-holder */
.podcast-disclaimer{
	background:rgba(255,255,255,.03);
	border-radius:.5rem;
	padding:1.25rem 1.5rem;
	margin:1.5rem 0 2rem;
}
.light-mode .podcast-disclaimer{ background:rgba(0,0,0,.025); }
.podcast-disclaimer p{
	font-size:.8rem;
	line-height:1.6;
	color:#a5b3ce;
	margin-bottom:.85rem;
}
.light-mode .podcast-disclaimer p{ color:#5b6b85; }
.podcast-disclaimer p:last-child{ margin-bottom:0; }
.podcast-disclaimer strong{ color:#c7d1e3; }
.light-mode .podcast-disclaimer strong{ color:#354765; }
