/**
 * Musikaa Player — CSS Overrides
 *
 * Ajustes finos sobre o player base do Presto/Plyr.
 * Mantém a estrutura do plugin original — só sobrescreve variáveis CSS e detalhes visuais.
 */

/* ============================================================
   PLAYER SINGLE
   ============================================================ */

.musikaa-player {
	max-width: 100%;
	margin: 0;
}

.musikaa-player presto-player {
	--presto-player-aspect-ratio: 16/9;
	border-radius: var(--presto-player-border-radius, 8px);
	overflow: hidden;
}

/* Defesa em profundidade contra UI residual do YouTube. */
.musikaa-player .plyr--youtube .plyr__poster ~ iframe,
.musikaa-player .plyr--youtube iframe[src*="youtube"] {
	pointer-events: none;
}
.musikaa-player .plyr--youtube .plyr__video-embed::after {
	display: none !important;
}

/* ============================================================
   PLAYLIST
   ============================================================ */

.musikaa-playlist {
	max-width: 100%;
	margin: 0;
}

.musikaa-playlist presto-playlist {
	--presto-playlist-border-radius: 8px;
	--presto-playlist-border-width: 0;
	--presto-playlist-background-color: #0a0a0a;
	--presto-playlist-text-color: #ffffff;
}

/* ============================================================
   PLACEHOLDER / ERROR
   ============================================================ */

.musikaa-player-placeholder {
	font-family: inherit;
	min-height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.musikaa-player-error {
	font-family: inherit;
	font-size: 14px;
}

/* ============================================================
   BOTÃO PRÓXIMO (sobre o player, em playlist mode)
   ============================================================ */

.musikaa-playlist {
	position: relative;
}

/* Especificidade bumpada — prefixo .musikaa-playlist eleva specificity acima
 * de regras genéricas de tema/Elementor que estavam vencendo (ex: rosa no hover).
 * Cada regra também usa !important pra defesa adicional. */
.musikaa-playlist .musikaa-player-next-btn,
.musikaa-playlist .musikaa-player-next-btn:link,
.musikaa-playlist .musikaa-player-next-btn:visited {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 100;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 38px !important;
	height: 38px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 50% !important;
	background: rgba(0, 0, 0, 0.6) !important;
	background-color: rgba(0, 0, 0, 0.6) !important;
	background-image: none !important;
	color: #ffffff !important;
	fill: #ffffff !important;
	cursor: pointer !important;
	opacity: 0;
	transition: opacity 0.2s ease, background-color 0.2s ease, transform 0.15s ease;
	text-decoration: none !important;
	box-shadow: none !important;
	pointer-events: auto !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.musikaa-playlist:hover .musikaa-player-next-btn,
.musikaa-playlist:focus-within .musikaa-player-next-btn,
.musikaa-playlist .musikaa-player-next-btn:focus-visible {
	opacity: 1 !important;
}

.musikaa-playlist .musikaa-player-next-btn:hover,
.musikaa-playlist .musikaa-player-next-btn:focus,
.musikaa-playlist .musikaa-player-next-btn:focus-visible,
.musikaa-playlist .musikaa-player-next-btn:active {
	color: #ffffff !important;
	fill: #ffffff !important;
	background: rgba(0, 0, 0, 0.9) !important;
	background-color: rgba(0, 0, 0, 0.9) !important;
	background-image: none !important;
	transform: scale(1.05) !important;
	text-decoration: none !important;
	border: none !important;
	box-shadow: none !important;
}

.musikaa-playlist .musikaa-player-next-btn:focus-visible {
	outline: 2px solid #ffffff !important;
	outline-offset: 2px;
}

.musikaa-playlist .musikaa-player-next-btn svg {
	display: block !important;
	fill: #ffffff !important;
	color: #ffffff !important;
	pointer-events: none;
	width: 20px !important;
	height: 20px !important;
}

.musikaa-playlist .musikaa-player-next-btn svg path {
	fill: #ffffff !important;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {
	.musikaa-playlist presto-playlist {
		--presto-playlist-list-height: auto;
	}

	/* Em mobile, mantém o botão Próximo visível (sem hover). */
	.musikaa-player-next-btn {
		opacity: 1;
		background: rgba(0, 0, 0, 0.7);
	}
}