/* Play & Mix – Tops. Ocupa la misma celda que el voto antiguo del tema (.proradio-chartvote). */
:root {
	/* Naranja del tema Pro Radio de Play & Mix */
	--pmt-accent: #f7a90c;
	--pmt-accent-2: #e77103;
	--pmt-accent-ink: #fff;
	--pmt-muted: #9a9a9a;
	--pmt-box-bg: #16161c;
	--pmt-box-ink: #f2f2f5;
}

.proradio-chartvote.pmt-vote {
	display: table-cell;
	vertical-align: middle;
	width: 64px;
	padding: 4px;
	text-align: center;
	background: rgba(100, 100, 100, 0.05);
}

/* El tema da estilo a todos los <button>: lo anulamos dentro del voto. */
.proradio-chartvote.pmt-vote .pmt-vote-btn {
	display: inline-flex;
	box-sizing: border-box;
	height: auto;
	min-width: 0;
	margin: 0;
	white-space: nowrap;
	box-shadow: none;
	background-image: none;
	text-shadow: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	width: 100%;
	min-height: 48px;
	padding: 4px 2px;
	border: 2px solid var(--pmt-accent);
	border-radius: 8px;
	background-color: transparent;
	color: var(--pmt-accent);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: .04em;
	cursor: pointer;
	transition: background-color .15s, color .15s, transform .1s;
}
.proradio-chartvote.pmt-vote .pmt-vote-btn:hover:not(:disabled),
.proradio-chartvote.pmt-vote .pmt-vote-btn:focus-visible,
.proradio-chartvote.pmt-vote.pmt-voted .pmt-vote-btn {
	background-color: var(--pmt-accent);
	background-image: linear-gradient(193deg, var(--pmt-accent) 0%, var(--pmt-accent-2) 100%);
	color: var(--pmt-accent-ink);
	outline: none;
}
.proradio-chartvote.pmt-vote .pmt-vote-btn:active:not(:disabled) { transform: scale(.95); }

.pmt-ico {
	display: block;
	width: 10px;
	height: 10px;
	margin-top: 4px;
	border: solid currentColor;
	border-width: 3px 3px 0 0;
	transform: rotate(-45deg);
}

/* Ya votado: fondo oscuro con borde y ✓ naranjas, para distinguirlo del botón "Votar". */
.proradio-chartvote.pmt-vote.pmt-voted .pmt-vote-btn {
	background: #111 !important;
	border-color: var(--pmt-accent) !important;
	color: var(--pmt-accent) !important;
	cursor: default;
	opacity: 1;
}
.pmt-voted .pmt-ico {
	width: 12px;
	height: 7px;
	margin-top: 0;
	border-width: 0 0 3px 3px;
	transform: rotate(-45deg);
}

.pmt-busy .pmt-vote-btn { opacity: .5; pointer-events: none; }

.pmt-closed {
	display: block;
	font-size: 11px;
	color: var(--pmt-muted);
	text-transform: uppercase;
}

.pmt-move {
	display: block;
	font-size: 11px;
	line-height: 1;
	margin-bottom: 3px;
}
.pmt-move-up { color: var(--pmt-accent); }
.pmt-move-down { color: #e0443e; }
.pmt-move-same { color: var(--pmt-muted); }

/* Ventana de acceso */
.pmt-modal-open { overflow: hidden; }
.pmt-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: rgba(0, 0, 0, .65);
}
.pmt-modal[hidden] { display: none; }
.pmt-modal-box {
	position: relative;
	width: 100%;
	max-width: 380px;
	padding: 28px 24px 22px;
	border-radius: 14px;
	background: var(--pmt-box-bg);
	color: var(--pmt-box-ink);
	text-align: center;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
}
.pmt-modal-box h3 { margin: 0 0 10px; color: inherit; font-size: 20px; }
.pmt-modal-box p { margin: 0 0 18px; font-size: 14px; line-height: 1.5; opacity: .85; }
.pmt-x {
	position: absolute;
	top: 8px;
	right: 10px;
	border: 0;
	background: none;
	color: inherit;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	opacity: .7;
}
.pmt-providers { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.pmt-apple {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: 240px;
	height: 40px;
	padding: 0 18px;
	border: 1px solid #fff;
	border-radius: 20px;
	background: #000;
	color: #fff;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.pmt-apple[hidden] { display: none; }
.pmt-err { color: #ff7b72; margin: 14px 0 0 !important; }

/* Aviso */
.pmt-toast {
	position: fixed;
	left: 50%;
	bottom: 90px;
	z-index: 1000000;
	max-width: calc(100% - 32px);
	padding: 10px 18px;
	border-radius: 24px;
	background: #111;
	color: #fff;
	font-size: 14px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .35);
	opacity: 0;
	transform: translate(-50%, 10px);
	transition: opacity .2s, transform .2s;
	pointer-events: none;
}
.pmt-toast.pmt-show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 600px) {
	.proradio-chartvote.pmt-vote { width: 52px; padding: 3px; }
	.proradio-chartvote.pmt-vote .pmt-vote-btn { min-height: 42px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.pmt-vote-btn, .pmt-toast { transition: none; }
}
