/* Loaded only on DEV property search, both outside and inside Buying Buddy's shadow DOM. */
mbb-component-element[data-type="MBBv3_SearchForm"],
:host([data-type="MBBv3_SearchForm"]) {
  display: block;
  container-type: inline-size;
  width: 100%;
  min-width: 0;
  margin-block: 1.5rem;
}

#MBBv3_SearchForm #mbb-primary-search {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1rem;
  box-sizing: border-box;
  width: 100%;
  margin: 0 !important;
  padding: clamp(1rem, 3cqi, 2rem) !important;
  border: 1px solid #b9a36c;
  border-radius: 12px;
  background: #faf8f0 !important;
  color: #332b1e;
  box-shadow: 0 8px 28px rgb(52 42 20 / 6%);
  font-family: Arial, sans-serif;
}

/* WordPress has inserted layout-only paragraphs/breaks into the vendor form.
   Keep meaningful descendants (including custom elements) and all event handlers. */
#MBBv3_SearchForm #mbb-primary-search p { display: contents; }
#MBBv3_SearchForm #mbb-primary-search br { display: none; }
#MBBv3_SearchForm #mbb-primary-search > * { min-width: 0; max-width: none; margin: 0 !important; }
#MBBv3_SearchForm #mbb-primary-search .SearchByTextWrapper,
#MBBv3_SearchForm #mbb-primary-search .SelectPriceWrapper,
#MBBv3_SearchForm #mbb-primary-search .PropertyTypeWrapper,
#MBBv3_SearchForm #mbb-primary-search #PropertyTypeMenuButton { grid-column: 1 / -1; }
#MBBv3_SearchForm #mbb-primary-search .SearchByTextWrapper { width: 100% !important; }
#MBBv3_SearchForm #mbb-primary-search .PropertyTypeWrapper:empty { display: none; }
#MBBv3_SearchForm #mbb-primary-search .input-group { align-items: stretch; }
#MBBv3_SearchForm #mbb-primary-search .mbb-input-wrap { min-width: 0; }
#MBBv3_SearchForm #mbb-primary-search .SearchNearby { display: flex; }
#MBBv3_SearchForm #mbb-primary-search .SearchNearby > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 48px;
  padding: 0 !important;
  border: 1px solid #b9a36c;
  border-right: 0;
  border-radius: 6px 0 0 6px;
  background: #eee7d3 !important;
  color: #675322 !important;
}
#MBBv3_SearchForm #mbb-primary-search .form-control {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 48px !important;
  margin: 0;
  padding: 0 12px !important;
  border: 1px solid #b9a36c !important;
  border-radius: 6px;
  background-color: #fffdf7 !important;
  color: #332b1e !important;
  font: 400 16px/1.4 Arial, sans-serif !important;
  box-shadow: none;
}
#MBBv3_SearchForm #mbb-primary-search .mbb-input-location { border-radius: 0 6px 6px 0; }
#MBBv3_SearchForm #mbb-primary-search input::placeholder { color: #686153; opacity: 1; }
#MBBv3_SearchForm #mbb-primary-search .SearchButtonWrapper > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid #806629;
  border-radius: 6px;
  background: #806629 !important;
  color: #fffdf7 !important;
  font: 600 16px/1.4 Arial, sans-serif;
}
#MBBv3_SearchForm #mbb-primary-search .SearchButtonWrapper > .btn:hover { background: #655020 !important; }
#MBBv3_SearchForm #mbb-primary-search .form-control:hover { border-color: #806629 !important; }
#MBBv3_SearchForm #mbb-primary-search :is(input, select, button):focus-visible {
  outline: 3px solid #806629 !important;
  outline-offset: 3px;
}
#MBBv3_SearchForm #mbb-primary-search > .MoreFiltersWrapper .badge { top: -10px; right: 6px; }
#MBBv3_SearchForm #mbb-primary-search > .MoreFiltersWrapper .badge[counter="0"] { display: none; }
#MBBv3_SearchForm #mbb-primary-search #PropertyTypeMenuButton { position: relative; }
#MBBv3_SearchForm #mbb-primary-search #PropertyTypeMenuButton > .dropdown-menu {
  min-width: min(280px, 100cqi - 2rem);
  max-width: calc(100cqi - 2rem);
}

@container (min-width: 760px) {
  #MBBv3_SearchForm #mbb-primary-search { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  #MBBv3_SearchForm #mbb-primary-search .SelectPriceWrapper,
  #MBBv3_SearchForm #mbb-primary-search .PropertyTypeWrapper,
#MBBv3_SearchForm #mbb-primary-search #PropertyTypeMenuButton { grid-column: auto; }
  #MBBv3_SearchForm #mbb-primary-search #PropertyTypeMenuButton > .btn { white-space: normal !important; }
}
