/* LFG QA round 2026-09-27: community-layout overrides for bokka-data-structures blocks. Loaded site-wide after the child style.css. */

/* Community single: the Community Features band is not rendered
   (bokka_lfg_community_layout_skip()), so its optional heading goes too. */
.community-features-heading {
	display: none;
}

/* QA 2026-09-29, community single hero. The logo gets 40px of clear space
   on every side on a semi-transparent white panel, so dark logos read over
   the photo. content-box keeps the plugin's 200px max width, and the 120px
   phone width, for the logo itself rather than logo plus padding. */
.bokka-plugin .community-detail-block .brand-window-logo {
	box-sizing: content-box;
	padding: 40px;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 20px;
}

@media (max-width: 639px) {
	.bokka-plugin .community-detail-block .brand-window-logo {
		width: 120px;
	}
}

/* "NEW HOMES IN {CITY}" eyebrow: the 1px tracking of the community card
   eyebrows on /communities/ (Montserrat comes from css/bokka-fonts.css). */
.bokka-plugin .community-detail-block .bw-bottom-content .title3 {
	letter-spacing: 1px;
}

/* "New Homes in / {City}" intro: city in brand green. Both lines at the
   500 heading weight (single-community.css sets 600 at 0,3,0). */
.bokka-plugin .community-detail-block .bw-text-overlay :is(.title1, .title2) {
	font-weight: 500;
}
.bokka-plugin .community-detail-block .bw-text-overlay .title2 {
	color: #698C73;
}

/* "New Homes in" line: 4.5rem line height (QA 2026-09-29). The plugin's
   40px line height is tighter than the 64px text and crowds the city line.
   From 640px up, where the heading is 60px+; phones keep the plugin's. */
@media (min-width: 640px) {
	.bokka-plugin .community-detail-block .bw-text-overlay .title1 {
		line-height: 4.5rem;
	}
}

/* "Discover Homes in {City}" split content: brand cream background. Only
   rows without an editor-picked background (the brochure row sets white). */
.bokka-plugin .community-detail-block .split-content:not([style*="background-color"]) {
	background-color: #F7F6F3;
}

/* "Inspired Living by LFG Homes" gallery slider: 100px above and below
   (plugin pt-4 pb-16); 64px on phones, where 100px leaves a large gap. */
.bokka-plugin .community-detail-block .gallery-slider {
	padding-top: 100px;
	padding-bottom: 100px;
}

@media (max-width: 639px) {
	.bokka-plugin .community-detail-block .gallery-slider {
		padding-top: 64px;
		padding-bottom: 64px;
	}
}

/* Client revisions 2026-10-09. "Become a VIP" (Gravity Form 25, the Bokka >
   Forms event form): 32px between the last field and the submit button
   wherever the form renders. Orbital's own footer margin is 24px. Since round
   2 the "Contact Us" modals that held it show the /contact/ lead form
   instead (inc/bokka-lfg-contact-cta.php), so this only applies when they
   fall back to it. */
#gform_wrapper_25.gform-theme--framework .gform_footer {
	margin-top: 32px;
}

/* Online sales counselor photo (inc/bokka-lfg-osc-photo.php): a 1024x1536
   portrait in the square form CTA circle, so the crop moves up to her face
   (the plugin centres it at 60% 50%). */
.bokka-plugin .form-cta .form-cta-image[src*="lfg-osc-billee-lassiter"] {
	object-position: 50% 12%;
}

/* Text message consent checkbox on the bokka Gravity Forms, the /contact/
   form's copy (.planning/crm-integration/scripts/update-forms.php): the terms
   and privacy links read as links, and the copy's own "*" is the required
   mark, so Gravity Forms' "(Required)" after it goes (the checkbox keeps
   aria-required). */
.bokka-plugin .gform-theme--framework .lfg-crm-sms .gfield_consent_label a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.bokka-plugin .gform-theme--framework .lfg-crm-sms .gfield_consent_label .gfield_required {
	display: none;
}

/* The /contact/ lead form wherever inc/bokka-lfg-contact-cta.php prints it
   (the "Contact Us" modals, the /communities/ "Contact Us" section), in the
   look of the site's Gravity Forms (style.css "forms"): flat #F1F1F1 48px
   controls, dark sentence-case labels, green pill button. The form's own
   neutral styles come from the "CORE - Forms Script" WPCode snippet; the
   /contact/ page keeps them. Salient forces padding, radius and a gray hover
   on submit buttons, and `appearance: none` hides the consent checkbox, so
   those carry !important. */
.lfg-contact-form .lfg-form-wrap {
	max-width: none;
	text-align: left;
}
.lfg-contact-form .lfg-row {
	gap: 16px;
}
.lfg-contact-form .lfg-field {
	margin-bottom: 16px;
}
.lfg-contact-form .lfg-label {
	margin-bottom: 8px;
	font-family: Montserrat, sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: #212322;
}
.lfg-contact-form .lfg-label .req {
	color: #C02B0A;
}
.lfg-contact-form .lfg-lead-form :is(.lfg-input, .lfg-textarea) {
	height: 48px;
	padding: 0 12px;
	border: 0;
	border-radius: 0;
	background-color: #F1F1F1;
	font-family: Montserrat, sans-serif;
	font-size: 14px;
	color: #212322;
	box-shadow: none;
}
.lfg-contact-form .lfg-lead-form .lfg-textarea {
	height: auto;
	min-height: 120px;
	padding: 12px;
	line-height: 1.5;
}
.lfg-contact-form .lfg-lead-form :is(.lfg-input, .lfg-textarea):focus {
	background-color: #F1F1F1;
	box-shadow: inset 0 0 0 2px #6A8C73 !important;
}
.lfg-contact-form .lfg-invalid :is(.lfg-input, .lfg-textarea) {
	box-shadow: inset 0 0 0 2px #C02B0A !important;
}
.lfg-contact-form .lfg-consent {
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	line-height: 1.5;
	color: #4B4F52;
}
.lfg-contact-form .lfg-invalid .lfg-consent {
	color: #C02B0A;
}
.lfg-contact-form .lfg-consent input[type="checkbox"] {
	-webkit-appearance: checkbox !important;
	appearance: auto !important;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: #6A8C73;
}
.lfg-contact-form .lfg-consent a {
	color: #2F463E;
}
.lfg-contact-form .lfg-lead-form .lfg-btn {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	justify-content: center;
	justify-self: start;
	width: auto;
	height: 50px;
	margin-top: 8px;
	padding: 0 32px !important;
	border-radius: 9999px !important;
	background-color: #6A8C73;
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #FFFFFF;
}
.lfg-contact-form .lfg-lead-form .lfg-btn:hover {
	background-color: #2F463E !important;
}
.lfg-contact-form .lfg-fine {
	margin-top: 12px;
	font-family: Montserrat, sans-serif;
	color: #4B4F52;
	opacity: 1;
}
.lfg-contact-form .lfg-success .lfg-check {
	background-color: #6A8C73;
}
.lfg-contact-form .lfg-success .lfg-check svg {
	stroke: #FFFFFF;
}