/* Event Booking Manager — front-end styles.
   Deliberately plain: hairline dividers and simple tables, matching the
   confirmation page look, rather than boxed cards or decorative flourishes.
   Typography inherits the host theme's fonts, since this sits inside an
   existing site rather than being a standalone page. */

.ebm-events-archive,
.ebm-single-event,
[class*="ebm-"] {
	--ebm-pine: #22392a;
	--ebm-pine-light: #3c5d45;
	--ebm-amber: #c8932f;
	--ebm-ink: #23271f;
	--ebm-line: #dcd6c4;
	--ebm-danger: #a6402f;
	box-sizing: border-box;
}

[class*="ebm-"] *,
[class*="ebm-"] *::before,
[class*="ebm-"] *::after {
	box-sizing: border-box;
}

/* ---------- Events list: plain full-width rows ---------- */

.ebm-events-archive {
	max-width: 900px;
	margin: 0 auto;
	padding: 0 1.25rem;
}

.ebm-events-archive h1 {
	font-size: 2rem;
	font-weight: 700;
}

.ebm-events-list {
	display: flex;
	flex-direction: column;
	max-width: 900px;
	margin: 0 auto;
}

.ebm-event-row {
	display: flex;
	gap: 1.25rem;
	padding: 1.5rem 0;
	border-bottom: 1px solid var(--ebm-line);
	align-items: flex-start;
}

.ebm-event-row:first-child {
	border-top: 1px solid var(--ebm-line);
}

.ebm-event-thumb {
	flex: 0 0 180px;
	display: block;
}

.ebm-event-thumb img {
	width: 180px;
	height: 120px;
	object-fit: cover;
	display: block;
}

.ebm-event-row-content {
	flex: 1;
	min-width: 0;
}

.ebm-event-row-content h2 {
	margin: 0 0 0.25rem;
	font-size: 1.3rem;
}

.ebm-event-row-content h2 a {
	color: var(--ebm-ink);
	text-decoration: none;
}

.ebm-event-row-content h2 a:hover {
	color: var(--ebm-pine);
}

.ebm-event-meta {
	color: var(--ebm-pine-light);
	font-size: 0.9em;
	font-weight: 600;
}

.ebm-event-row-content p {
	margin: 0.4rem 0;
}

.ebm-from-price {
	font-weight: 700;
	color: var(--ebm-pine);
}

.ebm-sold-out {
	color: var(--ebm-danger);
	font-weight: 700;
}

.ebm-book-now {
	display: inline-block;
	margin-top: 0.4rem;
	background: var(--ebm-pine);
	color: #fff !important;
	text-decoration: none;
	font-weight: 700;
	font-size: 0.9em;
	padding: 0.55rem 1rem;
	border-radius: 4px;
}

.ebm-book-now:hover {
	background: var(--ebm-pine-light);
	color: #fff !important;
}

@media (max-width: 480px) {
	.ebm-event-row {
		flex-direction: column;
	}
	.ebm-event-thumb,
	.ebm-event-thumb img {
		width: 100%;
		flex: none;
	}
}

/* ---------- Single event / booking form ---------- */

.ebm-single-event {
	max-width: 820px;
	margin: 0 auto;
	padding: 0 1.25rem;
}

/* Overrides the host theme's own (often oversized) h1 style for the event
   title specifically — the page's content column is otherwise at the mercy
   of whatever heading scale the theme happens to use. */
.ebm-single-event h1 {
	margin-bottom: 0.2rem;
	font-size: 2rem;
	line-height: 1.25;
	font-weight: 700;
}

.ebm-single-event .ebm-event-meta {
	font-size: 0.95em;
	margin-bottom: 1.25rem;
	display: block;
}

.ebm-event-content {
	margin-bottom: 1.5rem;
	line-height: 1.65;
}

.ebm-single-event h2,
.ebm-single-event h3 {
	color: var(--ebm-pine);
	border-bottom: 1px solid var(--ebm-line);
	padding-bottom: 0.4rem;
	margin-top: 2rem;
	font-size: 1.3rem;
}

