/* AudioPlayback.less */
.moon-audio-playback {
	font-size: 30px;

	.moon-drawer-partial-client {
		padding: 26px 0 0 0;
	}
	.moon-audio-playback-top {
		background-color: @moon-video-player-controls-bg-color;
		direction: ltr;
		padding: 36px 24px;
	}
	.moon-audio-playback-bottom {
		position: relative;
	}
	.moon-audio-track-icon {
		width: 84px;
		height: 84px;
		margin: 0;
	}
	.moon-audio-track-info {
		max-width: 558px;
		padding: 0 @moon-spotlight-outset;

		> * {
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}
	.moon-audio-control-buttons {
		text-align: center;
		position: absolute;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		margin: 0;
	}
	.moon-audio-more-buttons {
		float: right;
		max-width: 720px;
		text-align: right;
	}

	.moon-audio-play-time {
		.moon-progress-bar.moon-video-player-transport-slider .indicator-wrapper;
		.moon-progress-bar.moon-video-player-transport-slider .indicator-text;
		pointer-events: none;
	}
	.moon-audio-play-time.left {
		.moon-progress-bar.moon-video-player-transport-slider .indicator-wrapper.start;
	}
	.moon-audio-play-time.right {
		.moon-progress-bar.moon-video-player-transport-slider .indicator-wrapper.end;
	}
	.moon-audio-track-count.right {
		float: right;
	}
	.enyo-locale-right-to-left .moon-audio-track-info {
		text-align: right;
		direction: rtl;
	}

	// AudioPlayback styles for IconButton
	.moon-audio-icon-button {
		margin: 0 4px;
	}

	// AudioPlayback styles for Slider
	.moon-audio-slider {
		.moon-progress-bar.moon-video-player-transport-slider;

		&.spotlight .moon-audio-slider-knob {
			.moon-progress-bar.moon-video-player-transport-slider.visible .knob
		}
	}

	// Knob
	.moon-audio-slider-knob {
		.moon-progress-bar.moon-video-player-transport-slider .knob;
	}

	// Bar
	.moon-audio-slider-bar-bar {
		.moon-progress-bar.moon-video-player-transport-slider .bar-bar;
	}
	.moon-audio-slider-bg-bar {
		.moon-progress-bar.moon-video-player-transport-slider .bg-bar;
	}
	.moon-audio-slider-taparea {
		position: absolute;
		height: 100%;
		width: 100%;
		&.pressed {
			position: fixed;
			top: 0;
		}
	}
}