/* Compact list filtering. The original form stays usable until enhancement
   supplies real field labels and a working mobile disclosure. */
html:root body form[data-bims-filter-ready] {
  --bims-filter-control-height: 42px;
  --bims-system-control: var(--bims-filter-control-height);
  --ui-filter-control-height: var(--bims-filter-control-height);
  --ios-control-h: var(--bims-filter-control-height);
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 12px !important;
  padding: 10px !important;
  border: 1px solid var(--bims-system-line, var(--city-border, #d6e1da)) !important;
  border-radius: var(--bims-system-radius-inset, 14px) !important;
  background: var(--bims-system-surface-soft, var(--city-surface-soft, #f7faf8)) !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-context {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
}

html:root body form[data-bims-filter-ready] .bims-filter-search,
html:root body form[data-bims-filter-ready] .bims-filter-field {
  display: grid !important;
  align-content: start !important;
  align-self: flex-end !important;
  gap: 4px !important;
  flex: 1 1 0 !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-column: auto !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-search {
  flex: 2 1 0 !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-fields {
  display: contents !important;
}

/* Keep a desktop advanced disclosure compact until its options are needed. */
html:root body form[data-bims-filter-ready] .bims-filter-advanced {
  display: block !important;
  flex: 0 1 auto !important;
  align-self: flex-end !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  grid-column: auto !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced[open] {
  flex: 1 1 100% !important;
  width: 100% !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-row:has(.bims-filter-advanced[open]) {
  flex-wrap: wrap !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced[open] {
  order: 1;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  width: fit-content !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: var(--bims-filter-control-height) !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid var(--bims-system-line-strong, var(--city-border, #b9cec1)) !important;
  border-radius: var(--bims-system-radius-control, 12px) !important;
  background: var(--bims-system-surface, var(--city-surface, #ffffff)) !important;
  color: var(--bims-system-primary, var(--city-primary, #0b7449)) !important;
  font-size: .8125rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  cursor: pointer;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced[open] > summary {
  margin-bottom: 8px !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced > summary:focus-visible {
  outline: 3px solid var(--bims-system-focus, rgba(27, 109, 224, .2)) !important;
  outline-offset: 2px !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced :is(.form-grid, .service-request-advanced-filter-grid) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced :is(.form-grid, .service-request-advanced-filter-grid) > label {
  display: grid !important;
  flex: 1 1 150px !important;
  align-content: start !important;
  align-self: flex-end !important;
  gap: 4px !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bims-system-muted, var(--city-muted, #52675b)) !important;
  font-size: .75rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  grid-column: auto !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-advanced :is(.field-title, .bims-field-title) {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: .75rem !important;
  line-height: 1.3 !important;
}

html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field) > label,
html:root body form[data-bims-filter-ready] .bims-filter-label {
  display: block !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bims-system-muted, var(--city-muted, #52675b)) !important;
  font-size: .75rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  overflow-wrap: anywhere;
}

/* Explicit labels replace legacy icon-only label decoration. */
html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field)::before,
html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field) > label::before {
  content: none !important;
  display: none !important;
}

html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field, .bims-filter-advanced)[class] :is(
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not(.barangay-select-search-native):not(.permission-account-search-input):not([data-map-search]),
  select:not([multiple]):not(.barangay-select-search-native)
) {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: var(--bims-filter-control-height) !important;
  height: var(--bims-filter-control-height) !important;
  max-height: var(--bims-filter-control-height) !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid var(--bims-system-line-strong, var(--city-border, #b9cec1)) !important;
  border-radius: var(--bims-system-radius-control, 12px) !important;
  background-color: var(--bims-system-surface, var(--city-surface, #ffffff)) !important;
  color: var(--bims-system-text, var(--city-ink, #14231b)) !important;
  font: inherit !important;
  font-size: .8125rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field, .bims-filter-advanced)[class] select:not([multiple]):not(.barangay-select-search-native) {
  padding-right: 30px !important;
}

html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field, .bims-filter-advanced)[class] :is(
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not(.barangay-select-search-native):not(.permission-account-search-input):not([data-map-search]),
  select:not([multiple]):not(.barangay-select-search-native)
):focus {
  outline: 3px solid var(--bims-system-focus, rgba(27, 109, 224, .2)) !important;
  outline-offset: 1px !important;
  border-color: var(--bims-system-primary, var(--city-primary, #0b7449)) !important;
}

html:root body form[data-bims-filter-ready] :is(.bims-filter-search, .bims-filter-field, .bims-filter-advanced)[class] :is(
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not(.barangay-select-search-native):not(.permission-account-search-input):not([data-map-search]),
  select:not([multiple]):not(.barangay-select-search-native)
):disabled {
  background-color: var(--bims-system-surface-soft, var(--city-surface-soft, #f7faf8)) !important;
  color: var(--bims-system-muted, var(--city-muted, #52675b)) !important;
  cursor: not-allowed;
}

html:root body form[data-bims-filter-ready] :is(.barangay-select-search, .resident-search-combobox) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-actions {
  display: flex !important;
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  align-self: flex-end !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-column: auto !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-actions :is(.btn, button, a, input[type="submit"], input[type="reset"]),
html:root body form[data-bims-filter-ready] .bims-filter-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: var(--bims-filter-control-height) !important;
  height: var(--bims-filter-control-height) !important;
  max-height: var(--bims-filter-control-height) !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border-radius: var(--bims-system-radius-control, 12px) !important;
  font-size: .8125rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-actions :is(.icon, .ui-icon, .ico, .bpw-icon),
html:root body form[data-bims-filter-ready] .bims-filter-toggle :is(.icon, .ui-icon, .ico, .bpw-icon) {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-toggle {
  display: none !important;
  border: 1px solid var(--bims-system-line-strong, var(--city-border, #b9cec1)) !important;
  background: var(--bims-system-surface, var(--city-surface, #ffffff)) !important;
  color: var(--bims-system-primary, var(--city-primary, #0b7449)) !important;
  box-shadow: none !important;
  cursor: pointer;
}

html:root body form[data-bims-filter-ready] .bims-filter-toggle[aria-expanded="true"] {
  border-color: var(--bims-system-primary, var(--city-primary, #0b7449)) !important;
  background: var(--bims-system-primary-soft, #e8f5ed) !important;
}

html:root body form[data-bims-filter-ready] .bims-filter-toggle:focus-visible,
html:root body .bims-filter-summary :is(a, button):focus-visible {
  outline: 3px solid var(--bims-system-focus, rgba(27, 109, 224, .2)) !important;
  outline-offset: 2px !important;
}

/* Applied filters describe the submitted results, outside the editable form. */
html:root body .bims-filter-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  margin: 0 0 12px;
  padding: 0;
  color: var(--bims-system-muted, var(--city-muted, #52675b));
  font-size: .8125rem;
  line-height: 1.4;
}

html:root body .bims-filter-result-count {
  flex: 0 1 auto;
  min-width: 0;
  font-weight: 650;
}

html:root body .bims-filter-applied {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
}

html:root body .bims-filter-summary .bims-filter-chip {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 30px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 4px 9px !important;
  border: 1px solid var(--bims-system-line, var(--city-border, #d6e1da)) !important;
  border-radius: 999px !important;
  background: var(--bims-system-primary-soft, #e8f5ed) !important;
  color: var(--bims-system-primary-strong, var(--city-ink, #075b39)) !important;
  font-size: .75rem !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-align: left !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

html:root body .bims-filter-summary .bims-filter-clear {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 30px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 4px 2px !important;
  border: 0 !important;
  background: none !important;
  color: var(--bims-system-primary, var(--city-primary, #0b7449)) !important;
  font-size: .75rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  white-space: normal !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  box-shadow: none !important;
}

html:root body .bims-filter-summary .bims-filter-chip > span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] {
    --bims-filter-control-height: 44px;
    align-items: flex-end !important;
    padding: 10px !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-row {
    flex-wrap: wrap !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-search {
    flex: 1 1 160px !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-toggle {
    display: inline-flex !important;
    flex: 0 0 auto !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-no-search="true"] .bims-filter-toggle {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-fields {
    display: none !important;
    flex: 1 1 100% !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 8px 0 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    border-top: 1px solid var(--bims-system-line, var(--city-border, #d6e1da)) !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-open="true"] .bims-filter-fields {
    display: grid !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-field {
    width: 100% !important;
    min-width: 0 !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-advanced {
    flex: 1 1 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-advanced > summary {
    display: none !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-advanced :is(.form-grid, .service-request-advanced-filter-grid) > label {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] :is(.bims-filter-search, .bims-filter-field, .bims-filter-advanced)[class] :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not(.barangay-select-search-native):not(.permission-account-search-input):not([data-map-search]),
    select:not([multiple]):not(.barangay-select-search-native)
  ) {
    font-size: 1rem !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-actions {
    width: 100% !important;
    flex: 1 1 auto !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"] .bims-filter-actions :is(.btn, button, a, input[type="submit"], input[type="reset"]) {
    flex: 1 1 auto !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-simple="true"] .bims-filter-toggle {
    display: none !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-simple="true"] .bims-filter-search {
    flex: 1 1 120px !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-simple="true"] .bims-filter-fields {
    display: contents !important;
  }

  html:root body form[data-bims-filter-ready][data-bims-filter-collapsed="true"][data-bims-filter-simple="true"] .bims-filter-actions {
    flex: 0 1 auto !important;
    width: auto !important;
  }

@media (max-width: 767px) {
  html:root body .bims-filter-summary .bims-filter-chip,
  html:root body .bims-filter-summary .bims-filter-clear { min-height: 44px !important; }
}

html:root body .bims-filter-summary[hidden],
html:root body .bims-filter-applied[hidden] {
  display: none !important;
}

@media print {
  html:root body form[data-bims-filter-ready],
  html:root body .bims-filter-summary {
    display: none !important;
  }
}
.bims-filter-status {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  margin: 8px 0 0;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: .8125rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
  color: var(--muted, #526e62);
}
.bims-filter-status > [data-bims-language-text] {
  flex: 1 1 220px;
  min-width: 0;
}
.bims-filter-status.is-error { color: #9f2525; }
html:root body .governance-live-status {
  box-sizing: border-box;
  min-width: 0;
  margin: 8px 0;
  padding: 10px 12px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
html:root body .governance-live-status:empty { display: none; }
.bims-filter-status.is-complete {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.is-filter-loading .bims-filter-actions button[type="submit"]::after,
.is-filter-loading > button[type="submit"]::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 6px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: bims-filter-spin .7s linear infinite;
}
@keyframes bims-filter-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .is-filter-loading .bims-filter-actions button[type="submit"]::after,
  .is-filter-loading > button[type="submit"]::after { animation: none; }
}
