/* ============================================================
   LIVING COASTAL — /home-search full-search page   2026-07-20 (V2)
   WPCodeBox snippet: "Search Portal".
   Scope: .lc-home-search-widget  (IDX Search widget fmcsearch-5,
          sidebar "home-search", rendered via a Bricks Sidebar element)

   V2 (2026-07-20): coastal-photo backdrop + tightened/rebalanced card.
     - full-bleed Ken Combs pier photo band behind a floating card
     - card narrowed to 940px, centered, stronger shadow to pop off photo
     - min/max reflowed to a tidy 3-col grid (Price·Beds·Baths / SqFt·Year)
     - Listing Status pulled inline onto the button row (Active/Pending
       left · gold Search right) so the card is no longer left-weighted

   PAIRS WITH THE WIDGET SETTINGS (CSS can't do these):
     Submit Button Background = #d0a667 · Submit Button = None
     Other Fields to Show = List Price, Bedrooms, Bathrooms, Square Feet, Year
   ============================================================ */

.lc-home-search-widget{
  --navy:#334376; --gold:#d0a667; --teal:#26a9e1;
  --ink:#33373d; --muted:#6b6f76; --line:#e2e4e8; --field:#fafafb;
}

/* ============================================================
   BACKDROP — full-bleed coastal photo band behind the floating card.
   Lives on the Bricks Sidebar <ul> that wraps the widget (full width).
   Photo = Ken Combs Pier (media id 5822); navy gradient overlay keeps
   the white card readable. Top padding clears the fixed (~90px) header.
   ============================================================ */
.brxe-sidebar.home-search{
  list-style:none !important;
  margin:0 !important;
  padding:122px 24px 92px !important;
  background:
    linear-gradient(180deg, rgba(26,35,68,.60), rgba(26,35,68,.44)),
    url("https://livingcoastal.com/wp-content/uploads/2026/05/gulfport-ken-combs-pier.jpg")
    center 42% / cover no-repeat !important;
}

/* ---- center + width the card (plugin sets an inline max-width:760px) ---- */
.brxe-sidebar.lc-home-search,
.lc-home-search-widget{width:100% !important; max-width:100% !important;}

/* ============================================================
   HERO band — a Custom HTML widget placed ABOVE the IDX Search widget
   in the "Full Home Search" zone (markup: home-search-hero.html). It
   joins seamlessly onto the top of the white search card.
   ============================================================ */
