/**
 * Reusable prototype-derived component contracts.
 *
 * Screen sheets retain their own geometry and WooCommerce-specific bridges.
 */

.jd-section-head {
	display: flex;
	align-items: center;
	gap: var(--jd-space-6);
	margin-block-end: var(--jd-space-8);
}

.jd-section-head > :is(h2, h3) {
	margin: 0;
	color: var(--jd-navy);
	font-size: var(--jd-fs-section);
	line-height: var(--jd-lh-title);
}

.jd-rule {
	flex: 1;
	block-size: 1px;
	background-color: var(--jd-hairline);
}

.jd-card--paper { background-color: var(--jd-surface); }
.jd-card--navy { background-color: var(--jd-navy); color: var(--jd-on-navy); }

.jd-alert {
	padding: var(--jd-space-6) var(--jd-space-8);
	border: var(--jd-border);
	border-radius: var(--jd-radius-tag);
	font-size: var(--jd-fs-sm);
	line-height: var(--jd-lh-body);
}

.jd-alert--success { border-color: var(--jd-emerald); color: var(--jd-emerald); }
.jd-alert--warning { border-color: var(--jd-brass); color: var(--jd-brass); }
.jd-alert--error { border-color: var(--jd-danger); color: var(--jd-danger); }

.jd-meta-list {
	display: grid;
	gap: var(--jd-space-4);
	margin: 0;
}

.jd-meta-list > div {
	display: flex;
	justify-content: space-between;
	gap: var(--jd-space-6);
}

.jd-meta-list dt { color: var(--jd-text-secondary); }
.jd-meta-list dd { margin: 0; color: var(--jd-ink); }