/* =========================================
   MARKETPLACE FILTERS
========================================= */

.marketplace-filter-card {
  padding:
    16px 20px;

  margin:
    16px 0 20px;

  background-color:
    #ffffff;

  border:
    1px solid
    var(--border);

  border-radius:
    14px;

  box-shadow:
    0 4px 16px
    rgba(
      15,
      23,
      42,
      0.05
    );
}


.marketplace-filter-card .title {
  margin-bottom:
    12px;

  color:
    var(--navy);

  font-size:
    1.05rem;
}


.marketplace-filter-card .label {
  margin-bottom:
    5px;

  color:
    #374151;

  font-size:
    0.74rem;

  font-weight:
    750;
}


/* =========================================
   MOBILE FILTER TOGGLE
========================================= */

.marketplace-mobile-filter-toggle {
  display:
    none;

  width:
    100%;

  align-items:
    center;

  justify-content:
    space-between;

  min-height:
    46px;

  padding:
    0 14px;

  color:
    var(--navy);

  background-color:
    #ffffff;

  border:
    0;

  border-radius:
    14px;

  cursor:
    pointer;

  font-size:
    0.92rem;

  font-weight:
    800;

  text-align:
    left;
}


.marketplace-mobile-filter-arrow {
  font-size:
    0.72rem;

  transition:
    transform 0.2s ease;
}


.marketplace-filter-card.is-open
.marketplace-mobile-filter-arrow {
  transform:
    rotate(180deg);
}


/* =========================================
   PRIMARY FILTER AREA
========================================= */

.marketplace-primary-filters {
  display:
    flex;

  flex-direction:
    column;

  gap:
    14px;
}


/* =========================================
   MAIN KEYWORD SEARCH
========================================= */

.marketplace-main-search {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1fr
    )
    120px;

  align-items:
    end;

  gap:
    12px;
}


.marketplace-main-search .field {
  margin-bottom:
    0;
}


/* =========================================
   MAIN SEARCH BUTTON
========================================= */

.marketplace-primary-search-button {
  width:
    120px;

  min-height:
    40px;

  padding:
    0 16px;

  margin:
    0;

  color:
    var(--navy);

  background-color:
    var(--orange);

  border-color:
    var(--orange);

  border-radius:
    8px;

  font-size:
    0.82rem;

  font-weight:
    800;
}


.marketplace-primary-search-button:hover {
  color:
    #ffffff;

  background-color:
    var(--orange-dark);

  border-color:
    var(--orange-dark);
}


.marketplace-primary-search-button.is-active {
  color:
    #ffffff;

  background-color:
    var(--navy);

  border-color:
    var(--navy);
}


/* =========================================
   LOCATION SEARCH
========================================= */

.marketplace-location-search {
  display:
    grid;

  grid-template-columns:
    190px
    auto
    minmax(
      0,
      1fr
    );

  align-items:
    start;

  gap:
    14px;

  padding-top:
    14px;

  border-top:
    1px solid
    var(--border);
}


/* =========================================
   LIVE LOCATION
========================================= */

.marketplace-live-location-section {
  display:
    flex;

  flex-direction:
    column;
}


.marketplace-location-button {
  width:
    190px;

  min-height:
    40px;

  padding:
    0 14px;

  color:
    var(--navy);

  background-color:
    #ffffff;

  border:
    1px solid
    var(--border-dark);

  border-radius:
    8px;

  font-size:
    0.76rem;

  font-weight:
    800;

  white-space:
    nowrap;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}


.marketplace-location-button:hover {
  color:
    var(--navy);

  background-color:
    var(--surface-soft);

  border-color:
    var(--navy);
}


.marketplace-location-button:active {
  transform:
    translateY(1px);
}


.marketplace-location-button[disabled] {
  cursor:
    wait;

  opacity:
    0.65;
}


.marketplace-location-button.is-active {
  color:
    #ffffff;

  background-color:
    #16a34a;

  border-color:
    #16a34a;
}


.marketplace-location-button.is-active:hover {
  color:
    #ffffff;

  background-color:
    #15803d;

  border-color:
    #15803d;
}


/* =========================================
   LOCATION DIVIDER
========================================= */

.marketplace-location-divider {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  min-height:
    40px;

  margin-top:
    24px;

  padding-bottom:
    1px;
}


