/**
 * "Minimal" listing page style (Customizer > Listing Single > Listing page
 * style). A plain title, open sections with thin lines between them and a
 * floating booking box. Loaded only with that option; every rule is scoped to
 * the body class. The section order is in listeo-core
 * templates/single-listing-gallery-grid.php.
 */
body.listeo-listing-minimal {
	--listeo-minimal-text: #222;
	--listeo-minimal-muted: #6a6a6a;
	--listeo-minimal-line: #ebebeb;
	--listeo-minimal-border: #ddd;
	--listeo-minimal-star: #ffab44;
}

/* Title */
.listeo-listing-minimal .single-listing-page-titlebar,
.listeo-listing-minimal .listing-titlebar-tags {
	display: none;
}

.listeo-listing-minimal #titlebar.listing-titlebar {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin: 0;
	padding: 32px 0 24px;
	background: none;
}

.listeo-listing-minimal .listing-titlebar-title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 12px;
	padding: 0;
}

.listeo-listing-minimal .listing-titlebar-title > br {
	display: none;
}

.listeo-listing-minimal .listing-titlebar-title h1 {
	flex: 0 0 100%;
	margin: 0 0 4px;
	color: var(--listeo-minimal-text);
	font-size: 28px;
	line-height: 34px;
	font-weight: 600;
}

.listeo-listing-minimal .listing-titlebar-title .listing-address {
	color: var(--listeo-minimal-muted);
	font-size: 15px;
	line-height: 22px;
}

.listeo-listing-minimal .listing-titlebar-title .listing-address i {
	display: none;
}

.listeo-listing-minimal #titlebar .listing-titlebar-title .star-rating,
.listeo-listing-minimal #titlebar .listing-titlebar-title .numerical-rating {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

.listeo-listing-minimal #titlebar .listing-titlebar-title .star-rating .star {
	display: none;
}

.listeo-listing-minimal .listing-titlebar-title .rating-counter,
.listeo-listing-minimal .listing-titlebar-title .rating-counter a {
	margin: 0;
	padding: 0;
	background: none;
	color: var(--listeo-minimal-text);
	font-size: 15px;
	line-height: 22px;
}

.listeo-listing-minimal .listing-titlebar-title .rating-counter::before {
	content: "\f005";
	margin-right: 6px;
	color: var(--listeo-minimal-star);
	font-family: "Font Awesome 6 Free";
	font-size: 13px;
	font-weight: 900;
}

/* Bookmark: a round heart button. */
.listeo-listing-minimal .listing-titlebar .widget_buttons {
	flex: 0 0 auto;
	margin: 0;
}

.listeo-listing-minimal .listing-titlebar .listing-share {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin: 0 !important;
	padding: 0;
	border: 0;
}

.listeo-listing-minimal .listing-titlebar .like-button,
.listeo-listing-minimal .listing-titlebar .like-button-notlogged {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--listeo-minimal-border);
	border-radius: 50%;
	background: #fff;
	box-shadow: none;
}

/* Compare icon: no side margin, its label is hidden too. */
.listeo-listing-minimal .listing-titlebar .listeo-compare-icon {
	margin-inline-end: 0;
}

/* The box of the heart glyph, without the side margin for the hidden label. */
.listeo-listing-minimal #titlebar.listing-titlebar .like-icon {
	bottom: 0;
	width: 20px;
	height: 30px;
	margin: 0;
}

.listeo-listing-minimal .listing-titlebar .bookmark-btn-title {
	display: none;
}

/* Sections: thin lines, one heading size. */
.listeo-listing-minimal #listing-overview {
	margin: 0;
	padding: 0;
}

.listeo-listing-minimal #listing-overview .listeo-details-section {
	margin: 0;
	padding: 40px 0 0;
	border: 0;
}

.listeo-listing-minimal #listing-overview .listeo-details-section--highlights {
	padding: 0 0 32px;
	border-bottom: 1px solid var(--listeo-minimal-line);
}

.listeo-listing-minimal #listing-overview .listeo-details-section--highlights .listing-details-header {
	display: none;
}

.listeo-listing-minimal #listing-overview > p {
	margin: 0 0 16px;
	color: var(--listeo-minimal-text);
	font-size: 16px;
	line-height: 26px;
}

.listeo-listing-minimal #listing-overview > .listeo-details-section--highlights + p {
	margin-top: 32px;
}

.listeo-listing-minimal .listing-desc-headline,
.listeo-listing-minimal .listing-details-header {
	margin: 0 0 20px !important;
	padding: 0;
	border: 0;
	color: var(--listeo-minimal-text);
	font-size: 22px;
	line-height: 28px;
	font-weight: 600;
}

.listeo-listing-minimal #listing-overview .listing-desc-headline,
.listeo-listing-minimal #listing-overview .listeo-details-section--table,
.listeo-listing-minimal #listing-location,
.listeo-listing-minimal #listing-reviews {
	margin-top: 40px !important;
	padding-top: 40px;
	border-top: 1px solid var(--listeo-minimal-line);
}

.listeo-listing-minimal #listing-overview .listeo-details-section--table + .listeo-details-section--table {
	margin-top: 0 !important;
	border-top: 0;
}

