/* ==========================================================================
   Frosted Bloom — "Popular Searches" chips in the .mkdf-content-bottom
   pre-footer (SiteOrigin button widgets, a.sowb-button). Loaded site-wide.
   ========================================================================== */

/* Section background — soft Frosted Bloom gradient wash. */
.mkdf-content-bottom {
	background:
		radial-gradient(1000px 460px at 8% -12%, #ffe1ee 0%, rgba(255, 225, 238, 0) 58%),
		radial-gradient(920px 520px at 100% 112%, #f6e2ff 0%, rgba(246, 226, 255, 0) 55%),
		linear-gradient(180deg, #fff7fb 0%, #ffe9f3 100%) !important;
	padding: 30px 30px 30px !important;
	border-top: 1px solid rgba(214, 68, 122, 0.10);
}

/* Tighten the vertical gap between the SiteOrigin panel rows/widgets
   (testimonials -> Popular Searches). Class-scoped + !important so it works
   regardless of the auto-generated panel IDs. */
.mkdf-content-bottom .panel-grid,
.mkdf-content-bottom .panel-layout .so-panel {
	margin-bottom: 5px !important;
}

/* Section title. */
.mkdf-content-bottom .mkdf-st-title {
	color: #2e2e3a;
	letter-spacing: -0.3px;
}
.mkdf-content-bottom .mkdf-st-title span { color: #d6447a !important; }

/* Give the buttons row room to breathe + center the tiles in their cells. */
.mkdf-content-bottom .ow-button-base { text-align: center; margin: 0; }

/* Each popular-search button -> frosted glass pill with a round thumbnail. */
.mkdf-content-bottom a.sowb-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: flex-start;
	gap: 11px;
	max-width: 100%;
	margin: 7px auto !important;
	padding: 7px 20px 7px 7px !important;
	background: rgba(255, 255, 255, 0.80) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	color: #2e2e3a !important;
	border: 1px solid rgba(214, 68, 122, 0.20) !important;
	border-radius: 999px !important;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06) !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-shadow: none !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.mkdf-content-bottom a.sowb-button > span {
	display: inline-flex !important;
	align-items: center;
	gap: 11px;
	white-space: normal;
	text-align: left;
}
.mkdf-content-bottom a.sowb-button .sow-icon-image {
	width: 38px !important;
	height: 38px !important;
	min-width: 38px;
	margin: 0 !important;
	border-radius: 50% !important;
	background-size: cover !important;
	background-position: center !important;
	flex: 0 0 auto;
	box-shadow: 0 2px 7px rgba(0, 0, 0, 0.16);
}

/* Label colour — higher specificity (+ .so-widget-sow-button) to beat
   SiteOrigin's own !important white text rule. */
.mkdf-content-bottom .so-widget-sow-button a.sowb-button,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button > span,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:visited { color: #2e2e3a !important; }

/* Hover -> pink gradient fill, white label. */
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:hover,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:focus {
	background: linear-gradient(135deg, #d6447a, #c43a6c) !important;
	border-color: transparent !important;
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(214, 68, 122, 0.26) !important;
}
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:hover,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:hover > span,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:focus,
.mkdf-content-bottom .so-widget-sow-button a.sowb-button:focus > span { color: #fff !important; }
