@import 'theme.scss';

.queue {
	position: fixed;
	top: 0;
	right: 0; 
	width: 400px; 
	height: calc(100% - 78.9px); /* Adjust height to fit the queue */
	background-color: white;/*$queue-background-color; Queue background color */
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
	overflow-y: auto; /* Add scroll bar when queue is too long */
  
	.queue-header {
	  background-color: #333; /* Header background color */
	  color: #fff; /* Header text color */
	  padding: 10px;
	  text-align: center;
	}
  
	ul {
		list-style: none;
		padding: 0;
		margin: 0;
	
		.queue-item {
			display: flex;
			align-items: center;
			padding: 10px;
			
			.queue-song {
				display: flex;
				align-items: center;
				padding: 10px;
				border-bottom: 1px solid #ccc; /* Separator line color */
			
				img {
					max-width: 50px; /* Adjust maximum width for images */
					margin-right: 10px; /* Add spacing between image and text */
				}
			
				.queue-song-info {
					h3 {
						margin: 0; /* Remove default margin for heading */
						color: #333; /* Adjust text color for song */
					}
			
					p {
						margin: 0; /* Remove default margin for paragraph */
						color: #888; /* Adjust text color for artist */
					}
				}
			}

			button {
				background: none;
				border: none;
				cursor: pointer;
				margin-left: auto;
			}

			p {
				color: #333;
				font-weight: bold;
				margin-left: auto;
				background: none;
				border: none;
			}
		}
	}
}