/* WB Design System — Buttons */

.wb-button,
button.wb-button {
	display: inline-block;
	padding: 0.625rem 1.5rem;
	border: 0.125rem solid var(--wb-ctx-btn-outline-border);
	border-radius: var(--wb-ctx-radius, 0.9375rem);
	background: transparent;
	color: var(--wb-ctx-btn-outline-text, var(--wb-ctx-text, #fff));
	font-size: 0.9375rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: all 0.2s;
	text-align: center;
	line-height: 1.4;
}

.wb-button:hover,
.wb-button:focus,
.wb-button:active,
.wb-button:focus-visible,
button.wb-button:hover,
button.wb-button:focus,
button.wb-button:active,
button.wb-button:focus-visible {
	background: transparent;
	border-color: var(--wb-ctx-btn-outline-border);
	color: var(--wb-ctx-btn-outline-text, var(--wb-ctx-text, #fff));
	opacity: 0.85;
}

.wb-button:disabled,
button.wb-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.wb-button.wb-button-primary {
	background: var(--wb-ctx-btn-bg);
	border-color: var(--wb-ctx-btn-border);
	color: var(--wb-ctx-btn-text);
}

/* Filled variants: re-declare own properties on hover to beat theme resets */
.wb-button.wb-button-primary:hover,
.wb-button.wb-button-primary:focus,
.wb-button.wb-button-primary:active,
.wb-button.wb-button-primary:focus-visible {
	background: var(--wb-ctx-btn-bg);
	border-color: var(--wb-ctx-btn-border);
	color: var(--wb-ctx-btn-text);
}

.wb-button-lg {
	padding: 0.75rem 2rem;
	font-size: 1rem;
}

.wb-button-small {
	padding: 0.375rem 1rem;
	font-size: 0.8125rem;
}

.wb-button-dark {
	background: var(--wb-ctx-btn-bg);
	border-color: var(--wb-ctx-btn-border);
	color: var(--wb-ctx-btn-text);
}

.wb-button.wb-button-dark:hover,
.wb-button.wb-button-dark:focus,
.wb-button.wb-button-dark:active,
.wb-button.wb-button-dark:focus-visible {
	background: var(--wb-ctx-btn-bg);
	border-color: var(--wb-ctx-btn-border);
	color: var(--wb-ctx-btn-text);
}

.wb-button-outline {
	background: transparent;
}

/* Neon glow variant */
.wb-button-neon {
	border-color: #e5ff00 !important;
	box-shadow: 0 0 8px rgba(229, 255, 0, 0.4);
	transition: all 0.3s ease;
}

.wb-button.wb-button-neon:hover,
.wb-button.wb-button-neon:focus,
.wb-button.wb-button-neon:active,
.wb-button.wb-button-neon:focus-visible {
	border-color: #e5ff00 !important;
	box-shadow: 0 0 16px rgba(229, 255, 0, 0.6), 0 0 32px rgba(229, 255, 0, 0.3);
	opacity: 1;
	animation: wb-neon-pulse 1.5s ease-in-out infinite;
}

@keyframes wb-neon-pulse {
	0%, 100% { box-shadow: 0 0 16px rgba(229, 255, 0, 0.6), 0 0 32px rgba(229, 255, 0, 0.3); }
	50% { box-shadow: 0 0 24px rgba(229, 255, 0, 0.8), 0 0 48px rgba(229, 255, 0, 0.4); }
}

.wb-button-danger {
	border-color: #c0392b !important;
	color: #c0392b !important;
}

.wb-button-danger:hover {
	background: #c0392b !important;
	color: #fff !important;
}

/* Previous-step button (borderless) */
.wb-button.wb-btn-prev {
	background: transparent !important;
	border: 0 !important;
}

.wb-button.wb-btn-prev:hover,
.wb-button.wb-btn-prev:focus,
.wb-button.wb-btn-prev:active {
	background: var(--wb-ctx-btn-bg) !important;
}

/* Step navigation row */
.wb-step-buttons {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 1.5rem;
	gap: 0.75rem;
}

.wb-step-buttons-right {
	display: flex;
	gap: 0.75rem;
}

.wb-reset-link {
	color: var(--wb-ctx-text, #fff);
	opacity: 0.5;
	font-size: 0.8125rem;
	text-decoration: none;
	cursor: pointer;
	transition: opacity 0.2s;
}

.wb-reset-link:hover {
	opacity: 0.8;
	text-decoration: underline;
}