/**
 * Frontend buttons + wizard step buttons — the ONE definition for every module.
 *
 * Sizes   : :root --bk-ui-btn-* / --bk-ui-step-* (includes/styling/design-standard.php) and the
 *           Settings -> Styling button options (--bk-btn-padding-*, --bk-btn-font-size, border width/radius).
 * Colors  : --bk-btn-* (primary), --bk-btn-secondary-* (secondary), --bk-wizard-progress-* (steps),
 *           --bs-cal-btn-* (calendar navigation).
 *
 * Module stylesheets only do layout (width, margin, flex/grid placement) — never button chrome.
 * `body :is(...)` beats theme link/button rules without !important. :where() keeps layout defaults
 * (display, centering) weaker than module layout rules.
 *
 * To register a button class: add it to the ALL list and to exactly one of PRIMARY / SECONDARY.
 */

/* ------------------------------------------------------------------ layout defaults (ALL buttons) */
:where(
	.booking-next-step, .booking-submit, .event-sidebar-cta, .service-card-pick, .bs-svc-panel-continue,
	.bs-rsvp-widget__btn, .bs-combined-booking-continue__cta, .bs-combined-booking-continue__done,
	.bs-combined-booking-finish, .bs-hotel-search-bar__submit, .bs-rental-search-bar__submit,
	.bs-hotel-search-result-card__cta, .bs-hotel-search-result-card__book-link,
	.bs-hotel-search-result-card__choose-btn, .bs-hsr-btn-primary, .bs-hsr-summary-edit__apply,
	.bs-hotel-package-card__btn, .bs-hotel-package-cta__btn, .booking-stripe-pay-btn, .booking-swish-pay-btn,
	.booking-klarna-pay-btn, .booking-nexi-pay-btn, .bs-nexi-notice__close, .bs-event-list-item__book, .bs-event-grid-card__book,
	.bs-public-event-calendar__sidebar-book, .bs-booking-archive__load-more,
	.booking-prev-step, .bs-wizard-book-again, .bs-svc-panel-back, .event-sidebar-btn-secondary, .bs-hsr-btn-secondary, .bs-booking-coupon-apply, .bs-booking-coupon-remove,
	.bs-combined-order-coupon-apply, .bs-combined-order-coupon-remove,
	.bs-hsr-change-package, .bs-hsr-change-search, .bs-pkg-list__show-all, .bs-event-list-item__view, .bs-event-grid-card__view,
	.bs-public-event-calendar__sidebar-view, :where(.bs-single__back) .back-button,
	:where(.form-submit) input[type="submit"],
	.bookklar-login-form__submit, .bookklar-registration-form__submit
) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--bk-ui-btn-gap);
}

