/* ==========================================================================
   MakeUser Google Reviews — Visual Builder generic element base styles

   Sensible, minimal defaults for the new element tree's node types
   (Container/Heading/Text/Button/Icon/Image/Badge/etc). Deliberately
   generic and low-specificity: legacy layout-specific styles in
   mur-style.css (loaded after this file — see the enqueue order in
   makeuser-google-reviews.php) always win the cascade for anything a
   legacy-derived preset already looked like, so nothing here can ever
   change the appearance of an existing preset. This file only matters
   for brand-new elements a user adds in the builder that have no
   legacy class of their own.
   ========================================================================== */

.mur-el {
	box-sizing: border-box;
}

.mur-hide-desktop,
.mur-hide-tablet,
.mur-hide-mobile {
	/* Actual hiding happens at the matching breakpoint below; unset here
	   so server-rendered markup never flashes hidden content at the
	   wrong width before CSS loads. */
}

@media (min-width: 992px) {
	.mur-hide-desktop { display: none !important; }
}

@media (max-width: 991px) and (min-width: 600px) {
	.mur-hide-tablet { display: none !important; }
}

@media (max-width: 599px) {
	.mur-hide-mobile { display: none !important; }
}

.mur-el-heading {
	margin: 0 0 0.5em;
	font-weight: 600;
	line-height: 1.25;
}

.mur-el-text {
	margin: 0 0 1em;
	line-height: 1.5;
}

a.mur-el-button,
button.mur-el-button {
	display: inline-block;
	cursor: pointer;
	text-decoration: none;
	border: none;
	font: inherit;
	padding: 0.6em 1.4em;
	border-radius: 6px;
	background: var(--mur-accent, #1a73e8);
	color: #fff;
}

.mur-el-icon {
	display: inline-block;
	line-height: 1;
}

.mur-el-image {
	max-width: 100%;
	height: auto;
	display: block;
}

.mur-el-badge-pill,
.mur-google-badge,
.mur-verified-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	padding: 0.15em 0.7em;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.06);
	font-size: 0.85em;
	line-height: 1.6;
}

.mur-el-divider {
	border: none;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	margin: 1em 0;
	width: 100%;
}

.mur-el-spacer {
	width: 100%;
}

.mur-el-review-card {
	display: block;
}

/* Generic native slider (any container with settings.layoutMode = "slider",
   not just the legacy Carousel layout) — mur-carousel.js's initGenericSlider()
   drives the actual motion; this just sets up the clipping/track shell. */
[data-mur-slider] > .mur-viewport {
	overflow: hidden;
}

[data-mur-slider] > .mur-viewport > .mur-track {
	display: flex;
	gap: 1.5rem;
}

[data-mur-slider] > .mur-dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 1rem;
}

[data-mur-slider] > .mur-dots button {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	border: none;
	padding: 0;
	background: var(--mur-dot, #c9c9c9);
	cursor: pointer;
}

[data-mur-slider] > .mur-dots button[aria-selected="true"] {
	background: var(--mur-dot-active, var(--mur-accent, #1a73e8));
}