/* Loaded on every page containing the [reenergized_booking] shortcode.
   Two layers:
   1. Always-on defensive resets scoped under #reenergized-app so the host
      theme (Cornerstone, Elementor, block themes) can't bleed heading
      colors / font weights / margins into the React widget.
   2. Chrome-stripping rules gated by body.reenergized-booking-page — only
      added in local dev (no theme to coexist with). On prod we keep the
      site header/footer.

   The #reenergized-app selector gives ID specificity (1,0,1) which beats
   typical theme rules like .entry-content h1 (0,1,1). */

/* Minimal heading + link reset. Defeats the proven theme bleed (Cornerstone's
   .page h1 { color: #fff }) without clobbering component-level font-weight,
   margin, line-height, letter-spacing, etc. — the way an over-broad reset did.

   If a NEW property bleeds (e.g. theme adds a font-weight rule on h2), do NOT
   add it here — instead bump the affected component CSS selector with
   :global(#reenergized-app) so it lands at (1,1,0) and wins cleanly over both
   the theme and any reset. */
#reenergized-app h1,
#reenergized-app h2,
#reenergized-app h3,
#reenergized-app h4,
#reenergized-app h5,
#reenergized-app h6 {
	color: inherit;
	font-family: inherit;
}

#reenergized-app a {
	color: inherit;
	text-decoration: none;
}

/* Form-element baseline bleed defense. Themes often inject font/color on
   inputs. We DO NOT reset :focus here — that's component territory. If a
   component's focus styles are getting beaten by a theme rule like
   input[type=email]:focus (specificity 0,2,1), bump the component CSS
   selector by wrapping in :global(#reenergized-app) to land at (1,1,1). */
#reenergized-app input,
#reenergized-app textarea,
#reenergized-app select,
#reenergized-app button {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
}

html,
body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
}

body.reenergized-booking-page {
	font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
	background: #e9e1d0;
	color: #3A3631;
	/* Override block-theme layout variables so nothing constrains the React app. */
	--wp--style--global--content-size: 100%;
	--wp--style--global--wide-size: 100%;
	--wp--preset--spacing--40: 0;
	--wp--preset--spacing--50: 0;
	--wp--preset--spacing--60: 0;
}

/* Hide common theme header/footer/navigation chrome on this page only. */
body.reenergized-booking-page > header,
body.reenergized-booking-page > footer,
body.reenergized-booking-page header.wp-block-template-part,
body.reenergized-booking-page footer.wp-block-template-part,
body.reenergized-booking-page .site-header,
body.reenergized-booking-page .site-footer,
body.reenergized-booking-page .wp-block-template-part[data-type='wp_template_part'],
body.reenergized-booking-page .entry-header,
body.reenergized-booking-page .entry-footer,
body.reenergized-booking-page .post-thumbnail,
body.reenergized-booking-page .wp-block-post-title {
	display: none !important;
}

/* Strip default content layout constraints so the React app can center itself. */
body.reenergized-booking-page .wp-site-blocks,
body.reenergized-booking-page main,
body.reenergized-booking-page .wp-block-group,
body.reenergized-booking-page .entry-content,
body.reenergized-booking-page .wp-block-post-content,
body.reenergized-booking-page .is-layout-constrained,
body.reenergized-booking-page .is-layout-flow,
body.reenergized-booking-page .has-global-padding,
body.reenergized-booking-page article,
body.reenergized-booking-page .wp-block-post {
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.reenergized-booking-page .wp-site-blocks,
body.reenergized-booking-page main {
	min-height: 100vh;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

body.reenergized-booking-page #reenergized-app {
	width: 100%;
	display: flex;
	justify-content: center;
}