/* Radio Circulando — cambiá los colores acá */
.rc-radio {
	--rc-bg: #0f2a43;
	--rc-fg: #ffffff;
	--rc-accent: #ffb703;
	--rc-panel-bg: #ffffff;
	--rc-panel-fg: #1b2a38;
	--rc-muted: #5b6b7a;
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 99999;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 10px;
}
.rc-radio[hidden] { display: none; }

.rc-fab {
	position: relative;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 0;
	background: var(--rc-bg);
	color: var(--rc-fg);
	display: grid;
	place-items: center;
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
	padding: 0;
}
.rc-fab:focus-visible, .rc-play:focus-visible, .rc-close:focus-visible {
	outline: 3px solid var(--rc-accent);
	outline-offset: 2px;
}
.rc-pulse {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid var(--rc-accent);
	opacity: 0;
	pointer-events: none;
}
.rc-radio.is-playing .rc-fab { color: var(--rc-accent); }
.rc-radio.is-playing .rc-pulse { animation: rc-pulse 1.8s ease-out infinite; }
@keyframes rc-pulse {
	0%   { transform: scale(1);   opacity: .8; }
	100% { transform: scale(1.6); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.rc-radio.is-playing .rc-pulse { animation: none; opacity: .6; }
}

.rc-panel {
	width: min(300px, calc(100vw - 32px));
	background: var(--rc-panel-bg);
	color: var(--rc-panel-fg);
	border-radius: 14px;
	box-shadow: 0 8px 28px rgba(0, 0, 0, .28);
	padding: 14px 16px 16px;
}
.rc-panel[hidden] { display: none; }
.rc-head { display: flex; justify-content: space-between; align-items: center; }
.rc-name { font-weight: 700; font-size: 15px; }
.rc-close {
	background: none; border: 0; font-size: 24px; line-height: 1;
	color: var(--rc-muted); cursor: pointer; padding: 0 4px;
}
.rc-now { margin: 8px 0 12px; font-size: 14px; min-height: 2.6em; color: var(--rc-panel-fg); }
.rc-controls { display: flex; align-items: center; gap: 14px; }
.rc-play {
	flex: none; width: 48px; height: 48px; border-radius: 50%; border: 0;
	background: var(--rc-bg); color: var(--rc-fg); display: grid; place-items: center; cursor: pointer; padding: 0;
}
.rc-play .rc-ico-pause { display: none; }
.rc-radio.is-playing .rc-play .rc-ico-play { display: none; }
.rc-radio.is-playing .rc-play .rc-ico-pause { display: block; }
.rc-vol { flex: 1; accent-color: var(--rc-bg); min-width: 0; }
.rc-radio.no-volume .rc-vol { display: none; }
.rc-status { margin-top: 8px; font-size: 12px; color: var(--rc-muted); min-height: 1.2em; }