/* Vox Libra Music Player 1.1.5 */

.vlmp-player {
	--vlmp-violet: #76518a;
	--vlmp-text: #222;
	--vlmp-muted: #777;
	--vlmp-font-size: 20px;
	display: flex;
	align-items: center;
	gap: 24px;
	width: 100%;
	max-width: 760px;
	margin: 30px auto;
	color: var(--vlmp-text);
	font-family: inherit;
}

.vlmp-artwork {
	flex: 0 0 92px;
	width: 92px;
	height: 92px;
	overflow: hidden;
}

.vlmp-artwork img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vlmp-main {
	flex: 1 1 auto;
	min-width: 0;
}

.vlmp-now-playing {
	min-height: 1.5em;
	margin-bottom: 12px;
	text-align: center;
	font-size: var(--vlmp-font-size);
	font-weight: 600;
}

.vlmp-controls {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	margin-bottom: 12px;
}

.vlmp-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--vlmp-violet);
	font: inherit;
	cursor: pointer;
	transition: opacity .2s ease;
}

.vlmp-button:hover { opacity: .72; }

.vlmp-button:focus-visible,
.vlmp-track:focus-visible,
.vlmp-progress:focus-visible {
	outline: 2px solid var(--vlmp-violet);
	outline-offset: 3px;
}

.vlmp-play {
	width: 46px;
	height: 46px;
	border: 1.5px solid var(--vlmp-violet);
	border-radius: 50%;
	font-size: 17px;
}

.vlmp-prev,.vlmp-next {
	width: 30px;
	height: 30px;
	font-size: 30px;
	line-height: 1;
}

.vlmp-pause-icon { display:none; font-size:15px; letter-spacing:-2px; }
.vlmp-player.is-playing .vlmp-play-icon { display:none; }
.vlmp-player.is-playing .vlmp-pause-icon { display:inline; }

.vlmp-progress-wrap {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 10px;
}

.vlmp-time {
	color: var(--vlmp-muted);
	font-size: var(--vlmp-font-size);
	font-variant-numeric: tabular-nums;
}

.vlmp-progress {
	width: 100%;
	height: 4px;
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
	background: linear-gradient(to right,var(--vlmp-violet) 0%,var(--vlmp-violet) var(--vlmp-progress,0%),#ddd var(--vlmp-progress,0%),#ddd 100%);
	border-radius: 20px;
	cursor: pointer;
	outline: none;
}

.vlmp-progress::-webkit-slider-thumb {
	width:14px;height:14px;appearance:none;-webkit-appearance:none;
	background:var(--vlmp-violet);border:2px solid #fff;border-radius:50%;
	box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.vlmp-progress::-moz-range-thumb {
	width:14px;height:14px;background:var(--vlmp-violet);border:2px solid #fff;border-radius:50%;
	box-shadow:0 1px 4px rgba(0,0,0,.18);
}

.vlmp-audio { display:none; }

.vlmp-quote {
	min-height:1.6em;
	max-width:680px;
	margin:18px auto 20px;
	color:#222;
	font-family:Georgia,"Times New Roman",serif;
	font-size:var(--vlmp-font-size);
	font-style:italic;
	line-height:1.45;
	text-align:center;
}

.vlmp-tracklist {
	display:grid;
	gap:5px 24px;
	margin-top:24px;
}
.vlmp-columns-1 { grid-template-columns:1fr; }
.vlmp-columns-2 { grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(var(--vlmp-track-rows,1),auto);grid-auto-flow:column; }
.vlmp-tracklist-hidden { display:none; }

.vlmp-track {
	display:flex;
	align-items:baseline;
	gap:8px;
	width:100%;
	padding:7px 0;
	border:0;
	background:transparent;
	color:var(--vlmp-text);
	font:inherit;
	font-size:var(--vlmp-font-size);
	line-height:1.35;
	text-align:left;
	cursor:pointer;
}
.vlmp-track-number { flex:0 0 auto;color:var(--vlmp-violet);font-size:var(--vlmp-font-size);font-weight:600; }
.vlmp-track-title { transition:color .2s ease; }
.vlmp-track:hover .vlmp-track-title,
.vlmp-track.is-active .vlmp-track-title { color:var(--vlmp-violet); }
.vlmp-track.is-active .vlmp-track-title { font-weight:600; }

.vlmp-player[data-show-titles="no"] .vlmp-now-playing { display:none; }

@media (max-width:600px) {
	.vlmp-player { gap:14px; margin:22px auto; }
	.vlmp-artwork { flex-basis:72px;width:72px;height:72px; }
	.vlmp-controls { gap:10px; }
	.vlmp-columns-2 { grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row; }
	.vlmp-quote { font-size:var(--vlmp-font-size); }
}