/**
 * Product loop card.
 *
 * Styles the card rendered by parkland_render_loop_card() in lib/archive-card.php.
 * Everything is scoped to .pk-card, which is added to Kadence's details wrapper
 * via the kadence_archive_content_wrap_start filter, so these rules cannot reach
 * the product page — .pk-title-* classes are shared with the PDP title block.
 *
 * Tokens mirror parkland-deals/css/deals.css so the archive and the campaign
 * pages read as one design.
 */

 .pk-card {
	--pk-card-ink: var(--pk-ink, #1a1a1a);
	--pk-card-muted: var(--pk-muted, #5c6670);
	--pk-card-accent: var(--pk-accent, #2f6b3a);
	--pk-card-border: var(--pk-border, #e4e7ea);
	--pk-card-surface: var(--pk-surface, #f4f6f5);

	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px;
}

/* --- Head: brand eyebrow, name, model --- */

.pk-card-head {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.pk-card h2.woocommerce-loop-product__title {
	margin: 0 !important;
	padding: 0 !important;
	font-size: var(--pk-fs-base);
	line-height: 1.35;
}

.pk-card h2.woocommerce-loop-product__title a {
	text-decoration: none;
	color: var(--pk-card-ink);
}

.pk-card h2.woocommerce-loop-product__title a:hover,
.pk-card h2.woocommerce-loop-product__title a:focus {
	color: var(--pk-card-accent);
}

.pk-card span.pk-title-brand {
	margin-bottom: 2px;
	font-size: var(--pk-fs-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--pk-card-muted);
}

.pk-card span.pk-title-model {
	font-size: var(--pk-fs-base);
	font-weight: 700;
}

.pk-card span.pk-title-details {
	display: block;
	font-size: var(--pk-fs-sm);
	font-weight: 400;
	color: var(--pk-card-muted);
}

.pk-card-model {
	font-size: var(--pk-fs-xs);
	color: var(--pk-card-muted);
}

.pk-card-model-no {
	color: var(--pk-card-muted);
}

/* --- Specs: label left, value right, like a compact spec strip --- */

.woocommerce .products ul.pk-card-specs {
	margin: 2px 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--pk-card-border);
}

.pk-card-spec {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 3px 0;
	border-bottom: 1px solid var(--pk-card-border);
	font-size: var(--pk-fs-sm);
}

.pk-card-spec-label {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	flex: 0 0 auto;
	color: var(--pk-card-muted);
}

.pk-card-spec-icon {
	display: inline-flex;
	width: 15px;
	color: var(--pk-card-accent);
}

.pk-card-spec-icon svg {
	width: 15px;
	height: 15px;
	stroke: currentColor;
	fill: none;
}

.pk-card-spec-value {
	text-align: right;
	color: var(--pk-card-ink);
	white-space: nowrap;
}

/* --- Price --- */

.pk-card-price span.woocommerce-Price-amount.amount {
	font-size: var(--pk-fs-lg);
	line-height: 1.25;
	color: var(--pk-card-ink);
	margin-top: auto;
	/* display: flex; */
	flex-direction: column;
}

/* Enquiry-only products print an empty price so the card still lines up. */
.pk-card-price:empty {
	padding-top: 0;
}

.pk-card-price del span.woocommerce-Price-amount.amount {
	display: inline;
	margin-right: 6px;
	/* font-size: var(--pk-fs-xs); */
	font-weight: 400;
	color: var(--pk-card-muted);
}

.pk-card-price ins {
	text-decoration: none;
}

.pk-card-price .woocommerce-Price-taxLabel,
.pk-card-price small {
	font-size: var(--pk-fs-xs);
	font-weight: 400;
	color: var(--pk-card-muted);
}

/* --- Action --- */

.pk-card .product-action-wrap {
	margin-top: auto !important;
}

.pk-card .product-action-wrap .button {
	display: block;
	width: 100%;
	text-align: center;
}

/* Compare sits under the primary action rather than beside it. */
.pk-card .pk-compare-btn-loop {
	width: 100%;
	margin-top: 8px;
}

@media (max-width: 767px) {
	.pk-card {
		padding: 12px;
		gap: 8px;
	}

	.pk-card h2.woocommerce-loop-product__title {
		font-size: var(--pk-fs-sm);
	}

	.pk-card-price {
		font-size: var(--pk-fs-base);
	}
}