/* ========================================================================
   Amazon Product Cards — Public Frontend Styles
   Matches the "Recommended Equipment" card design.
   ======================================================================== */

/* ── Custom properties ─────────────────────────────────────────────────── */
.apc-section {
	--apc-primary:       #5c1b3e;
	--apc-primary-dark:  #421230;
	--apc-bg:            #f9eff7;
	--apc-img-bg:        #e9d5e7;
	--apc-border:        #e0cedc;
	--apc-text:          #3a1a2e;
	--apc-text-muted:    #5a4255;
	--apc-text-faint:    #7a5a72;
	--apc-radius:        12px;
}

/* ── Outer container ───────────────────────────────────────────────────── */
.apc-section {
	background:    var(--apc-bg);
	border-left:   5px solid var(--apc-primary);
	border-radius: var(--apc-radius);
	margin:        32px 0;
	overflow:      hidden;
	font-family:   -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size:     16px;
	line-height:   1.5;
	color:         var(--apc-text);
	box-sizing:    border-box;
}

.apc-section *,
.apc-section *::before,
.apc-section *::after {
	box-sizing: inherit;
}

/* ── Header ────────────────────────────────────────────────────────────── */
.apc-header {
	background:  var(--apc-primary);
	color:       #fff;
	padding:     13px 22px;
	display:     flex;
	align-items: center;
	gap:         12px;
}

.apc-header-icon {
	flex-shrink:    0;
	display:        flex;
	align-items:    center;
	opacity:        0.9;
}

.apc-header-icon svg {
	display: block;
}

.apc-header-title {
	font-size:      14px;
	font-weight:    800;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	line-height:    1.2;
}

/* ── Subtitle ──────────────────────────────────────────────────────────── */
.apc-subtitle {
	margin:      0;
	padding:     18px 24px 6px;
	color:       var(--apc-text);
	font-size:   15px;
	line-height: 1.65;
}

/* ── Product list ──────────────────────────────────────────────────────── */
.apc-products {
	padding: 4px 18px 6px;
}

.apc-product {
	display:         grid;
	grid-template-columns: 90px 1fr auto;
	gap:             16px;
	align-items:     center;
	padding:         18px 6px;
	border-bottom:   1px solid var(--apc-border);
}

.apc-product:last-child {
	border-bottom: none;
}

/* ── Product image ─────────────────────────────────────────────────────── */
.apc-product-image-wrap {
	width:           82px;
	height:          82px;
	border-radius:   50%;
	background:      var(--apc-img-bg);
	display:         flex;
	align-items:     center;
	justify-content: center;
	overflow:        hidden;
	flex-shrink:     0;
}

.apc-product-image-wrap img {
	width:      72px;
	height:     72px;
	object-fit: contain;
	display:    block;
}

.apc-product-image-placeholder {
	width:         56px;
	height:        56px;
	border-radius: 50%;
	background:    #d5bfd3;
}

/* ── Product text ──────────────────────────────────────────────────────── */
.apc-product-info {
	min-width: 0; /* allow text truncation inside grid */
}

.apc-product-name {
	margin:      0 0 5px;
	color:       var(--apc-primary);
	font-size:   16px;
	font-weight: 700;
	line-height: 1.3;
}

.apc-product-description {
	margin:      0;
	color:       var(--apc-text-muted);
	font-size:   14px;
	line-height: 1.55;
}

/* ── CTA button ────────────────────────────────────────────────────────── */
.apc-product-link {
	display:         inline-block;
	flex-shrink:     0;
	background:      var(--apc-primary);
	color:           #fff !important;
	padding:         10px 18px;
	border-radius:   8px;
	text-decoration: none !important;
	font-size:       14px;
	font-weight:     600;
	white-space:     nowrap;
	line-height:     1.4;
	transition:      background-color 0.18s ease;
}

.apc-product-link::after {
	content: " \2192"; /* → */
}

.apc-product-link:hover,
.apc-product-link:focus {
	background:      var(--apc-primary-dark) !important;
	color:           #fff !important;
	text-decoration: none !important;
}

/* ── Affiliate disclosure ──────────────────────────────────────────────── */
.apc-disclosure {
	display:     flex;
	align-items: center;
	gap:         7px;
	margin:      2px 0 0;
	padding:     8px 24px 16px;
	color:       var(--apc-text-faint);
	font-size:   13px;
}

.apc-disclosure-icon {
	flex-shrink: 0;
	display:     flex;
	align-items: center;
	opacity:     0.8;
}

.apc-disclosure-icon svg {
	display: block;
}

.apc-disclosure em {
	font-style: italic;
}

/* ── Block editor empty state ──────────────────────────────────────────── */
.apc-empty-block {
	padding:       20px;
	border:        2px dashed var(--apc-primary);
	border-radius: 8px;
	text-align:    center;
	color:         var(--apc-text-muted);
}

/* ── Responsive ────────────────────────────────────────────────────────── */
@media ( max-width: 640px ) {
	.apc-product {
		grid-template-columns: 72px 1fr;
		grid-template-rows:    auto auto;
		gap:                   12px;
	}

	.apc-product-image-wrap {
		width:  72px;
		height: 72px;
	}

	.apc-product-image-wrap img {
		width:  60px;
		height: 60px;
	}

	.apc-product-link {
		grid-column: 1 / -1;
		text-align:  center;
		display:     block;
	}

	.apc-subtitle {
		font-size: 14px;
	}
}

@media ( max-width: 400px ) {
	.apc-header {
		padding: 11px 16px;
	}

	.apc-products {
		padding-left:  10px;
		padding-right: 10px;
	}

	.apc-subtitle,
	.apc-disclosure {
		padding-left:  16px;
		padding-right: 16px;
	}
}