.ebm-form-warning {
	background: rgba(200, 147, 47, 0.14);
	border: 1px solid rgba(200, 147, 47, 0.45);
	color: #6b4a15;
	border-radius: 4px;
	padding: 0.85rem 1.1rem;
	margin-bottom: 1rem;
	font-weight: 600;
}

.ebm-fields {
	margin-bottom: 1rem;
}

.ebm-field {
	margin-bottom: 1.1rem;
}

.ebm-field label {
	display: block;
	font-weight: 600;
	color: var(--ebm-ink);
	margin-bottom: 0.35rem;
}

.ebm-field input[type="text"],
.ebm-field input[type="email"],
.ebm-field input[type="tel"],
.ebm-field textarea {
	width: 100%;
	max-width: 420px;
	padding: 0.6rem 0.7rem;
	border: 1px solid var(--ebm-line);
	border-radius: 4px;
	font-size: 1rem;
	background: #fff;
	color: var(--ebm-ink);
}

.ebm-field--checkbox {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.ebm-field--checkbox label {
	margin-bottom: 0;
	order: 2;
}

.ebm-field input:focus,
.ebm-field textarea:focus {
	outline: none;
	border-color: var(--ebm-amber);
	box-shadow: 0 0 0 2px rgba(200, 147, 47, 0.25);
}

/* ---------- Booking wizard modal ---------- */

.ebm-open-booking-btn {
	background: var(--ebm-pine) !important;
	color: #fff !important;
	border: none !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	padding: 0.8rem 1.6rem !important;
	border-radius: 4px !important;
	height: auto !important;
}

.ebm-open-booking-btn:hover {
	background: var(--ebm-pine-light) !important;
}

/*
 * Self-contained front-end button styling — deliberately not relying on a
 * generic `.button`/`.button-primary` class, since neither is actually
 * styled by this plugin's own CSS and the theme's front-end styling for
 * them turned out to be unreliable (see the resend-confirmation button,
 * which rendered as plain unstyled text). !important guards against
 * whatever the theme does define for bare `button` elements.
 */
.ebm-btn,
.ebm-btn-primary {
	display: inline-block !important;
	font-family: inherit !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	padding: 0.55rem 1.1rem !important;
	border-radius: 4px !important;
	cursor: pointer !important;
	text-decoration: none !important;
}

.ebm-btn {
	background: #fff !important;
	color: var(--ebm-ink) !important;
	border: 1px solid var(--ebm-line) !important;
}

.ebm-btn:hover {
	background: #f5f3ee !important;
}

.ebm-btn:disabled {
	opacity: 0.5 !important;
	cursor: default !important;
}

.ebm-btn-primary {
	background: var(--ebm-pine) !important;
	color: #fff !important;
	border: none !important;
}

.ebm-btn-primary:hover {
	background: var(--ebm-pine-light) !important;
}

.ebm-resend-section {
	max-width: 480px;
	margin: 2rem auto;
}

.ebm-resend-notice {
	background: #f5f3ee;
	border: 1px solid var(--ebm-line);
	border-radius: 6px;
	padding: 0.9rem 1.1rem;
	font-size: 0.95rem;
}

.ebm-resend-details {
	border: 1px solid var(--ebm-line);
	border-radius: 6px;
	padding: 0.9rem 1.1rem;
}

.ebm-resend-details summary {
	cursor: pointer;
	font-weight: 600;
	color: var(--ebm-ink);
}

.ebm-resend-form-inner {
	margin-top: 0.9rem;
}

.ebm-resend-form-inner .ebm-field {
	margin-bottom: 0.8rem;
}

.ebm-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(20, 26, 20, 0.55);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100000;
	padding: 1.5rem;
}

.ebm-modal {
	background: #fff;
	border-radius: 8px;
	width: 100%;
	max-width: 680px;
	max-height: 92vh;
	overflow-y: auto;
	position: relative;
	padding: 2.25rem;
	box-shadow: 0 20px 50px -12px rgba(0, 0, 0, 0.35);
}

