/* Sidebar column is 250px wide, so the card is compact: packshot next to the
 * name, the button on its own row underneath. */
.dk-artprod {
	background: var(--dk-paper-light);
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.dk-artprod__kicker {
	color: var(--dk-text-light);
}

.dk-artprod__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.dk-artprod__item {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 10px 12px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--dk-border-light);
}

.dk-artprod__list > .dk-artprod__item:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

/* Without a photo the thumb column is dropped rather than filled with an empty
 * hatch placeholder: in a 250px sidebar that just reads as noise. */
.dk-artprod__item--nophoto {
	grid-template-columns: minmax(0, 1fr);
}

/* Packshot: never cropped, same treatment as the comparison cards. */
.dk-artprod__thumb {
	height: 64px;
	background: var(--dk-paper-light);
	border: 1px solid var(--dk-border-light);
	padding: 4px;
}

.dk-artprod .dk-artprod__thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.dk-artprod__body {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.dk-artprod__name {
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--dk-ink);
}

.dk-artprod__price {
	font-family: var(--dk-font-mono);
	font-size: 11.5px;
	color: var(--dk-text-muted-2);
}

.dk-artprod__note {
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--dk-text-muted-2);
}

.dk-artprod__btn {
	grid-column: 1 / -1;
	background: var(--dk-green);
	color: var(--dk-paper-light);
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	padding: 9px 12px;
	border-radius: var(--dk-radius);
	transition: background var(--dk-t);
}

.dk-artprod__btn:hover {
	background: var(--dk-green-hover);
	color: var(--dk-paper-light);
	text-decoration: none;
}

.dk-artprod__disc {
	font-size: 11.5px;
	line-height: 1.55;
	color: var(--dk-text-lighter);
}