.marketplace-location-divider span {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    32px;

  min-height:
    32px;

  color:
    var(--muted);

  background-color:
    var(--surface-soft);

  border:
    1px solid
    var(--border);

  border-radius:
    999px;

  font-size:
    0.68rem;

  font-weight:
    800;
}


/* =========================================
   MANUAL LOCATION
========================================= */

.marketplace-location-manual {
  display:
    grid;

  grid-template-columns:
    minmax(
      140px,
      0.8fr
    )
    minmax(
      220px,
      1.4fr
    )
    minmax(
      170px,
      0.9fr
    );

  align-items:
    start;

  gap:
    12px;
}


.marketplace-location-manual .field {
  margin-bottom:
    0;
}


/* =========================================
   FILTER INPUTS
========================================= */

.marketplace-filter-card .input,
.marketplace-filter-card .select select {
  min-height:
    40px;

  background-color:
    #ffffff;

  font-size:
    0.88rem;
}


/* =========================================
   SUBURB HELP TEXT
========================================= */

.marketplace-primary-filters
#suburbHelp {
  min-height:
    16px;

  margin-top:
    4px;

  font-size:
    0.72rem;
}


/* =========================================
   MORE FILTERS
========================================= */

.marketplace-more-filters {
  margin-top:
    8px;

  padding-top:
    10px;

  border-top:
    1px solid
    var(--border);
}


.marketplace-more-filters-toggle {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    6px;

  min-height:
    32px;

  padding:
    6px 11px;

  color:
    var(--navy);

  background-color:
    var(--surface-soft);

  border:
    1px solid
    var(--border);

  border-radius:
    999px;

  cursor:
    pointer;

  font-size:
    0.76rem;

  font-weight:
    750;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}


.marketplace-more-filters-toggle:hover {
  color:
    var(--navy);

  background-color:
    #ffffff;

  border-color:
    var(--border-dark);
}


.marketplace-more-filters-toggle:active {
  transform:
    translateY(1px);
}


.marketplace-more-filters-arrow {
  font-size:
    0.66rem;

  transition:
    transform 0.2s ease;
}


.marketplace-more-filters.is-open
.marketplace-more-filters-arrow {
  transform:
    rotate(180deg);
}


.marketplace-more-filters-content {
  display:
    none;

  margin-top:
    12px;
}


.marketplace-more-filters.is-open
.marketplace-more-filters-content {
  display:
    block;
}


/* =========================================
   ADVANCED FILTER GRID
========================================= */

.marketplace-advanced-filter-grid {
  display:
    grid;

  grid-template-columns:
    repeat(
      5,
      minmax(
        0,
        1fr
      )
    );

  gap:
    12px;
}


.marketplace-advanced-filter-grid .field {
  margin-bottom:
    0;
}


/* =========================================
   FILTER ACTIONS
========================================= */

.marketplace-filter-buttons {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    8px;

  margin-top:
    12px;
}


.marketplace-clear-button {
  min-height:
    38px;

  padding:
    0 15px;

  color:
    var(--text);

  background-color:
    #ffffff;

  border:
    1px solid
    var(--border-dark);

  font-size:
    0.8rem;

  font-weight:
    750;
}


.marketplace-clear-button:hover {
  color:
    var(--navy);

  background-color:
    var(--surface-soft);

  border-color:
    #94a3b8;
}


/* =========================================
   LOCATION AUTOCOMPLETE
========================================= */

.location-autocomplete {
  position:
    relative;
}


.suburb-suggestions {
  position:
    absolute;

  top:
    calc(
      100% + 4px
    );

  right:
    0;

  left:
    0;

  z-index:
    40;

  max-height:
    250px;

  overflow-y:
    auto;

  background-color:
    #ffffff;

  border:
    1px solid
    var(--border);

  border-radius:
    8px;

  box-shadow:
    0 8px 20px
    rgba(
      15,
      23,
      42,
      0.1
    );
}


.suburb-suggestion-item {
  display:
    block;

  width:
    100%;

  padding:
    10px 12px;

  background-color:
    #ffffff;

  border:
    0;

  border-bottom:
    1px solid
    var(--border);

  cursor:
    pointer;

  text-align:
    left;

  font:
    inherit;

  font-size:
    0.86rem;
}


.suburb-suggestion-item:last-child {
  border-bottom:
    0;
}