.ebm-modal-close {
	position: absolute;
	top: 0.75rem;
	right: 0.9rem;
	background: none;
	border: none;
	font-size: 1.75rem;
	line-height: 1;
	color: var(--ebm-ink);
	opacity: 0.5;
	cursor: pointer;
	padding: 0.25rem;
}

.ebm-modal-close:hover {
	opacity: 1;
}

.ebm-tab-strip {
	display: flex;
	justify-content: space-between;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
	padding-right: 1.5rem;
}

.ebm-tab-step {
	flex: 1;
	text-align: center;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #b9b3a0;
	padding-bottom: 0.4rem;
	border-bottom: 2px solid var(--ebm-line);
}

.ebm-tab-step--active {
	color: var(--ebm-pine);
	border-bottom-color: var(--ebm-pine);
}

.ebm-tab-step--done {
	color: var(--ebm-pine-light);
}

.ebm-tab-step:not(:last-child)::after {
	content: "";
}

.ebm-modal-body {
	min-height: 120px;
}

.ebm-legal-consent {
	margin-top: 1.25rem;
	padding-top: 1rem;
	border-top: 1px solid var(--ebm-line);
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
}

.ebm-legal-consent input[type="checkbox"] {
	-webkit-appearance: checkbox;
	appearance: auto;
	width: 18px;
	height: 18px;
	min-width: 18px;
	max-width: 18px;
	padding: 0;
	margin: 0.2rem 0 0;
	border-radius: 3px;
	flex: 0 0 18px;
}

.ebm-legal-consent label {
	font-weight: 400;
	margin-bottom: 0;
	order: 0;
	color: var(--ebm-ink);
	line-height: 1.5;
	flex: 1 1 auto;
	min-width: 0;
}

.ebm-legal-link {
	background: none;
	border: none;
	padding: 0;
	color: var(--ebm-pine);
	text-decoration: underline;
	cursor: pointer;
	font: inherit;
}

.ebm-legal-link:hover {
	color: var(--ebm-pine-light);
}

.ebm-legal-modal-body {
	max-width: 60ch;
}

.ebm-legal-modal-body h2 {
	margin-top: 0;
}

.ebm-legal-modal-body p {
	line-height: 1.6;
}

.ebm-modal-footer {
	display: flex;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: 1.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--ebm-line);
}

.ebm-step-back {
	background: #fff !important;
}

.ebm-step-back:disabled {
	visibility: hidden;
}

.ebm-step-next,
.ebm-step-submit {
	background: var(--ebm-pine) !important;
	color: #fff !important;
	border: none !important;
	margin-left: auto;
}

.ebm-step-next:hover,
.ebm-step-submit:hover {
	background: var(--ebm-pine-light) !important;
}

.ebm-cart-summary {
	margin-bottom: 0.5rem;
}

.ebm-cart-line {
	display: flex;
	justify-content: space-between;
	padding: 0.5rem 0;
	border-bottom: 1px solid var(--ebm-line);
}

.ebm-cart-total {
	border-bottom: none;
	border-top: 2px solid var(--ebm-pine);
	font-weight: 700;
	margin-top: 0.25rem;
	padding-top: 0.6rem;
}

.ebm-cart-empty {
	color: var(--ebm-ink);
	opacity: 0.7;
}

@media (max-width: 480px) {
	.ebm-modal {
		padding: 1.25rem;
	}
	.ebm-tab-strip {
		gap: 0.3rem 0.6rem;
	}
}

.ebm-booking-form button[type="submit"] {
	background: var(--ebm-pine);
	color: #fff;
	border: none;
	font-size: 1.05rem;
	font-weight: 700;
	padding: 0.75rem 1.5rem;
	border-radius: 4px;
	cursor: pointer;
}

.ebm-booking-form button[type="submit"]:hover {
	background: var(--ebm-pine-light);
}

.ebm-payment-note {
	font-size: 0.85em;
	color: var(--ebm-ink);
	opacity: 0.7;
	margin-top: 0.6rem;
}

.ebm-line-items {
	margin-bottom: 1.25rem;
}

.ebm-line-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--ebm-line);
}

