/*
 * Coast & Range – the "Stay awhile · 28+ nights" badge ([cr_stay_badge])
 *
 * One inline-flex <span class="cr-badge"> with the calendar icon: the dark
 * ink badge the listing template's old "MONTHLY RENTAL" button wore – ink
 * background, cream uppercase text, 1px border, square corners, no shadow
 * (client feedback, Oct 11). results.js gives its "Minimum N nights" notes
 * and the "Open for longer stays" cards the same class, so the two match.
 * Colours and fonts follow the site's Elementor globals through the --cr-*
 * custom properties (see search-bar.css for the mapping), defaults on
 * :where() so a site rule wins. The badge has no position of its own: place
 * it (absolute, top-right over the image) from the listing template.
 */

:where(.cr-badge) {
	--cr-cream: var(--e-global-color-primary, #F9F6ED);
	--cr-ink: var(--e-global-color-c9d9ea6, #443B27);
	--cr-font-caps: var(--e-global-typography-text-font-family, 'Work Sans'), sans-serif;
}

.cr-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	box-sizing: border-box;
	max-width: 100%;
	margin: 0;
	padding: 7px 12px;
	border: 1px solid var(--cr-ink);
	border-radius: 0;
	background: var(--cr-ink);
	box-shadow: none;
	color: var(--cr-cream);
	font-family: var(--cr-font-caps);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	text-indent: 0;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-font-smoothing: antialiased;
}

.cr-badge .cr-badge__icon {
	flex: none;
	width: 14px;
	height: 14px;
	margin: 0;
	color: inherit;
}

.cr-badge .cr-badge__text {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	color: inherit;
}

/* Theme rules that put an icon-font glyph before spans must not reach the badge. */
.cr-badge::before,
.cr-badge::after,
.cr-badge .cr-badge__text::before,
.cr-badge .cr-badge__text::after {
	content: none !important;
	display: none !important;
}