/* ------------------------------------------------------------------ chrome (ALL buttons) */
body :is(
	.booking-next-step, .booking-submit, .event-sidebar-cta, .service-card-pick, .bs-svc-panel-continue,
	.bs-rsvp-widget__btn, .bs-combined-booking-continue__cta, .bs-combined-booking-continue__done,
	.bs-combined-booking-finish, .bs-hotel-search-bar__submit, .bs-rental-search-bar__submit,
	.bs-hotel-search-result-card__cta, .bs-hotel-search-result-card__book-link,
	.bs-hotel-search-result-card__choose-btn, .bs-hsr-btn-primary, .bs-hsr-summary-edit__apply,
	.bs-hotel-package-card__btn, .bs-hotel-package-cta__btn, .booking-stripe-pay-btn, .booking-swish-pay-btn,
	.booking-klarna-pay-btn, .booking-nexi-pay-btn, .bs-nexi-notice__close, .bs-event-list-item__book, .bs-event-grid-card__book,
	.bs-public-event-calendar__sidebar-book, .bs-booking-archive__load-more,
	.booking-prev-step, .bs-wizard-book-again, .bs-svc-panel-back, .event-sidebar-btn-secondary, .bs-hsr-btn-secondary, .bs-booking-coupon-apply, .bs-booking-coupon-remove,
	.bs-combined-order-coupon-apply, .bs-combined-order-coupon-remove,
	.bs-hsr-change-package, .bs-hsr-change-search, .bs-pkg-list__show-all, .bs-event-list-item__view, .bs-event-grid-card__view,
	.bs-public-event-calendar__sidebar-view, :where(.bs-single__back) .back-button,
	:where(.form-submit) input[type="submit"],
	.bookklar-login-form__submit, .bookklar-registration-form__submit
) {
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	min-height: var(--bk-ui-btn-min-height);
	padding: var(--bk-btn-padding-top) var(--bk-btn-padding-right) var(--bk-btn-padding-bottom) var(--bk-btn-padding-left);
	border-style: solid;
	font-family: var(--bk-btn-font-family, inherit);
	font-size: var(--bk-btn-font-size);
	font-weight: var(--bk-ui-btn-font-weight);
	line-height: var(--bk-ui-btn-line-height);
	text-align: center;
	text-decoration: none;
	text-transform: var(--bk-btn-text-transform, none);
	letter-spacing: var(--bk-btn-letter-spacing, normal);
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;

	/* Primary */
	&:is(
		.booking-next-step, .booking-submit, .event-sidebar-cta, .service-card-pick, .bs-svc-panel-continue,
		.bs-rsvp-widget__btn, .bs-combined-booking-continue__cta, .bs-combined-booking-continue__done,
		.bs-combined-booking-finish, .bs-hotel-search-bar__submit, .bs-rental-search-bar__submit,
		.bs-hotel-search-result-card__cta, .bs-hotel-search-result-card__book-link,
		.bs-hotel-search-result-card__choose-btn, .bs-hsr-btn-primary, .bs-hsr-summary-edit__apply,
		.bs-hotel-package-card__btn, .bs-hotel-package-cta__btn, .booking-stripe-pay-btn,
		.booking-swish-pay-btn, .booking-klarna-pay-btn, .booking-nexi-pay-btn, .bs-nexi-notice__close, .bs-event-list-item__book, .bs-event-grid-card__book,
		.bs-public-event-calendar__sidebar-book, .bs-booking-archive__load-more,
		:where(.form-submit) input[type="submit"],
		.bookklar-login-form__submit, .bookklar-registration-form__submit
	) {
		background-color: var(--bk-btn-bg, var(--bk-btn-accent));
		border-width: var(--bk-btn-border-width);
		border-color: var(--bk-btn-border-color);
		border-radius: var(--bk-btn-border-radius);
		color: var(--bk-btn-text);

		&:is(:hover, :focus-visible, :active):not(:disabled, [aria-disabled="true"]),
		&.bs-hotel-search-result-card__choose-btn[aria-expanded="true"] {
			background-color: var(--bk-btn-accent-hover);
			border-color: var(--bk-btn-border-color-hover);
			color: var(--bk-btn-text-hover);
			text-decoration: none;
		}
	}

	/* Secondary (outline) — after primary so it wins on the Back buttons that also carry a primary class */
	&:is(
		.booking-prev-step, .bs-wizard-book-again, .bs-svc-panel-back, .event-sidebar-btn-secondary, .bs-hsr-btn-secondary, .bs-booking-coupon-apply, .bs-booking-coupon-remove,
	.bs-combined-order-coupon-apply, .bs-combined-order-coupon-remove,
		.bs-hsr-change-package, .bs-hsr-change-search, .bs-pkg-list__show-all, .bs-event-list-item__view, .bs-event-grid-card__view,
		.bs-public-event-calendar__sidebar-view, :where(.bs-single__back) .back-button,
		.bs-combined-booking-continue__cta:where(.bs-combined-booking-continue__cross-sell *)
	) {
		background-color: var(--bk-btn-secondary-bg, transparent);
		border-width: var(--bk-btn-secondary-border-width);
		border-color: var(--bk-btn-secondary-border);
		border-radius: var(--bk-btn-secondary-border-radius);
		color: var(--bk-btn-secondary-text);

		&:is(:hover, :focus-visible, :active):not(:disabled, [aria-disabled="true"]) {
			background-color: var(--bk-btn-secondary-bg-hover);
			border-color: var(--bk-btn-secondary-border-hover);
			color: var(--bk-btn-secondary-text-hover);
			text-decoration: none;
		}
	}

	&:focus-visible {
		outline: 2px solid rgba(var(--bk-btn-accent-rgb), 0.45);
		outline-offset: 2px;
	}

	&:is(:disabled, [aria-disabled="true"]) {
		opacity: 0.55;
		cursor: not-allowed;
	}
}

/* ------------------------------------------------------------------ calendar navigation (compact) */
body :is(.booking-calendar-view, .bs-public-event-calendar) .calendar-navigation button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: var(--bk-ui-field-compact-height);
	min-width: var(--bk-ui-field-compact-height);
	padding: 0 var(--bk-ui-field-padding-x);
	border: 1px solid var(--bs-cal-btn-border, var(--bk-cal-btn-border));
	border-radius: var(--bk-ui-field-radius);
	background-color: var(--bs-cal-btn-bg, var(--bk-cal-btn-bg));
	color: var(--bs-cal-btn-text, var(--bk-cal-btn-text));
	font-family: var(--bk-btn-font-family, inherit);
	font-size: var(--bk-ui-field-compact-font-size);
	font-weight: var(--bk-ui-btn-font-weight);
	line-height: var(--bk-ui-btn-line-height);
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;

	&:is(:hover, :focus-visible, :active) {
		background-color: var(--bs-cal-btn-bg-hover, var(--bk-cal-btn-bg-hover));
		border-color: var(--bs-cal-btn-border, var(--bk-cal-btn-border));
		color: var(--bs-cal-btn-text, var(--bk-cal-btn-text));
	}
}

