/* ==========================================================================
 * Sale campaigns on the storefront (inc/arbor-campaign.php). Loaded only while
 * a campaign is live. The campaign's style arrives as --c-bg / --c-fg / --c-dot
 * on each surface and paints the bar, strip pill, band and pill only — savings
 * stay crimson (--ds-brand), prices stay ink. Arbor rules: no borders, no
 * shadows; fills, radius and spacing.
 * ========================================================================== */

/* ---- Announcement bar ---- */
body.arbor-ds .arbor-announce--campaign { background: var(--c-bg); color: var(--c-fg); }
body.arbor-ds .arbor-announce--campaign .arbor-announce__msg { color: inherit; text-decoration: none; }
body.arbor-ds .arbor-announce--campaign .arbor-announce__msg:hover b,
body.arbor-ds .arbor-announce--campaign .arbor-announce__msg:focus-visible b { text-decoration: underline; text-underline-offset: 2px; }
body.arbor-ds .arbor-announce--campaign b { font-weight: 700; }
.arbor-announce--campaign .arbor-nowrap,
.arbor-campaign-clock { white-space: nowrap; }
.arbor-campaign-clock {
	display: inline-block;
	margin-left: 10px;
	padding: 1px 10px;
	border-radius: var(--ds-radius-pill);
	background: color-mix(in srgb, var(--c-fg) 18%, transparent);
	font-variant-numeric: tabular-nums;
}
.arbor-campaign-clock[hidden] { display: none; }

/* ---- Pill (campaign name) ---- */
.arbor-campaign-pill {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 11px;
	border-radius: var(--ds-radius-pill);
	background: var(--c-bg);
	color: var(--c-fg);
	font-family: var(--ds-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.2;
	white-space: nowrap;
}
.arbor-campaign-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-dot); flex: 0 0 6px; }

/* ---- Room / category strip ---- */
.arbor-campaign-strip { padding: var(--ds-space-3) 0 0; }
/* Room pages: the hero is a white band and the next (category shelf) band is
   grey, so the strip moves up into the hero's bottom padding and keeps a full
   band gap below it — it belongs to the white band instead of hanging off the
   grey one's edge. */
.arbor-campaign-strip--room {
	margin-top: calc(var(--ds-space-5) - var(--ds-space-6)); /* 48px under the hero's content */
	padding: 0 0 var(--ds-space-5);                            /* 48px to the grey band's edge */
}
.arbor-campaign-strip__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	padding: 14px 18px;
	border-radius: 20px;
	background: var(--ds-surface);
	color: var(--ds-ink);
	font-family: var(--ds-font-body);
	font-size: 15px;
}

/* ---- Homepage band ----
   24px from the hero and 24px to the next band's edge (that band is grey, so
   its edge — not its text — is what the eye measures). The band moves up into
   the hero's bottom padding (48px desktop, 32px phone) instead of adding to it.
   With no campaign nothing is printed, so the homepage keeps its rhythm. */
.arbor-campaign-band {
	margin-top: calc(var(--ds-space-3) - var(--ds-space-5));
	padding: 0 0 var(--ds-space-3);
}
.arbor-campaign-band__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--ds-space-3);
	padding: var(--ds-space-4) var(--ds-space-5);
	border-radius: var(--ds-radius);
	background: var(--c-bg);
	color: var(--c-fg);
}
.arbor-campaign-band__text { flex: 1 1 360px; min-width: 0; }
body.arbor-ds .arbor-campaign-band__title {
	margin: 0 0 6px;
	color: inherit !important;
	font-family: var(--ds-font-head);
	font-size: clamp(26px, 3.4vw, 36px);
	font-weight: 800;
	line-height: 1.1;
}
.arbor-campaign-band__sub { margin: 0; color: inherit; font-size: 16px; opacity: .92; }
body.arbor-ds .arbor-campaign-band__cta {
	display: inline-block;
	padding: 14px 26px;
	border-radius: var(--ds-radius-pill);
	background: var(--c-fg);
	color: var(--c-bg) !important;
	font-family: var(--ds-font-head);
	font-size: var(--ds-fs-button);
	font-weight: var(--ds-fw-button);
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}

/* ---- Product cards ---- */
body.arbor-ds .arbor-campaign-was,
body.arbor-ds .arbor-campaign-was .woocommerce-Price-amount {
	color: var(--ds-body) !important;
	font-weight: 400 !important;
	text-decoration: line-through;
	margin-right: 6px;
}
.arbor-campaign-card-line {
	display: block;
	margin-top: 2px;
	color: var(--ds-brand);
	font-family: var(--ds-font-body);
	font-size: 12.5px;
	font-weight: 600;
}
body.arbor-ds .arbor-campaign-badged .gs-product-thumbnail::before {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	padding: 6px 14px;
	border-radius: var(--ds-radius-pill);
	background: var(--ds-brand);
	color: var(--ds-on-brand);
	font-family: var(--ds-font-body);
	font-size: 12px;
	font-weight: var(--ds-fw-button);
	letter-spacing: .04em;
}

/* ---- Product page: quiet text, no box, no pills ---- */
.arbor-campaign-plannote { margin: 8px 0 0; color: var(--ds-body); font-size: 13px; line-height: 1.4; }
.arbor-campaign-pdp { margin: 6px 0 12px; color: var(--ds-body); font-size: 13px; line-height: 1.5; }

/* ---- Cart, checkout, order ---- */
body.arbor-ds .arbor-campaign-row td { padding-top: 0 !important; color: var(--ds-body); font-size: 13px; text-align: left; }
.arbor-campaign-ordernote { margin: var(--ds-space-3) 0; color: var(--ds-brand); font-weight: 600; }

@media (max-width: 768px) {
	/* Phones: the hero's bottom padding is 32px. */
	.arbor-campaign-band { margin-top: calc(var(--ds-space-3) - var(--ds-space-4)); }
	.arbor-campaign-strip--room { margin-top: calc(var(--ds-space-4) - var(--ds-space-5)); padding-bottom: var(--ds-space-4); }
	.arbor-campaign-band__inner { padding: var(--ds-space-3); border-radius: 24px; }
	.arbor-campaign-strip__inner { font-size: 14px; }
}