.lc-home-search-widget:has(.lc-hs-hero){max-width:940px !important; margin:0 auto !important;}
.lc-hs-hero{
  background:linear-gradient(135deg,#2c3a66,#334376 60%,#3d4f86) !important;
  border-radius:14px 14px 0 0 !important;
  padding:30px 30px 26px !important; text-align:center !important;
  font-family:'Mulish',sans-serif !important;
}
.lc-hs-hero .lc-hs-eyebrow{
  font-size:12px !important; font-weight:700 !important; text-transform:uppercase !important;
  letter-spacing:1.8px !important; color:var(--gold) !important; margin:0 0 6px !important;
}
.lc-hs-hero .lc-hs-title{
  font-family:'Montserrat',sans-serif !important; font-weight:700 !important;
  font-size:28px !important; line-height:1.15 !important; color:#fff !important; margin:0 0 8px !important;
}
.lc-hs-hero .lc-hs-sub{
  font-size:14px !important; color:rgba(255,255,255,.82) !important;
  margin:0 auto !important; max-width:560px !important; line-height:1.5 !important;
}
/* when the hero precedes the card, join them: flatten the card's top + drop
   the top border so the navy band and white card read as one unit */
.lc-home-search-widget:has(.lc-hs-hero) + .lc-home-search-widget{max-width:940px !important; margin:0 auto !important;}
.lc-home-search-widget:has(.lc-hs-hero) + .lc-home-search-widget .flexmls_connect__search_new{
  border-radius:0 0 14px 14px !important; border-top:0 !important;
  box-shadow:0 26px 60px rgba(15,22,48,.34) !important;
}

.lc-home-search-widget .flexmls_connect__search_new{
  max-width:940px !important; margin:0 auto !important;
  width:100% !important;
  background:#fff !important; border:1px solid var(--line) !important;
  border-radius:14px !important; padding:26px 30px 28px !important;
  box-shadow:0 26px 60px rgba(15,22,48,.34) !important;
  font-family:'Mulish',sans-serif !important; color:var(--ink) !important;
}

/* ---- kill clutter: plugin heading, the sub-type checkbox dumps, redundant
   Sort By (results toolbar already sorts), and the broken "More Search
   Options" deep link (THIS page already is the full search) -------------- */
.lc-home-search-widget .flexmls_connect__search_new_title,
.lc-home-search-widget .flexmls_connect__search_new_subtypes,
.lc-home-search-widget .flexmls_connect__search_new_sort_by,
.lc-home-search-widget .flexmls_connect__search_new_links a{display:none !important;}

/* empty plugin scaffolding that would otherwise take a flex slot */
.lc-home-search-widget form > .query,
.lc-home-search-widget form > input[type="hidden"]{display:none !important;}

/* ---- form = responsive flex-wrap. Direct children stack full-width in a
   sensible order; the five min/max pairs live inside ONE wrapper div that we
   turn into its own responsive row. --------------------------------------- */
.lc-home-search-widget form{
  display:flex !important; flex-wrap:wrap !important;
  align-items:flex-start !important; gap:18px 20px !important;
}
.lc-home-search-widget .flexmls_connect__search_field:has(.flexmlsLocationSearch){
  flex:1 1 100% !important; order:0 !important; min-width:0 !important;
}
/* the min/max WRAPPER (holds Year/Baths/Beds/Sqft/Price) → full-width grid.
   Fixed 3 columns → Price·Beds·Baths on row 1, SqFt·Year on row 2, so no
   single field is ever stranded alone across a full row. */
.lc-home-search-widget .flexmls_connect__search_new_min_max{
  order:1 !important; flex:1 1 100% !important;
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:16px 20px !important; align-items:start !important;
}
.lc-home-search-widget .flexmls_connect__search_new_min_max > .flexmls_connect__search_field{
  min-width:0 !important; margin:0 !important;
}
/* reorder the pairs Price→Beds→Baths→SqFt→Year (plugin emits Year first) */
.lc-home-search-widget .flexmls_connect__search_new_min_max > [data-connect-field="Price"]{order:1 !important;}
.lc-home-search-widget .flexmls_connect__search_new_min_max > [data-connect-field="Beds"]{order:2 !important;}
.lc-home-search-widget .flexmls_connect__search_new_min_max > [data-connect-field="Baths"]{order:3 !important;}
.lc-home-search-widget .flexmls_connect__search_new_min_max > [data-connect-field="Sqft"]{order:4 !important;}
.lc-home-search-widget .flexmls_connect__search_new_min_max > [data-connect-field="Year"]{order:5 !important;}
/* Property Type chip row (full width) */
.lc-home-search-widget .flexmls_connect__search_new_property_type{order:2 !important; flex:1 1 100% !important;}
/* Listing Status = the bare field_group that is NOT min/max, sort, or types.
   Pulled inline onto the button row: grows to push the gold Search right. */
.lc-home-search-widget .flexmls_connect__search_field.flexmls_connect__search_new_field_group:not(.flexmls_connect__search_new_sort_by):not(.flexmls_connect__search_new_property_type){
  order:3 !important; flex:1 1 auto !important; align-self:flex-end !important;
  padding-bottom:2px !important;
}
.lc-home-search-widget .flexmls_connect__search_new_links{
  order:4 !important; flex:0 0 auto !important; align-self:flex-end !important;
}

/* strip the plugin's fieldset / field-group boxes (borders, padding, bg) */
.lc-home-search-widget fieldset,
.lc-home-search-widget .flexmls_connect__search_new_field_group{
  border:0 !important; background:transparent !important; padding:0 !important; margin:0 !important;
}

/* labels / legends */
.lc-home-search-widget .flexmls_connect__search_new_label{
  font-family:'Mulish',sans-serif !important; font-size:11px !important;
  font-weight:700 !important; text-transform:uppercase !important;
  letter-spacing:.6px !important; color:var(--navy) !important;
  margin:0 0 7px !important; padding:0 !important; display:block !important; border:0 !important;
}

/* ---- min/max pairs: two inputs with a "to" between --------------------- */
.lc-home-search-widget .flexmls_connect__min_max_wrapper{
  display:flex !important; align-items:center !important; gap:8px !important;
}
.lc-home-search-widget .flexmls_connect__min_max_wrapper input.text{
  flex:1 1 0 !important; width:100% !important; min-width:0 !important;
  height:46px !important; border:1px solid var(--line) !important; border-radius:8px !important;
  background:var(--field) !important; padding:0 12px !important;
  font-family:'Mulish',sans-serif !important; font-size:14px !important; color:var(--ink) !important;
}
.lc-home-search-widget .flexmls_connect__min_max_wrapper input.text:focus{
  border-color:var(--teal) !important; box-shadow:0 0 0 3px rgba(38,169,225,.12) !important; outline:0 !important;
}
.lc-home-search-widget .flexmls_connect__search_new_to{
  color:var(--muted) !important; font-size:13px !important; flex:0 0 auto !important;
}

/* ---- Location (select2) ------------------------------------------------ */
.lc-home-search-widget .select2-container{width:100% !important;}
.lc-home-search-widget .select2-container .select2-selection{
  min-height:48px !important; border:1px solid var(--line) !important;
  border-radius:8px !important; background:var(--field) !important;
  display:flex !important; align-items:center !important; padding:0 8px !important;
}
.lc-home-search-widget .select2-container--focus .select2-selection{
  border-color:var(--teal) !important; box-shadow:0 0 0 3px rgba(38,169,225,.12) !important;
}

/* ---- Property Type → chips (fieldset legend on its own line) ------------ */
.lc-home-search-widget .flexmls_connect__search_new_property_type{
  display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:8px !important;
}
.lc-home-search-widget .flexmls_connect__search_new_property_type > legend{
  flex:0 0 100% !important; float:none !important;
}
.lc-home-search-widget .flexmls_connect__checkbox_wrapper{display:inline-flex !important; margin:0 !important;}
.lc-home-search-widget .flexmls_connect__checkbox_wrapper .flexmls_connect__search_new_checkboxes{
  position:absolute !important; opacity:0 !important; width:0 !important; height:0 !important;
}
.lc-home-search-widget .flexmls_connect__checkbox_wrapper label{
  display:inline-flex !important; align-items:center !important; height:44px !important;
  padding:0 16px !important; border:1px solid var(--line) !important; border-radius:8px !important;
  background:var(--field) !important; font-family:'Mulish',sans-serif !important;
  font-size:14px !important; font-weight:600 !important; color:var(--ink) !important;
  cursor:pointer !important; margin:0 !important; transition:all .15s ease !important;
}
.lc-home-search-widget .flexmls_connect__checkbox_wrapper .flexmls_connect__search_new_checkboxes:checked + label{
  background:rgba(51,67,118,.06) !important; border-color:var(--navy) !important;
  color:var(--navy) !important; box-shadow:inset 0 0 0 1px var(--navy) !important;
}

/* ---- Listing Status → real inline checkboxes (bare input + text node) --- */
.lc-home-search-widget .flexmls_connect__search_field.flexmls_connect__search_new_field_group:not(.flexmls_connect__search_new_sort_by):not(.flexmls_connect__search_new_property_type){
  font-family:'Mulish',sans-serif !important; font-size:14px !important; color:var(--ink) !important;
}
.lc-home-search-widget .flexmls_connect__search_field.flexmls_connect__search_new_field_group:not(.flexmls_connect__search_new_sort_by):not(.flexmls_connect__search_new_property_type) br{display:none !important;}
.lc-home-search-widget .flexmls_connect__search_field.flexmls_connect__search_new_field_group:not(.flexmls_connect__search_new_sort_by):not(.flexmls_connect__search_new_property_type) .flexmls_connect__search_new_checkboxes{
  appearance:auto !important; -webkit-appearance:auto !important;
  width:16px !important; height:16px !important; accent-color:var(--navy) !important;
  vertical-align:middle !important; margin:0 6px 6px 0 !important; cursor:pointer !important;
  display:inline-block !important;
}

/* ---- Search button (gold from the widget setting; shape/type here) ------ */
.lc-home-search-widget .flexmls_connect__search_new_links{
  display:flex !important; justify-content:flex-end !important; align-items:center !important;
}
.lc-home-search-widget input[type="submit"].flexmls_connect__search_new_submit{
  height:50px !important; width:auto !important; min-width:220px !important;
  border:0 !important; border-radius:8px !important; padding:0 28px !important;
  font-family:'Montserrat',sans-serif !important; font-size:15px !important; font-weight:700 !important;
  text-transform:uppercase !important; letter-spacing:1px !important; cursor:pointer !important;
  text-shadow:none !important;
}

@media (max-width:720px){
  .brxe-sidebar.home-search{padding:104px 14px 60px !important;}
  .lc-home-search-widget .flexmls_connect__search_new{padding:20px 18px 22px !important;}
  .lc-home-search-widget .flexmls_connect__search_new_min_max{grid-template-columns:1fr 1fr !important;}
  .lc-home-search-widget .flexmls_connect__search_field.flexmls_connect__search_new_field_group:not(.flexmls_connect__search_new_sort_by):not(.flexmls_connect__search_new_property_type){
    flex:1 1 100% !important;
  }
  .lc-home-search-widget .flexmls_connect__search_new_links{justify-content:stretch !important;}
  .lc-home-search-widget input[type="submit"].flexmls_connect__search_new_submit{flex:1 !important; min-width:0 !important; width:100% !important;}
}