/*
 * Sitewide styles for what replaced Elementor Pro and Essential Addons (buttonre-elements). Loaded after the child
 * theme and Elementor's CSS. Values were measured on the live site before the switch.
 */

/* Header/footer template wrappers, as Pro's theme documents. */
.elementor-location-header::before,
.elementor-location-footer::before { clear: both; content: ""; display: table; }

/*
 * Sticky headers (Pro's "sticky: top" on sections e2fbb51 / f361d37). The child theme makes the header location
 * position:absolute so the Header overlays each page's hero; fixed keeps it there and pins it while scrolling.
 * On IDX listing and results pages the Search Header sits in normal flow (PROGRESS 86), so it sticks instead.
 */
.elementor-location-header.elementor-99,
.elementor-location-header.elementor-1768 { position: fixed; top: 0; z-index: 99; }
.flexmls_connect__listing_details_page .elementor-location-header.elementor-1768,
.flexmls_connect__search_results_page .elementor-location-header.elementor-1768 { position: sticky; }

/*
 * Buttons below are styled from scratch: the Hello theme gives every <button> a pink border and text, and a pink
 * background on hover and focus. Each sets its own colour for every state.
 */
.bre-offcanvas__toggle,
.bre-offcanvas__close,
.bre-popup__close {
	background: transparent;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	font: inherit;
	margin: 0;
	padding: 0;
}
.bre-offcanvas__toggle:hover,
.bre-offcanvas__toggle:focus,
.bre-offcanvas__close:hover,
.bre-offcanvas__close:focus,
.bre-popup__close:hover,
.bre-popup__close:focus { background: transparent; }

/* Desktop header menu (widget buttonre-header-menu). Item font and padding come from the widget's controls. */
.bre-header-menu__list { display: inline-flex; list-style: none; margin: 0; padding: 0; }
.bre-header-menu li { list-style: none; position: relative; }
.bre-header-menu a { color: #080808; display: inline-block; line-height: 60px; transition: .1s; }
.bre-header-menu a:hover,
.bre-header-menu a:focus { color: #080808; }
.bre-header-menu__arrow { margin-left: 5px; }
.bre-header-menu .sub-menu {
	background-color: #fff;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
	left: 0;
	list-style: none;
	margin: 0;
	min-width: 100%;
	opacity: 0;
	padding: 0;
	position: absolute;
	top: 100%;
	transform: translateY(10px);
	transition: .3s;
	visibility: hidden;
	z-index: 1;
}
.bre-header-menu li:hover > .sub-menu,
.bre-header-menu li:focus-within > .sub-menu { opacity: 1; transform: none; visibility: visible; }
.bre-header-menu .sub-menu a { display: block; line-height: 40px; white-space: nowrap; }

/* Mobile menu button (widget buttonre-offcanvas). */
.bre-offcanvas__toggle { align-items: center; border-radius: 3px; display: inline-flex; line-height: 1; padding: 12px 24px; }
.bre-offcanvas__toggle,
.bre-offcanvas__toggle:hover,
.bre-offcanvas__toggle:focus { color: #000; }
.bre-offcanvas__toggle i { display: block; font-size: 28px; margin-right: 10px; }
@media (max-width: 575px) {
	.bre-offcanvas__toggle { padding: 10px; }
}

/* Off-canvas panel: slides in from the left over a 20% black backdrop. */
.bre-offcanvas {
	background: #fff;
	border: 0;
	color: #333;
	height: 100%;
	inset: 0 auto 0 0;
	margin: 0;
	max-height: none;
	max-width: 100%;
	overflow-y: auto;
	padding: 0;
	position: fixed;
	transform: translateX(-100%);
	transition: transform .5s, overlay .5s allow-discrete, display .5s allow-discrete;
	width: 300px;
}
.bre-offcanvas[open] { transform: none; }
@starting-style {
	.bre-offcanvas[open] { transform: translateX(-100%); }
}
.bre-offcanvas::backdrop { background: rgba(0, 0, 0, .2); }
@media (prefers-reduced-motion: reduce) {
	.bre-offcanvas { transition: none; }
}
.bre-offcanvas__header { display: flex; justify-content: flex-end; }
.bre-offcanvas__close { font-size: 28px; line-height: 28px; padding: 0 20px 20px; position: relative; top: 20px; }
.bre-offcanvas__close,
.bre-offcanvas__close:hover,
.bre-offcanvas__close:focus { color: #333; }
.bre-offcanvas__body { padding: 0 20px; }
@media (max-width: 575px) {
	.bre-offcanvas__body { padding: 0; }
}

/* Form popups (templates 779, 782, 1290), opened by `popup` dynamic-tag links. */
.bre-popup {
	background: #fff;
	border: 0;
	box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2);
	max-height: 100%;
	max-width: 100%;
	overflow: hidden;
	padding: 0;
	width: 640px;
}
/* The content scrolls, not the dialog, so the close button stays in the corner. */
.bre-popup__body { max-height: 100dvh; overflow-y: auto; }
.bre-popup::backdrop { background: rgba(0, 0, 0, .8); }
.bre-popup__close { font-size: 15px; line-height: 1; position: absolute; right: 20px; top: 20px; z-index: 1; }
.bre-popup__close,
.bre-popup__close:hover,
.bre-popup__close:focus { color: var(--e-global-color-primary); }