/* The space: one line of icon and value. */
.listeo-listing-minimal ul.listing-details.listeo-details-highlights {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li {
	display: flex;
	flex: 0 0 auto;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	width: auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li > i {
	position: static;
	display: inline-flex;
	width: 22px;
	height: 22px;
	margin: 0;
	background: none;
	color: var(--listeo-minimal-text);
	font-size: 20px;
}

.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li > i svg {
	width: 22px;
	height: 22px;
}

.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li > div {
	display: none;
}

.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li > span,
.listeo-listing-minimal ul.listing-details.listeo-details-highlights > li > span a {
	margin: 0;
	color: var(--listeo-minimal-text);
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
}

/* Things to know: label and value rows; long text keeps its line breaks. */
.listeo-listing-minimal ul.listing-details.listeo-details-table {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

.listeo-listing-minimal ul.listing-details.listeo-details-table > li {
	padding: 12px 0;
	border-color: var(--listeo-minimal-line);
}

.listeo-listing-minimal ul.listing-details.listeo-details-table > li > span {
	font-weight: 500;
	white-space: pre-line;
}

.listeo-listing-minimal ul.listing-details.listeo-details-table > li > i {
	color: var(--listeo-minimal-text);
}

/* A long value drops below its label: field class "main-detail-long". */
.listeo-listing-minimal ul.listing-details.listeo-details-table > li.main-detail-long {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	column-gap: 10px;
}

.listeo-listing-minimal ul.listing-details.listeo-details-table > li.main-detail-long > span {
	grid-column: 1 / -1;
	justify-self: start;
	width: 100%;
	margin: 8px 0 0;
	text-align: left;
	font-weight: 400;
	line-height: 28px;
}

/* Features: a plain two-column list. */
.listeo-listing-minimal .listing-features.listeo-feature-cards {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 32px;
}

.listeo-listing-minimal .listing-features.listeo-feature-cards li,
.listeo-listing-minimal .listing-features.listeo-feature-cards li.faicon {
	min-height: 0;
	padding: 0;
	border-radius: 0;
	background: none;
	font-size: 16px;
}

.listeo-listing-minimal .listing-features.listeo-feature-cards li > i,
.listeo-listing-minimal .listing-features.listeo-feature-cards li > .feature-svg-icon,
.listeo-listing-minimal .listing-features.listeo-feature-cards li.feature-no-icon::before {
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--listeo-minimal-text);
}

/* No website or social links: the wrapper stays out of the rhythm. */
.listeo-listing-minimal .listing-links-container:not(:has(*)) {
	display: none;
}

/* Booking box and host card */
.listeo-listing-minimal .listeo-single-listing-sidebar .boxed-widget {
	border: 1px solid var(--listeo-minimal-border);
	border-radius: 16px;
	background: #fff;
}

.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget {
	padding: 24px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.listeo-listing-minimal .booking-widget-title-wrap {
	display: block;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}

.listeo-listing-minimal .booking-widget-title-wrap .widget-title {
	display: none;
}

.listeo-listing-minimal .booking-pricing-tag {
	position: static;
	display: block;
	margin: 0;
	padding: 0;
	background: none;
	color: var(--listeo-minimal-text);
	font-size: 22px;
	line-height: 28px;
	font-weight: 600;
}

.listeo-listing-minimal .booking-pricing-tag small {
	color: var(--listeo-minimal-muted);
	font-size: 15px;
	font-weight: 400;
}

/* Booking fields: a thin line like the box around them, no shadow. */
.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget #date-picker,
.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget .panel-dropdown > a {
	border: 1px solid var(--listeo-minimal-border);
	border-radius: 12px;
	box-shadow: none;
}

.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget #date-picker:focus,
.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget .panel-dropdown.active > a {
	border-color: var(--listeo-minimal-text);
}

/* Open dropdown: its own card under the field, not joined to it. */
.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget .panel-dropdown .panel-dropdown-content {
	top: 60px;
	border: 1px solid var(--listeo-minimal-border);
	border-radius: 12px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget .panel-dropdown .panel-dropdown-content:not(.padding-reset) {
	padding: 12px;
}

.listeo-listing-minimal .listeo-single-listing-sidebar .booking-widget .panel-dropdown .panel-dropdown-content::before {
	display: none;
}

/* Host card: only the title block, so its divider goes. */
.listeo-listing-minimal .widget_listing_owner {
	padding: 24px;
}

.listeo-listing-minimal .widget_listing_owner .hosted-by-title {
	margin: 0;
	padding: 0;
	border: 0;
}

@media (max-width: 767px) {
	/* The heart stays beside the title instead of on a row of its own. */
	.listeo-listing-minimal #titlebar.listing-titlebar {
		flex-direction: row;
		align-items: flex-start;
		gap: 12px;
		padding: 20px 0 16px;
	}

	.listeo-listing-minimal .listing-titlebar-title h1 {
		font-size: 24px;
		line-height: 30px;
	}

	.listeo-listing-minimal .listing-features.listeo-feature-cards {
		grid-template-columns: minmax(0, 1fr);
	}
}