/**
 * Shared catalogue-card contract.
 *
 * Specialist plugins own their content and layout. This final cascade layer
 * keeps the public product tiles and primary actions visually consistent.
 */
:root {
	--dc-card-radius: 20px;
	--dc-card-action-radius: 4px;
	--dc-card-border: #ded4c3;
	--dc-card-paper: #fffdf9;
	--dc-card-ink: #181714;
	--dc-card-gold: #b9914b;
	--dc-card-gold-hover: #8a6428;
	--dc-card-shadow: 0 18px 46px rgba(24, 23, 20, 0.08);
	--dc-card-shadow-hover: 0 26px 58px rgba(24, 23, 20, 0.13);
}

:is(
	.dpl-archive-template .dpl-colour-card,
	.dc-wallpaper-library .dcwl-card,
	.dc-mardom-card,
	#dct-tools .dct-product,
	#dct-trade .dct-trade-product,
	.dcwf .dcwf-product
) {
	background: var(--dc-card-paper);
	border: 1px solid var(--dc-card-border);
	border-radius: var(--dc-card-radius);
	box-shadow: var(--dc-card-shadow);
	box-sizing: border-box;
	overflow: hidden;
	transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

:is(
	.dpl-archive-template .dpl-colour-card,
	.dc-wallpaper-library .dcwl-card,
	.dc-mardom-card,
	#dct-tools .dct-product,
	#dct-trade .dct-trade-product,
	.dcwf .dcwf-product
):is(:hover, :focus-within) {
	border-color: #cdbb9d;
	box-shadow: var(--dc-card-shadow-hover);
	transform: translateY(-3px);
}

/* Paint cards are one large accessible link, so the CTA is a visual label. */
.dpl-archive-template .dpl-card-body {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.dpl-archive-template .dpl-card-body::after {
	align-items: center;
	background: var(--dc-card-gold);
	border: 1px solid var(--dc-card-gold);
	border-radius: var(--dc-card-action-radius);
	color: var(--dc-card-ink);
	content: "View colour \2192";
	display: flex;
	font-size: 13px;
	font-weight: 800;
	justify-content: center;
	line-height: 1.2;
	margin-top: auto;
	min-height: 48px;
	padding: 12px 20px;
	text-align: center;
}

/* One primary action per product card; reference and supplier links stay quiet. */
:is(
	.dc-wallpaper-library .dcwl-card-body > .dcwl-button,
	.dc-mardom-card__link,
	#dct-tools .dct-product__actions .dct-mini-button,
	#dct-tools .dct-product__actions:not(:has(.dct-mini-button)) > a:last-child,
	#dct-trade .dct-trade-product__body > a:first-of-type,
	.dcwf .dcwf-card-actions > a:last-child
) {
	align-items: center;
	align-self: stretch;
	background: var(--dc-card-gold) !important;
	border: 1px solid var(--dc-card-gold) !important;
	border-radius: var(--dc-card-action-radius) !important;
	box-sizing: border-box;
	color: var(--dc-card-ink) !important;
	display: flex;
	font-size: 13px !important;
	font-weight: 800;
	justify-content: center;
	letter-spacing: 0 !important;
	line-height: 1.2;
	min-height: 48px;
	padding: 12px 20px !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	width: 100%;
}

:is(
	.dc-wallpaper-library .dcwl-card-body > .dcwl-button,
	.dc-mardom-card__link,
	#dct-tools .dct-product__actions .dct-mini-button,
	#dct-tools .dct-product__actions:not(:has(.dct-mini-button)) > a:last-child,
	#dct-trade .dct-trade-product__body > a:first-of-type,
	.dcwf .dcwf-card-actions > a:last-child
):is(:hover, :focus-visible) {
	background: var(--dc-card-gold-hover) !important;
	border-color: var(--dc-card-gold-hover) !important;
	color: #fff !important;
}

:is(
	.dc-wallpaper-library .dcwl-card-body > .dcwl-button,
	.dc-mardom-card__link,
	#dct-tools .dct-product__actions .dct-mini-button,
	#dct-tools .dct-product__actions:not(:has(.dct-mini-button)) > a:last-child,
	#dct-trade .dct-trade-product__body > a:first-of-type,
	.dcwf .dcwf-card-actions > a:last-child
):focus-visible {
	outline: 3px solid var(--dc-card-ink);
	outline-offset: 3px;
}

.dc-mardom-card__footer,
#dct-tools .dct-product__actions,
.dcwf .dcwf-card-actions {
	width: 100%;
}

#dct-tools .dct-product__actions:not(:has(.dct-mini-button)) > a:last-child,
.dcwf .dcwf-card-actions > a:last-child {
	order: -1;
}

/* Shared catalogue typography: product types differ, hierarchy does not. */
:is(
	.dpl-archive-template .dpl-card-title,
	.dc-wallpaper-library .dcwl-card-title,
	.dc-mardom-card h3,
	#dct-tools .dct-product__body h3,
	#dct-trade .dct-trade-product__body h3,
	.dcwf .dcwf-product h3
) {
	color: #292826;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.025em;
	line-height: 1.1;
}

:is(
	.dpl-archive-template .dpl-card-brand,
	.dc-wallpaper-library .dcwl-card-brand,
	.dc-mardom-card__category,
	#dct-tools .dct-product .dct-eyebrow,
	#dct-trade .dct-trade-product .dct-eyebrow,
	.dcwf .dcwf-kicker
) {
	color: #80551f;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}

:is(
	.dpl-archive-template .dpl-card-code,
	.dpl-archive-template .dpl-card-tags,
	.dc-wallpaper-library .dcwl-card-subtitle,
	.dc-mardom-card__sku,
	#dct-tools .dct-product__body > p:not(.dct-eyebrow):not(.dct-stocked-badge),
	#dct-trade .dct-trade-product__body > p:not(.dct-eyebrow),
	.dcwf .dcwf-product > p
) {
	font-size: 13px;
	line-height: 1.4;
}

@media (max-width: 620px) {
	:is(
		.dpl-archive-template .dpl-colour-grid,
		.dc-wallpaper-library .dcwl-grid,
		.dc-mardom-grid,
		#dct-tools .dct-product-grid,
		#dct-trade .dct-trade-products,
		.dcwf .dcwf-product-grid
	) {
		display: grid;
		gap: 14px;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	:is(
		.dpl-archive-template .dpl-colour-card,
		.dc-wallpaper-library .dcwl-card,
		.dc-mardom-card,
		#dct-tools .dct-product,
		#dct-trade .dct-trade-product,
		.dcwf .dcwf-product
	) {
		display: flex;
		flex-direction: column;
		min-height: 0;
		min-width: 0;
	}

	:is(
		.dpl-archive-template .dpl-card-title,
		.dc-wallpaper-library .dcwl-card-title,
		.dc-mardom-card h3,
		#dct-tools .dct-product__body h3,
		#dct-trade .dct-trade-product__body h3,
		.dcwf .dcwf-product h3
	) {
		font-size: 20px;
		line-height: 1.08;
		overflow-wrap: anywhere;
	}

	.dpl-archive-template .dpl-card-body,
	.dc-wallpaper-library .dcwl-card-body,
	.dc-mardom-card__body,
	#dct-tools .dct-product__body,
	#dct-trade .dct-trade-product__body {
		gap: 8px;
		min-height: 0;
		padding: 14px;
	}

	.dpl-archive-template .dpl-card-swatch,
	.dc-wallpaper-library .dcwl-card-flip-inner,
	.dc-mardom-card__image,
	#dct-tools .dct-product__image,
	#dct-trade .dct-trade-product__visual {
		aspect-ratio: 1 / 1;
		height: auto;
		min-height: 0;
		width: 100%;
	}

	.dc-mardom-card__image,
	#dct-tools .dct-product__image,
	#dct-trade .dct-trade-product__visual {
		padding: 10px;
	}

	#dct-tools .dct-product__image,
	#dct-trade .dct-trade-product__visual {
		aspect-ratio: 4 / 3;
	}

	.dc-mardom-card__body {
		flex: 1;
	}

	.dc-mardom-card__footer {
		align-items: stretch;
		border-top: 0;
		padding-top: 6px;
	}

	.dc-wallpaper-library .dcwl-card-swatches {
		gap: 6px;
		min-height: 48px;
		padding-bottom: 2px;
	}

	.dc-wallpaper-library .dcwl-card-swatch {
		border-radius: 8px;
		height: 44px;
		width: 38px;
	}

	#dct-tools .dct-product__body > p:not(.dct-eyebrow):not(.dct-stocked-badge),
	#dct-trade .dct-trade-product__body > p:not(.dct-eyebrow),
	.dcwf .dcwf-product > p {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	#dct-tools .dct-product__sizes,
	#dct-trade .dct-trade-product__variants {
		margin-bottom: 4px;
	}

	#dct-tools .dct-product .dct-eyebrow,
	#dct-trade .dct-trade-product .dct-eyebrow,
	#dct-tools .dct-stocked-badge,
	#dct-trade .dct-stocked-badge,
	#dct-tools .dct-product__body h3,
	#dct-trade .dct-trade-product__body h3 {
		margin-bottom: 0 !important;
		margin-top: 0 !important;
	}

	#dct-tools .dct-product details,
	#dct-trade .dct-trade-product details,
	.dcwf .dcwf-product details {
		margin-top: 6px;
		padding-top: 0;
	}

	#dct-tools .dct-product summary,
	#dct-trade .dct-trade-product summary,
	.dcwf .dcwf-product summary {
		display: flex;
		min-height: 44px;
		align-items: center;
		font-size: 9px;
		line-height: 1.25;
	}

	.dcwf .dcwf-product {
		padding: 14px;
	}

	.dcwf .dcwf-badges {
		max-height: 58px;
		overflow: hidden;
	}

	:is(
		.dc-wallpaper-library .dcwl-card-body > .dcwl-button,
		.dc-mardom-card__link,
		#dct-tools .dct-product__actions .dct-mini-button,
		#dct-tools .dct-product__actions:not(:has(.dct-mini-button)) > a:last-child,
		#dct-trade .dct-trade-product__body > a:first-of-type,
		.dcwf .dcwf-card-actions > a:last-child
	),
	.dpl-archive-template .dpl-card-body::after {
		font-size: 11px !important;
		min-height: 46px;
		padding: 10px 8px !important;
	}

	#dct-tools .dct-product__actions,
	.dcwf .dcwf-card-actions {
		gap: 8px;
	}

	#dct-tools .dct-product__actions {
		margin-top: 6px;
	}

	#dct-trade .dct-trade-product__body > a:first-of-type {
		margin-top: 6px;
	}

	#dct-trade .dct-trade-product__body > a:not(:first-of-type) {
		margin-top: 0;
	}

	#dct-tools .dct-product__actions > a:not(.dct-mini-button),
	#dct-trade .dct-trade-product__body > a:not(:first-of-type),
	.dcwf .dcwf-card-actions > a:not(:last-child) {
		font-size: 9px;
		line-height: 1.3;
	}
}

@media (prefers-reduced-motion: reduce) {
	:is(
		.dpl-archive-template .dpl-colour-card,
		.dc-wallpaper-library .dcwl-card,
		.dc-mardom-card,
		#dct-tools .dct-product,
		#dct-trade .dct-trade-product,
		.dcwf .dcwf-product
	) {
		transition: none;
	}
}