.suburb-suggestion-item:hover {
  background-color:
    var(--surface-soft);
}


.suburb-suggestion-empty {
  padding:
    10px 12px;

  color:
    #6b7280;

  font-size:
    0.84rem;
}


/* =========================================
   TABLET
========================================= */

@media screen and (max-width: 1050px) {

  .marketplace-location-search {
    grid-template-columns:
      1fr;
  }


  .marketplace-location-divider {
    min-height:
      auto;

    margin-top:
      0;
  }


  .marketplace-location-divider::before,
  .marketplace-location-divider::after {
    content:
      "";

    flex:
      1;

    height:
      1px;

    background-color:
      var(--border);
  }


  .marketplace-location-divider::before,
  .marketplace-location-divider::after {
    content: none;
  }

  .marketplace-location-divider span {
    margin:
      0 10px;
  }


  .marketplace-location-button {
    width:
      100%;
  }


  .marketplace-location-manual {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }


  .marketplace-advanced-filter-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

}


/* =========================================
   MOBILE
========================================= */

@media screen and (max-width: 768px) {

  .marketplace-filter-card {
    padding:
      0;

    margin:
      14px 0 16px;

    overflow:
      visible;
  }


  .marketplace-mobile-filter-toggle {
    display:
      flex;
  }


  .marketplace-filter-content {
    display:
      none;

    padding:
      4px 14px 14px;

    border-top:
      1px solid
      var(--border);
  }


  .marketplace-filter-card.is-open
  .marketplace-filter-content {
    display:
      block;
  }


  .marketplace-filter-card.is-open
  .marketplace-mobile-filter-toggle {
    border-radius:
      14px 14px 0 0;
  }


  .marketplace-filter-heading {
    padding-top:
      12px;
  }


  .marketplace-main-search {
    display:
      block;
  }


  .marketplace-main-search .field {
    margin-bottom:
      10px;
  }


  .marketplace-primary-search-button {
    width:
      100%;

    min-height:
      44px;
  }


  .marketplace-location-search {
    display:
      flex;

    flex-direction:
      column;

    align-items:
      stretch;

    gap:
      10px;

    margin-top:
      4px;

    padding-top:
      14px;
  }


  .marketplace-live-location-section {
    order:
      1;
  }


  .marketplace-location-divider {
    order:
      2;

    margin:
      2px 0;
  }


  .marketplace-location-manual {
    order:
      3;

    display:
      block;
  }


  .marketplace-location-button {
    width:
      100%;

    min-height:
      42px;
  }


  .marketplace-location-manual .field {
    margin-bottom:
      10px;
  }


  .marketplace-filter-card .input,
  .marketplace-filter-card .select select {
    min-height:
      42px;
  }


  .marketplace-advanced-filter-grid {
    display:
      block;
  }


  .marketplace-advanced-filter-grid .field {
    margin-bottom:
      10px;
  }


  .marketplace-filter-buttons {
    flex-direction:
      column;

    align-items:
      stretch;
  }


  .marketplace-filter-buttons .button {
    width:
      100%;
  }

}








/* =========================================
   MOBILE SEARCH ACTION AT BOTTOM
========================================= */

.marketplace-mobile-search-submit {
  display:
    none;
}


@media screen and (max-width: 768px) {

  .marketplace-primary-search-button {
    display:
      none;
  }


  .marketplace-main-search .field {
    margin-bottom:
      0;
  }


  .marketplace-primary-filters {
    gap:
      10px;
  }


  .marketplace-more-filters {
    margin-top:
      2px;
  }


  .marketplace-mobile-search-submit {
    display:
      flex;

    align-items:
      center;

    justify-content:
      center;

    width:
      100%;

    min-height:
      46px;

    margin-top:
      14px;

    color:
      var(--navy);

    background-color:
      var(--orange);

    border:
      1px solid
      var(--orange);

    border-radius:
      9px;

    font-size:
      0.84rem;

    font-weight:
      850;
  }


  .marketplace-mobile-search-submit:hover,
  .marketplace-mobile-search-submit:focus {
    color:
      #ffffff;

    background-color:
      var(--orange-dark);

    border-color:
      var(--orange-dark);
  }

}



/* =========================================
   ALWAYS VISIBLE MOBILE KEYWORD SEARCH
========================================= */

