
.eclecty-latest-list {
	list-style: none;
	padding: 0;
	margin: 0;

	.eclecty-latest-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* padding: .1rem 0; */
		border-bottom: 1px dashed #444;
		gap: 1.5rem;
		transition: background 0.2s ease;

		&:last-child {
			border-bottom: none;
		}
	}

	.eclecty-latest-icon {
		flex: 0 0 30px;
		height: 30px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.2rem;
		background: #141414;
		border-radius: 4px;
		/* box-shadow: 0 0 10px rgba(0,0,0,0.5); */

		img {
			/* Spinner Animation for Classic/Essential */
			.is-classic-verdict &,
			.is-essential-verdict & {
				animation: sidebar-spin 12s infinite linear;
			}
		}
	}

	.eclecty-latest-info {
		flex: 1;
		min-width: 0;
		display: flex;
		flex-direction: column;
		gap: 0.1rem;
		text-align: left;
		align-items: flex-start;
	}

	.eclecty-latest-title {
		text-decoration: none;
		/* color: #e0e0e0; */
		font-size: 0.85rem;
		line-height: 1.2;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: block;
		text-align: left;

		/* Dark Mode Hover */
		.mode--alt--b &:hover {
			color: #5eff00;
		}

		/* Light Mode Hover */
		body:not(.mode--alt--b) &:hover {
			color: #ff0000;
		}
	}

	.eclecty-latest-artist {
		font-size: 0.75rem;
		color: #888;
		text-transform: uppercase;
		letter-spacing: 0.05em;
	}
}

/* Spinner Keyframes */
@keyframes sidebar-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
