/*
 * Elementor-only corrections.
 *
 * Loaded after elementor-frontend (see inc/enqueue.php), because Elementor
 * enqueues its stylesheet after the theme's and a same-specificity rule in
 * theme.css would lose. Nothing here is decoration — every rule fixes a
 * concrete conflict between Elementor's defaults and this design.
 */

/* Elementor sets its own heading colour from the kit, but the kit does not
   cover headings inside a widget that has its own colour control left empty. */
.hotel-elementor-page .elementor-heading-title {
	font-family: var(--hotel-font-display);
	color: var(--hotel-primary);
}

/* Elementor's default section padding fights the theme's section rhythm on the
   canvas template, where the theme adds none of its own. */
.hotel-elementor-page .elementor-section.elementor-section-boxed > .elementor-container {
	max-width: var(--hotel-container-default);
}

/* Elementor images are display:inline-block with a bottom gap. */
.hotel-elementor-page .elementor-widget-image img {
	display: block;
}

/* The theme's buttons and Elementor's share a page; make Elementor's inherit
   the brand shape rather than its own rounded default. */
.hotel-elementor-page .elementor-button {
	border-radius: var(--hotel-radius-sm);
	font-family: var(--hotel-font-body);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/*
 * Full-bleed widgets on the canvas template.
 *
 * Elementor's "Full Width" stretch relies on a JS-measured negative margin that
 * is wrong inside a CSS grid parent. The canvas template has no wrapper at all,
 * so hero and mosaic widgets can simply span the viewport.
 */
.hotel-elementor-page .hotel-hero,
.hotel-elementor-page .hotel-brands__figure {
	width: 100%;
}

/*
 * Editor preview only.
 *
 * In the editor the header is not rendered, so a hero with top padding equal to
 * the header height looks wrongly offset. Elementor adds .elementor-editor-active
 * to the body, which is the only reliable way to tell.
 */
body.elementor-editor-active .hotel-hero__slide {
	padding-top: var(--hotel-space-2xl);
}

/* Elementor's placeholder image inside an empty repeater is 150px and stretches
   badly inside the tile components. */
.elementor-editor-active .hotel-tile__image,
.elementor-editor-active .hotel-hero__media {
	object-fit: cover;
}