@media screen and (max-width: 768px) {

  .marketplace-filter-card {
    display:
      flex;

    flex-direction:
      column;

    padding:
      10px;

    margin:
      8px 0 10px;

    gap:
      8px;
  }

  .marketplace-filter-card form {
    margin-bottom: 0;
  }

  .marketplace-mobile-filter-toggle {
    order:
      2;

    min-height:
      42px;

    padding:
      0 12px;

    background-color:
      var(--surface-soft);

    border:
      1px solid
      var(--border);

    border-radius:
      9px;
  }


  .marketplace-filter-content {
    display:
      block !important;

    order:
      1;

    padding:
      0;

    border-top:
      0;
  }


  .marketplace-filter-heading {
    display:
      none;
  }


  .marketplace-primary-filters {
    gap:
      0;
  }


  .marketplace-main-search {
    display:
      grid;

    grid-template-columns:
      minmax(0, 1fr)
      88px;

    align-items:
      end;

    gap:
      8px;
  }


  .marketplace-main-search .field {
    margin:
      0;
  }


  .marketplace-main-search .label {
    margin-bottom:
      4px;
  }


  .marketplace-primary-search-button {
    display:
      flex !important;

    align-items:
      center;

    justify-content:
      center;

    width:
      88px;

    min-height:
      42px;

    padding:
      0 10px;

    font-size:
      0.76rem;
  }


  .marketplace-location-search,
  .marketplace-more-filters,
  .marketplace-mobile-search-submit {
    display:
      none !important;
  }


  .marketplace-filter-card.is-open
  .marketplace-location-search {
    display:
      flex !important;
  }




  .marketplace-filter-card.is-open
  .marketplace-mobile-search-submit {
    display:
      flex !important;
  }


  .marketplace-filter-card.is-open
  .marketplace-mobile-filter-toggle {
    border-radius:
      9px;
  }


  .marketplace-filter-card.is-open
  .marketplace-mobile-filter-arrow {
    transform:
      rotate(180deg);
  }

}








/* Keep keyword and category visible before optional location filters. */
.marketplace-main-search {
  grid-template-columns: minmax(0, 1.6fr) minmax(220px, 1fr) 120px;
}
.marketplace-main-search .field { min-width: 0; }
.marketplace-category-field .select,
.marketplace-category-field select { width: 100%; max-width: 100%; }
.marketplace-category-field .select { display: block; height: auto; }
.marketplace-category-field select { text-overflow: ellipsis; }

@media screen and (max-width: 768px) {
  .marketplace-main-search {
    grid-template-columns: minmax(0, 1fr) 88px;
    gap: 10px 8px;
  }
  .marketplace-keyword-field { order: 1; }
  .marketplace-primary-search-button { order: 2; }
  .marketplace-category-field { order: 3; grid-column: 1 / -1; }
  .marketplace-category-field .label { margin-bottom: 4px; }
  .marketplace-category-field select { min-height: 44px; }
}


/* Mobile location, sort and extra filters have separate controls. */
.marketplace-mobile-filter-toolbar { display: none; }
@media screen and (max-width: 768px) {
  .marketplace-mobile-filter-toolbar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: 8px;
    margin-top: 10px;
  }
  .marketplace-mobile-filter-toolbar .marketplace-mobile-filter-toggle {
    display: flex;
    order: 0;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 0 12px;
    font-size: .76rem;
  }
  .marketplace-mobile-sort-slot,
  .marketplace-mobile-sort-slot .field { min-width: 0; margin: 0; }
  .marketplace-mobile-sort-slot .label { margin-bottom: 4px; font-size: .67rem; }
  .marketplace-mobile-sort-slot .select { display: block; width: 100%; height: auto; }
  .marketplace-mobile-sort-slot select {
    width: 100%; min-height: 44px; height: 44px;
    border-radius: 9px; font-size: .74rem; text-overflow: ellipsis;
  }
}