/* ------------------------------------------------------------------ wizard step buttons (progress) */
:where(.booking-progress) {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--bk-ui-step-gap);
	width: 100%;
	margin-bottom: 20px;
}

body .booking-progress :is(.step, a.step) {
	flex: 1 1 0;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 0;
	margin: 0;
	min-height: var(--bk-ui-btn-min-height);
	padding: var(--bk-ui-step-padding-y) var(--bk-ui-step-padding-x);
	border: 1px solid var(--bk-wizard-progress-border);
	border-radius: var(--bk-wizard-progress-border-radius);
	background-color: var(--bk-wizard-progress-bg);
	color: var(--bk-wizard-progress-text);
	font-family: var(--bk-btn-font-family, inherit);
	font-size: var(--bk-wizard-progress-font-size);
	font-weight: var(--bk-ui-step-font-weight);
	line-height: var(--bk-ui-btn-line-height);
	text-align: center;
	text-decoration: none;
	box-shadow: none;
	outline: none;
	-webkit-tap-highlight-color: transparent;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
	/* "1." and the name are two spans (booking_system_wizard_step_tab()): the space between them. */
	column-gap: 0.3em;

	&:is(:hover, :focus, :focus-visible, :active):not(.active) {
		background-color: var(--bk-wizard-progress-bg);
		border-color: var(--bk-wizard-progress-border);
		color: var(--bk-wizard-progress-text);
		text-decoration: none;
	}

	&.active,
	&.active:is(:hover, :focus, :focus-visible, :active) {
		background-color: var(--bk-wizard-progress-active-bg);
		border-color: var(--bk-wizard-progress-active-border);
		color: var(--bk-wizard-progress-active-text);
		text-decoration: none;
	}
}

/* Phones: four or five names do not fit side by side ("1. Service & Service Extras" broke into five lines). The
   other steps show their number only (the name stays for screen readers), the current step its whole name. */
@media (max-width: 600px) {
	body .booking-progress :is(.step, a.step):not(.active):has(.booking-progress__label) {
		flex: 0 0 auto;
		min-width: 36px;
		padding-inline: 6px;
	}

	/* The name of the current step wraps as a sentence, not one word per line. */
	body .booking-progress :is(.step, a.step).active .booking-progress__label {
		min-width: 0;
		text-align: left;
	}

	body .booking-progress :is(.step, a.step):not(.active) .booking-progress__label {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
		border: 0;
	}

	body .booking-progress :is(.step, a.step).active:has(.booking-progress__label) {
		flex: 1 1 auto;
	}
}

/* ------------------------------------------------------------------ font of every other button
   Browsers give <button> their own font (Arial) instead of the page's, so time buttons in calendars and
   wizards looked different from the text around them. Zero specificity: a theme's button font still wins. */
:where(.booking-steps-wrapper, .booking-module, .booking-service-embed, [class^="bs-"], [class*=" bs-"]) :where(button) {
	font-family: inherit;
}

/* ------------------------------------------------------------------ long package lists (rooms)
   shared/package-list-compact.js: "What's included" on a compact package row is a text link in the accent
   color; packages past the first six wait behind "Show all packages (n)" (a secondary button above).
   [type] outranks the theme's own button look (Hello Elementor's `[type=button]` drew a pink framed button). */
button.bs-pkg-list__details-btn[type] {
	-webkit-appearance: none;
	appearance: none;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--bk-btn-accent, inherit);
	font-size: 0.85em;
	font-weight: 600;
	line-height: inherit;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}

button.bs-pkg-list__details-btn[type]:is(:hover, :focus, :active) {
	background: none;
	color: var(--bk-btn-accent, inherit);
	box-shadow: none;
}

/* The link takes the card's whole width (its own row), so a mouse click drew the theme's focus frame across the
   card; the frame stays for the keyboard. */
button.bs-pkg-list__details-btn[type]:focus:not(:focus-visible) {
	outline: none;
}

:is(.booking-packages-choices, .bs-hsr-package-choices) > li.bs-pkg-list__more {
	display: none !important; /* the package card layouts set display on their rows */
}

.bs-pkg-list__show-all {
	margin-top: 0.75rem;
}