/**
 * Register CTA: match CRM @repo packages/ui Button (default variant) and sit above the featured image.
 * Template prints the CTA after the image in DOM; flex order pulls it up visually.
 */
#tribe-events-content .type-tribe_events[id^="post-"] {
	display: flex;
	flex-direction: column;
}

#tribe-events-content .type-tribe_events[id^="post-"] .tce-register-cta {
	order: -1;
	margin: 0 0 1.25rem;
}

/* Mirrors button.tsx default: rounded-md, h-9, px-4, text-sm font-medium, bg-primary, shadow-xs, focus ring */
.tce-register-cta__btn {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 2.25rem;
	padding: 0.5rem 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	font-weight: 500;
	white-space: nowrap;
	text-decoration: none;
	border-radius: 0.375rem;
	border: 1px solid transparent;
	/* stay-social preset primary / primary-foreground — override in theme if needed */
	background-color: var(--tce-register-btn-bg, #9cdbe0);
	color: var(--tce-register-btn-fg, #141414);
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
	transition:
		color 0.15s ease,
		background-color 0.15s ease,
		box-shadow 0.15s ease;
}

.tce-register-cta__btn:hover {
	background-color: var(--tce-register-btn-bg-hover, color-mix(in srgb, #9cdbe0 90%, #000));
	color: var(--tce-register-btn-fg, #141414);
}

.tce-register-cta__btn:focus {
	outline: none;
}

.tce-register-cta__btn:focus-visible {
	outline: none;
	box-shadow:
		0 1px 2px 0 rgb(0 0 0 / 0.05),
		0 0 0 3px color-mix(in srgb, #9cdbe0 50%, transparent);
}