/*
 * Wine & Balance button.
 *
 * Scoped to .wbb-* so it cannot leak into the host theme, and limited to the
 * approved campaign palette (PLAN.md §9). No page-builder dependency.
 */

.wbb-block {
	display: flex;
}

.wbb-block--center {
	justify-content: center;
}

.wbb-block--right {
	justify-content: flex-end;
}

.wbb-button {
	--wbb-burgundy: #56101d;
	--wbb-burgundy-dark: #430c17;
	--wbb-champagne: #e6d0a0;
	--wbb-champagne-dark: #d4b87c;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	border: 2px solid transparent;
	border-radius: 999px;
	font-family: inherit;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

.wbb-button:hover,
.wbb-button:focus {
	text-decoration: none;
}

/* A focus ring that stays visible on light and dark host themes. */
.wbb-button:focus-visible {
	outline: 3px solid var(--wbb-champagne-dark);
	outline-offset: 3px;
}

.wbb-button--small {
	padding: 0.5em 1.15em;
	font-size: 0.875rem;
}

.wbb-button--medium {
	padding: 0.7em 1.6em;
	font-size: 1rem;
}

.wbb-button--large {
	padding: 0.9em 2em;
	font-size: 1.125rem;
}

.wbb-button--burgundy {
	background-color: var(--wbb-burgundy);
	border-color: var(--wbb-burgundy);
	color: var(--wbb-champagne);
}

.wbb-button--burgundy:hover,
.wbb-button--burgundy:focus {
	background-color: var(--wbb-burgundy-dark);
	border-color: var(--wbb-burgundy-dark);
	color: #fff;
}

.wbb-button--champagne {
	background-color: var(--wbb-champagne);
	border-color: var(--wbb-champagne);
	color: var(--wbb-burgundy);
}

.wbb-button--champagne:hover,
.wbb-button--champagne:focus {
	background-color: var(--wbb-champagne-dark);
	border-color: var(--wbb-champagne-dark);
	color: var(--wbb-burgundy-dark);
}

.wbb-button--outline {
	background-color: transparent;
	border-color: var(--wbb-burgundy);
	color: var(--wbb-burgundy);
}

.wbb-button--outline:hover,
.wbb-button--outline:focus {
	background-color: var(--wbb-burgundy);
	color: var(--wbb-champagne);
}

@media (prefers-reduced-motion: reduce) {
	.wbb-button {
		transition: none;
	}
}

/* Themes do not all provide .screen-reader-text; make sure ours exists. */
.wbb-button .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}