.ebm-line-items .ebm-line-item:first-child {
	border-top: 1px solid var(--ebm-line);
}

.ebm-line-item-info {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.ebm-line-item-name {
	font-weight: 600;
	color: var(--ebm-ink);
}

.ebm-line-item-price {
	font-size: 0.9em;
	color: var(--ebm-pine-light);
}

.ebm-line-item-qty {
	width: 4.5rem;
	flex-shrink: 0;
	padding: 0.5rem 0.6rem;
	border: 1px solid var(--ebm-line);
	border-radius: 4px;
	font-size: 1rem;
	text-align: center;
	background: #fff;
	color: var(--ebm-ink);
}

.ebm-line-item-qty:focus {
	outline: none;
	border-color: var(--ebm-amber);
	box-shadow: 0 0 0 2px rgba(200, 147, 47, 0.25);
}

.ebm-line-item--sold-out {
	opacity: 0.6;
}

.ebm-line-item-status {
	font-size: 0.85em;
	font-weight: 600;
	color: var(--ebm-danger);
	flex-shrink: 0;
}

@media (max-width: 480px) {
	.ebm-line-item {
		align-items: center;
	}
}

/* ---------- Confirmation page ---------- */

.ebm-confirmation {
	border-radius: 4px;
	padding: 1.75rem;
	margin: 1.5rem auto;
	max-width: 640px;
}

.ebm-confirmation h2 {
	margin-top: 0;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.ebm-confirmation--paid {
	background: rgba(34, 57, 42, 0.07);
	border: 1px solid rgba(34, 57, 42, 0.25);
}

.ebm-confirmation--paid h2::before {
	content: "✓";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: 50%;
	background: var(--ebm-pine);
	color: #fff;
	font-size: 1rem;
}

.ebm-confirmation--pending {
	background: rgba(200, 147, 47, 0.1);
	border: 1px solid rgba(200, 147, 47, 0.35);
}

.ebm-confirmation h3 {
	margin-top: 1.5rem;
	margin-bottom: 0.5rem;
	font-size: 1rem;
	color: var(--ebm-pine);
}

.ebm-confirmation-summary {
	width: 100%;
	border-collapse: collapse;
}

.ebm-confirmation-summary td {
	padding: 0.45rem 0;
	border-bottom: 1px solid var(--ebm-line);
}

.ebm-confirmation-summary td:first-child {
	color: var(--ebm-ink);
}

.ebm-summary-price {
	text-align: right;
	font-weight: 600;
	white-space: nowrap;
}

.ebm-summary-total td {
	border-bottom: none;
	border-top: 2px solid var(--ebm-pine);
	font-weight: 700;
	padding-top: 0.6rem;
}

/* ---------- Custom page shell (replaces broken legacy theme header/footer) ---------- */

body.ebm-plugin-page {
	margin: 0;
	font-family: inherit;
}

.ebm-site-header {
	background: #fff;
	border-bottom: 3px solid var(--ebm-pine, #22392a);
}

.ebm-site-header-inner {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	max-width: 1000px;
	margin: 0 auto;
	padding: 1.1rem 1.25rem;
	min-height: 92px;
}

.ebm-site-logo {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

.ebm-site-logo img {
	height: 68px;
	width: auto;
	display: block;
}

.ebm-site-header-title {
	font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ebm-pine, #22392a);
	text-decoration: none;
}

@media (max-width: 480px) {
	.ebm-site-header-inner {
		padding: 1rem 1rem;
		gap: 0.6rem;
	}
	.ebm-site-logo img {
		height: 52px;
	}
	.ebm-site-header-title {
		font-size: 1.05rem;
	}
}

.ebm-site-main {
	max-width: 960px;
	margin: 0 auto;
	padding: 2rem 1.25rem;
}

/* ---------- Accessibility ---------- */

[class*="ebm-"] a:focus-visible,
[class*="ebm-"] button:focus-visible,
[class*="ebm-"] input:focus-visible {
	outline: 3px solid var(--ebm-amber);
	outline-offset: 2px;
}