/* stylelint-disable selector-class-pattern */

/* =========================================================
   JSC COMPONENT CONTRACT
   File: jsc-idx-results-toolbar.css
   Layer: IDX / Results Toolbar
   Version: 2.0

   PURPOSE
   ----------------------------------------------------------------
   Owns:
   - Results count + filters toolbar shell
   - Listings per page control
   - Sort by control
   - Responsive stacking behavior

   NOTES
   ----------------------------------------------------------------
   - Uses actual site selectors, not deprecated FlexMLS body classes
   - Toolbar is designed to feel visually aligned with the header/search UI
   - Green page background should sit outside this shell
========================================================= */

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .flexmls-count-and-filters-wrapper{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  width: 100%;

  padding: 24px 28px;
  margin: 0 0 32px;

  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(18, 20, 26, 0.08);
  border-radius: 28px;
  box-shadow: 0 10px 30px rgba(18, 20, 26, 0.04);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .flexmls-count-wrapper{
  flex: 1 1 auto;
  min-width: 220px;
  align-self: center;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .flexmls-matches-count{
  display: inline-block;
  margin: 0;
  color: var(--jsc-ink-2, #5f6472);
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: 0.02em;
  font-weight: 500;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .flexmls-filters-wrapper{
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 20px 18px;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper,
:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper{
  display: grid;
  gap: 8px;
  min-width: max-content;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper label,
:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper label{
  margin: 0;
  padding: 0 2px;

  color: var(--jsc-ink-2, #5f6472);
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: 0.02em;
  font-weight: 600;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper select,
:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper select{
  min-height: 58px;
  border: 1px solid rgba(18, 20, 26, 0.12);
  border-radius: 22px;
  background-color: #fff;
  color: var(--jsc-ink, #12141a);

  padding: 0 52px 0 18px;
  font: inherit;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 500;

  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 24px) calc(50% - 3px),
    calc(100% - 18px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper select{
  min-width: 122px;
  text-align: center;
  text-align-last: center;
  padding-left: 18px;
  padding-right: 42px;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper select{
  min-width: 250px;
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper select:hover,
:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper select:hover{
  border-color: rgba(18, 20, 26, 0.18);
}

:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .listings-per-page-wrapper select:focus,
:is(
  .jsc-idx-results-shell,
  body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
) .sort-by-wrapper select:focus{
  outline: none;
  border-color: rgba(217, 184, 91, 0.7);
  box-shadow:
    0 0 0 3px rgba(217, 184, 91, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.7) inset;
}

@media (max-width: 1199.98px){
  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .flexmls-count-and-filters-wrapper{
    gap: 22px;
    padding: 22px 22px;
    border-radius: 24px;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .flexmls-filters-wrapper{
    gap: 16px;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .sort-by-wrapper select{
    min-width: 220px;
  }
}

@media (max-width: 767.98px){
  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .flexmls-count-and-filters-wrapper{
    display: grid;
    gap: 18px;
    padding: 18px;
    border-radius: 22px;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .flexmls-count-wrapper{
    min-width: 0;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .flexmls-filters-wrapper{
    margin-left: 0;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
    gap: 14px;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .listings-per-page-wrapper,
  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .sort-by-wrapper{
    min-width: 0;
  }

  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .listings-per-page-wrapper select,
  :is(
    .jsc-idx-results-shell,
    body.page-id-2147 .flexmls_connect__search_results_v2.flexmls-v2-widget
  ) .sort-by-wrapper select{
    width: 100%;
    min-width: 0;
  }
}

/* stylelint-enable selector-class-pattern */