/**
 * Base/reset styles, scoped under .tsc-booking-app so nothing here can
 * leak into the surrounding theme, and so unrelated theme styles (Astra/
 * Elementor global typography, spacing utility classes, etc.) cannot
 * unexpectedly break this interface — every rule in this file and its
 * siblings is written against a `.tsc-booking-app <selector>` shape.
 */

.tsc-booking-app {
	box-sizing: border-box;
	font-family: var(--tscb-font-body);
	font-size: var(--tscb-font-size-base);
	line-height: var(--tscb-line-height-base);
	color: var(--tscb-color-text);
	background: var(--tscb-color-background);
}

.tsc-booking-app *,
.tsc-booking-app *::before,
.tsc-booking-app *::after {
	box-sizing: inherit;
}

.tsc-booking-app h1,
.tsc-booking-app h2,
.tsc-booking-app h3,
.tsc-booking-app h4 {
	font-family: var(--tscb-font-heading);
	line-height: var(--tscb-line-height-heading);
	font-weight: var(--tscb-font-weight-bold);
	margin: 0 0 var(--tscb-space-3) 0;
	color: var(--tscb-color-text);
}

.tsc-booking-app h1 {
	font-size: var(--tscb-font-size-2xl);
}

.tsc-booking-app h2 {
	font-size: var(--tscb-font-size-xl);
}

.tsc-booking-app p {
	margin: 0 0 var(--tscb-space-4) 0;
}

.tsc-booking-app img {
	max-width: 100%;
	height: auto;
	display: block;
}

.tsc-booking-app button {
	font-family: inherit;
	font-size: inherit;
}

/* A single, consistent focus treatment for every interactive element in
   this interface — visible, never suppressed, never colour-only. */
.tsc-booking-app :focus-visible {
	outline: 2px solid transparent;
	box-shadow: var(--tscb-shadow-focus);
	border-radius: var(--tscb-radius-sm);
}

.tsc-booking-app :focus:not(:focus-visible) {
	outline: none;
}

/* Visually-hidden but screen-reader-available text (labels, live-region
   status text that doesn't need a visible home). */
.tsc-booking-app .tscb-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Alpine's x-cloak: hides not-yet-initialised templates so the customer
   never sees raw {{ }}-style interpolation or unstyled content flash
   before Alpine attaches. */
.tsc-booking-app [x-cloak] {
	display: none !important;
}

/* Brand colours for links and choice controls, whatever the theme's own
   link colour is (the old theme palette made these purple). */
.tsc-booking-app a {
	color: var(--tscb-color-primary);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.tsc-booking-app a:hover,
.tsc-booking-app a:focus-visible {
	color: var(--tscb-color-text);
}

.tsc-booking-app input[type='radio'],
.tsc-booking-app input[type='checkbox'] {
	accent-color: var(--tscb-color-primary);
}