.marketplace-mobile-apply-filters { display: none; }
@media screen and (max-width: 768px) {
  .marketplace-mobile-filter-toolbar { gap: 6px; }
  .marketplace-mobile-extra-filter-toggle {
    display: flex; align-items: center; justify-content: space-between;
    min-width: 0; min-height: 44px; padding: 0 10px;
    border: 1px solid var(--border); border-radius: 9px;
    background: var(--surface-soft); color: var(--navy);
    font-size: .74rem; font-weight: 800; cursor: pointer;
  }
  .marketplace-mobile-extra-filter-toggle > span:last-child { font-size: .65rem; }
  .marketplace-mobile-filter-toolbar .marketplace-mobile-filter-toggle { padding: 0 10px; font-size: .74rem; }
  .marketplace-mobile-filter-toolbar button[aria-expanded="true"] {
    color: #8b5b0d; border-color: #f0cc87; background: #fff7e7;
  }
  .marketplace-mobile-sort-slot select { font-size: .7rem; padding-left: 8px; }
  .marketplace-more-filters.is-open {
    display: block !important; margin-top: 12px; padding: 12px;
    border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft);
  }
  .marketplace-more-filters-toggle { display: none; }
  .marketplace-more-filters-content { margin-top: 0; }
  .marketplace-more-filters .marketplace-filter-buttons {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px;
  }
  .marketplace-more-filters .marketplace-filter-buttons .button {
    display: inline-flex; align-items: center; justify-content: center;
    width: 100%; min-width: 0; min-height: 44px; padding: 8px 6px; font-size: .7rem;
  }
  .marketplace-mobile-apply-filters { background: var(--orange); border-color: var(--orange); color: var(--navy); font-weight: 800; }
  .marketplace-mobile-apply-filters:hover { background: var(--orange-dark); border-color: var(--orange-dark); }
  .marketplace-location-search > .marketplace-mobile-search-submit { margin-top: 0; }
}

/* Desktop search: primary fields first, compact location row underneath. */
@media screen and (min-width: 1024px) {
  .marketplace-filter-card {
    margin: 0 0 20px;
    padding: 18px 20px 14px;
    border-radius: 12px;
    box-shadow: var(--shadow-small);
  }

  .marketplace-filter-heading {
    display: none;
  }

  .marketplace-filter-card form {
    margin-bottom: 0;
  }

  .marketplace-primary-filters {
    gap: 14px;
  }

  .marketplace-main-search {
    grid-template-columns: minmax(0, 1.7fr) minmax(250px, 1fr) 116px;
    gap: 12px;
  }

  .marketplace-filter-card .label {
    margin-bottom: 5px;
    color: #475569;
    font-size: 0.74rem;
    font-weight: 650;
  }

  .marketplace-filter-card .select {
    display: block;
    height: auto;
  }

  .marketplace-filter-card .input,
  .marketplace-filter-card .select select {
    height: 40px;
    min-height: 40px;
    border-color: var(--border-dark);
    border-radius: 8px;
    box-shadow: none;
    font-size: 0.84rem;
  }

  .marketplace-main-search .input,
  .marketplace-main-search .select select,
  .marketplace-primary-search-button {
    height: 44px;
    min-height: 44px;
    font-size: 0.88rem;
  }

  .marketplace-primary-search-button {
    width: 116px;
    border-radius: 8px;
  }

  .marketplace-location-search {
    grid-template-columns: 182px 28px minmax(0, 1fr);
    gap: 12px;
    padding-top: 12px;
  }

  .marketplace-location-button {
    width: 182px;
    height: 40px;
    min-height: 40px;
    padding: 0 12px;
    font-size: 0.74rem;
    font-weight: 650;
    box-shadow: none;
  }

  .marketplace-location-divider {
    min-height: 40px;
    margin-top: 22px;
    padding: 0;
  }

  .marketplace-location-divider::before,
  .marketplace-location-divider::after {
    content: none;
  }

  .marketplace-location-divider span {
    min-width: 26px;
    min-height: 26px;
    font-size: 0.6rem;
  }

  .marketplace-location-manual {
    grid-template-columns: minmax(100px, 0.65fr) minmax(180px, 1.4fr) minmax(140px, 0.85fr);
    gap: 12px;
  }

  .marketplace-primary-filters #suburbHelp {
    min-height: 0;
    margin-top: 4px;
    font-size: 0.68rem;
    line-height: 1.3;
  }

  .marketplace-more-filters {
    margin-top: 10px;
    padding-top: 0;
    border-top: 0;
  }

  .marketplace-more-filters-toggle {
    min-height: 32px;
    padding: 5px 10px;
    border-radius: 7px;
    font-size: 0.74rem;
    font-weight: 650;
  }

  .marketplace-advanced-filter-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .marketplace-filter-buttons {
    margin-top: 12px;
  }
}