@import 'vars';

.player-bar {
	background-color: $bg-secondary;
	background-image: none;
	padding: $halvedpadding;

	.koto-button {
		&:not(.toggled) {
			color: $player-bar-icon-color;
		}

		&.toggled {
			color: $text-color-bright;
		}
	}

	.playerbar-info { // Central info section
		& > box { // Info labels
			margin-left: 2ex;

			& > image {
				color: $text-color-faded;
			}

			& > label {
				margin-top: 6px;
				margin-bottom: 6px;

				&:nth-child(1) { // Title
					font-size: x-large;
					font-weight: bold;
				}

				&:not(:nth-child(1)) { // Album and Artist
					font-size: large;
				}

				&:nth-child(2) { // Album

				}

				&:nth-child(3) { // Artist

				}
			}
		}
	}

	.playerbar-secondary-controls { // Secondary controls
		label { // Inner playback position label
			font-size: large;
			margin-right: $halvedpadding;
		}
	}
}
