/*
 * BIMS whole-system interface contract
 *
 * This file is intentionally loaded after every legacy and page-specific
 * stylesheet. It owns shared geometry only: page alignment, spacing, control
 * sizing, card chrome, forms, tables, action rows, and responsive behavior.
 * Organization colors continue to come from the selected --bims-* theme.
 * Map engines, chart canvases, document paper, and print output keep their
 * purpose-built layout rules.
 */

:root {
  --bims-system-control: 44px;
  --bims-system-control-compact: 36px;
  --bims-system-control-touch: 48px;
  --bims-system-radius-control: 12px;
  --bims-system-radius-inset: 14px;
  --bims-system-radius-card: 18px;
  --bims-system-radius-shell: 20px;
  --bims-system-space-1: 4px;
  --bims-system-space-2: 8px;
  --bims-system-space-3: 12px;
  --bims-system-space-4: 16px;
  --bims-system-space-5: 20px;
  --bims-system-space-6: 24px;
  --bims-system-space-7: 32px;
  --bims-system-page-max: 1840px;
  --bims-system-page-gutter: clamp(18px, 1.7vw, 28px);
  --bims-system-line: var(--bims-border, var(--ui-border, #d6e1da));
  --bims-system-line-strong: var(--bims-border-strong, var(--ui-border-strong, #b9cec1));
  --bims-system-surface: var(--bims-surface, var(--ui-surface, #ffffff));
  --bims-system-surface-soft: var(--bims-surface-soft, var(--ui-surface-soft, #f7faf8));
  --bims-system-text: var(--bims-text, var(--ui-text, #14231b));
  --bims-system-text-strong: var(--bims-text-strong, var(--ui-text-strong, #071a11));
  --bims-system-muted: var(--bims-muted, var(--ui-text-muted, #52675b));
  --bims-system-primary: var(--bims-primary, var(--ui-brand, #0b7449));
  --bims-system-primary-strong: var(--bims-primary-strong, var(--ui-brand-hover, #075b39));
  --bims-system-primary-soft: var(--bims-primary-soft, var(--ui-brand-soft, #e8f5ed));
  --bims-system-focus: var(--bims-focus, rgba(27, 109, 224, .20));
  --bims-system-shadow-card: 0 10px 28px color-mix(in srgb, var(--bims-shadow, rgba(18, 55, 34, .12)) 58%, transparent), 0 1px 3px rgba(13, 49, 29, .04);
  --bims-system-shadow-float: 0 22px 60px color-mix(in srgb, var(--bims-shadow, rgba(9, 38, 22, .20)) 82%, transparent), 0 5px 16px rgba(9, 38, 22, .08);
}

html {
  min-width: 0;
  scroll-padding-top: 108px;
}

body.bims-pro-shell,
body.city-government {
  color: var(--bims-system-text);
  font-family: "Segoe UI Variable", "Segoe UI", Inter, Roboto, Arial, sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.bims-pro-shell *,
body.city-government * {
  box-sizing: border-box;
}

/* --------------------------------------------------------------------------
   Shared staff shell and page alignment
   -------------------------------------------------------------------------- */

body.bims-admin-shell {
  --sidebar-width: 292px;
  --bims-topbar-control-width: 270px;
  --bims-topbar-control-height: max(44px, 2.85rem);
  overflow-x: hidden;
}

body.bims-admin-shell .app-shell {
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr) !important;
  align-items: stretch;
  min-width: 0;
}

body.bims-admin-shell .main {
  min-width: 0;
  padding: 0 var(--bims-system-page-gutter) 28px !important;
}

body.bims-admin-shell .topbar {
  box-sizing: border-box;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  min-height: 64px !important;
  margin: 0 calc(var(--bims-system-page-gutter) * -1) var(--bims-system-space-4) !important;
  padding: 10px var(--bims-system-page-gutter) !important;
  gap: var(--bims-system-space-3) !important;
  overflow: visible;
  border-bottom: 1px solid var(--bims-system-line) !important;
  background: color-mix(in srgb, var(--bims-system-surface) 91%, transparent) !important;
  box-shadow: 0 7px 24px rgba(18, 55, 34, .055) !important;
  backdrop-filter: saturate(170%) blur(22px);
  -webkit-backdrop-filter: saturate(170%) blur(22px);
}

body.bims-admin-shell .topbar > .topbar-title {
  display: grid !important;
  align-content: center;
  justify-items: start;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  gap: 3px;
  margin: 0 !important;
  text-align: left !important;
}

body.bims-admin-shell .topbar > .menu-btn {
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
}

body.bims-admin-shell .topbar-title h1 {
  justify-content: flex-start !important;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 !important;
  color: var(--bims-system-text-strong) !important;
  font-size: clamp(1.18rem, 1.35vw, 1.42rem) !important;
  font-weight: 820 !important;
  line-height: 1.2 !important;
  letter-spacing: -.025em;
}

body.bims-admin-shell .topbar-title-copy {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
}

body.bims-admin-shell .topbar-title > small {
  margin: 0;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal !important;
  color: var(--bims-system-muted) !important;
  font-size: .75rem !important;
  font-weight: 680 !important;
  line-height: 1.25;
}

body.bims-admin-shell .topbar > .userbox.bpw-account-shell {
  display: grid !important;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1fr);
  align-items: center !important;
  justify-content: end;
  flex: 0 1 auto !important;
  width: min(56%, 456px) !important;
  min-width: 0 !important;
  max-width: 456px !important;
  margin-left: auto !important;
  gap: 10px !important;
}

body.bims-admin-shell .bpw-account-shell > :is(.barangay-switcher, .barangay-scope-pill, .kld-nextly-profile) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Keep the visible scope label inside its existing field. It still labels the
   input for keyboard/screen-reader users without adding a separate header row. */
body.bims-admin-shell .topbar .barangay-lookup-label {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
}

body.bims-admin-shell .topbar .topbar-field-title {
  position: absolute;
  inset: 5px 12px auto;
  z-index: 1;
  min-height: 0;
  margin: 0;
  padding: 0;
  gap: 4px;
  font-size: .68rem !important;
  line-height: 1;
  pointer-events: none;
}

html body.bims-admin-shell .topbar .topbar-field-title .bpw-icon.ico[aria-hidden="true"] {
  width: 12px !important;
  min-width: 12px !important;
  height: 12px !important;
  min-height: 12px !important;
}

body.bims-admin-shell .topbar .barangay-lookup > input:not([type="hidden"]) {
  padding: max(19px, 1.25rem) 12px 4px !important;
  font-size: .83rem !important;
  line-height: 1.15;
}

body.bims-admin-shell .topbar .kld-nextly-profile-button {
  justify-content: flex-start;
  gap: 7px;
  padding: 4px 10px !important;
}

body.bims-admin-shell .topbar .kld-nextly-profile-copy {
  flex: 1 1 auto;
  min-width: 0;
}

body.bims-admin-shell .topbar .kld-nextly-profile-copy b {
  font-size: .83rem;
  line-height: 1.2;
}

body.bims-admin-shell .topbar .kld-nextly-profile-copy small {
  font-size: .72rem;
  line-height: 1.2;
}

body.bims-admin-shell .topbar .kld-nextly-profile-caret {
  flex: 0 0 auto;
}

body.bims-admin-shell .topbar .kld-nextly-profile-dropdown {
  max-width: calc(100vw - 24px);
}

body.bims-admin-shell .bpw-account-shell :is(
  .barangay-lookup,
  .barangay-lookup > input,
  .barangay-select-search,
  .barangay-select-search-input,
  .barangay-lookup-label > select:not(.barangay-select-search-native),
  .barangay-scope-pill,
  .kld-nextly-profile-button
) {
  box-sizing: border-box !important;
  width: 100% !important;
}

body.bims-admin-shell .bpw-account-shell :is(
  .barangay-lookup > input,
  .barangay-select-search-input,
  .barangay-lookup-label > select:not(.barangay-select-search-native),
  .barangay-scope-pill,
  .kld-nextly-profile-button
) {
  min-height: var(--bims-topbar-control-height) !important;
  height: var(--bims-topbar-control-height) !important;
  max-height: var(--bims-topbar-control-height) !important;
  border: 1px solid var(--bims-system-line-strong) !important;
  border-radius: var(--bims-system-radius-control) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: 0 2px 7px rgba(18, 55, 34, .055) !important;
}

/* Match legacy selectors so larger text also enlarges the field, rather than
   being clipped by an earlier hard-coded 44px !important control height. */
body.bims-admin-shell .bpw-account-shell .barangay-switcher .barangay-lookup > input,
body.bims-admin-shell .bpw-account-shell .kld-nextly-profile > .kld-nextly-profile-button {
  min-height: var(--bims-topbar-control-height) !important;
  height: var(--bims-topbar-control-height) !important;
  max-height: var(--bims-topbar-control-height) !important;
}

body.bims-admin-shell .bims-page-stack,
body.bims-admin-shell .workflow-parent-nav,
body.bims-admin-shell .main > .alert,
body.bims-admin-shell .bims-policy-footer {
  width: min(100%, var(--bims-system-page-max));
  min-width: 0;
  margin-right: auto;
  margin-left: auto;
}

body.bims-admin-shell .bims-page-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: var(--bims-system-space-4);
}

body.bims-admin-shell .bims-page-stack > * {
  min-width: 0;
  max-width: 100%;
}

body.bims-admin-shell .bims-page-stack > :is(
  .panel,
  .bpw-panel,
  .dashboard-welcome,
  .category-hero,
  .table-wrap,
  .module-grid,
  .module-grid-pro,
  .dashboard-report-grid,
  .executive-kpi-grid,
  .stats-grid,
  .stat-grid
) {
  width: 100%;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.bims-admin-shell .workflow-parent-nav,
body.bims-admin-shell .main > .alert {
  margin-bottom: var(--bims-system-space-4) !important;
}

/* --------------------------------------------------------------------------
   Navigation
   -------------------------------------------------------------------------- */

body.bims-admin-shell .sidebar {
  width: auto;
  min-width: 0;
  padding: 16px 12px !important;
  overflow-x: hidden;
}

body.bims-admin-shell .sidebar .brand {
  min-height: 92px;
  margin: 0 2px 16px !important;
  padding: 14px !important;
  gap: 12px !important;
  border-radius: var(--bims-system-radius-card) !important;
}

body.bims-admin-shell .side-nav {
  gap: 7px !important;
}

body.bims-admin-shell .side-nav :is(details, summary, a) {
  min-width: 0;
}

body.bims-admin-shell .side-nav :is(summary, a) {
  min-height: var(--bims-system-control) !important;
  padding: 9px 10px !important;
  gap: 9px !important;
  border-radius: var(--bims-system-radius-control) !important;
  font-size: .85rem !important;
  line-height: 1.25 !important;
}

body.bims-admin-shell .side-nav details[open] > .nav-submenu {
  gap: 5px !important;
  margin-top: 4px;
  padding: 7px 7px 8px !important;
}

body.bims-admin-shell .side-nav .nav-step {
  display: inline-grid;
  place-items: center;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  font-size: .69rem !important;
  font-variant-numeric: tabular-nums;
}

body.bims-admin-shell .side-nav :is(.bpw-icon, .ico) {
  width: 21px !important;
  min-width: 21px !important;
  height: 21px !important;
  min-height: 21px !important;
  padding: 0 !important;
}

body.bims-admin-shell .side-nav a:is(.active, .is-active),
body.bims-admin-shell .side-nav details.active-group > summary {
  box-shadow: inset 3px 0 0 var(--bims-accent, #d7a323), inset 0 1px 0 rgba(255, 255, 255, .14), 0 7px 18px rgba(0, 0, 0, .09) !important;
}

/* --------------------------------------------------------------------------
   Shared panels, headings, metric cards, and information blocks
   -------------------------------------------------------------------------- */

body.bims-admin-shell .bims-page-stack :is(
  .panel,
  .bpw-panel,
  .dashboard-welcome,
  .category-hero,
  .chart-panel,
  .ai-executive-panel,
  .area-dashboard-panel,
  .notification-inbox-panel,
  .reports-panel,
  .receipt-panel,
  .permission-matrix-panel
) {
  min-width: 0;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-card) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: var(--bims-system-shadow-card) !important;
}

body.bims-admin-shell .bims-page-stack :is(.panel, .bpw-panel) {
  padding: clamp(18px, 1.7vw, 24px) !important;
}

body.bims-admin-shell .bims-page-stack :is(
  .complaint-detail-card,
  .area-module-card,
  .breakdown-card,
  .segment-section,
  .workflow-status-note,
  .service-citizen-action-panel,
  .complaint-feedback-panel,
  .complaint-mode-actions-card,
  .inset-panel,
  .notice-card
) {
  min-width: 0;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface-soft) !important;
  box-shadow: none !important;
}

body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap;
  min-width: 0;
  gap: var(--bims-system-space-3) var(--bims-system-space-4) !important;
  margin-bottom: var(--bims-system-space-4) !important;
}

body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) > :first-child {
  min-width: 0;
}

body.bims-admin-shell .bims-page-stack :is(.panel-header h2, .bpw-panel-head h3, .dashboard-panel-header h2, .category-hero h1) {
  margin: 0 !important;
  color: var(--bims-system-text-strong) !important;
  font-size: clamp(1.06rem, 1.3vw, 1.28rem) !important;
  font-weight: 830 !important;
  line-height: 1.25 !important;
  letter-spacing: -.022em;
}

body.bims-admin-shell .bims-page-stack :is(.panel-header p, .bpw-panel-head p, .dashboard-panel-header p, .category-hero p, .dashboard-welcome p) {
  max-width: 78ch;
  margin: 4px 0 0 !important;
  color: var(--bims-system-muted) !important;
  font-size: .88rem !important;
  line-height: 1.48 !important;
}

body.bims-admin-shell .bims-page-stack :is(
  .executive-kpi-grid,
  .area-dashboard-kpis,
  .stats-grid,
  .stat-grid,
  .metric-grid,
  .module-grid,
  .module-grid-pro,
  .dashboard-report-grid,
  .executive-report-grid
) {
  align-items: stretch !important;
  gap: var(--bims-system-space-3) !important;
}

body.bims-admin-shell .bims-page-stack :is(.metric-card, .stat-card, .module-card, .module-card-pro) {
  box-sizing: border-box;
  min-width: 0;
  height: 100%;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: 0 4px 14px rgba(18, 55, 34, .055) !important;
}

body.bims-admin-shell .bims-page-stack :is(.metric-card, .stat-card) {
  align-items: center !important;
  min-height: 104px;
  padding: 14px !important;
  gap: 12px !important;
}

body.bims-admin-shell .bims-page-stack :is(.metric-card, .stat-card) > div {
  min-width: 0;
}

body.bims-admin-shell .bims-page-stack :is(.metric-card, .stat-card) :is(span, small) {
  overflow-wrap: anywhere;
}

/* --------------------------------------------------------------------------
   One control, form, filter, and action grammar
   -------------------------------------------------------------------------- */

body.bims-admin-shell .bims-page-stack :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"]),
  select:not([multiple]):not(.barangay-select-search-native)
):not([data-map-search]):not([data-radar-priority-filter]) {
  box-sizing: border-box !important;
  width: 100%;
  min-width: 0;
  min-height: var(--bims-system-control) !important;
  height: var(--bims-system-control) !important;
  max-height: var(--bims-system-control) !important;
  padding: 10px 12px !important;
  border: 1px solid var(--bims-system-line-strong) !important;
  border-radius: var(--bims-system-radius-control) !important;
  background: var(--bims-system-surface) !important;
  color: var(--bims-system-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82), 0 1px 2px rgba(18, 55, 34, .035) !important;
  font: inherit !important;
  font-size: .875rem !important;
  line-height: 1.2 !important;
}

body.bims-admin-shell .bims-page-stack select:not([multiple]):not(.barangay-select-search-native) {
  padding-right: 32px !important;
}

body.bims-admin-shell .bims-page-stack textarea {
  box-sizing: border-box !important;
  width: 100%;
  min-width: 0;
  min-height: 116px !important;
  padding: 11px 12px !important;
  resize: vertical;
  border: 1px solid var(--bims-system-line-strong) !important;
  border-radius: var(--bims-system-radius-control) !important;
  background: var(--bims-system-surface) !important;
  color: var(--bims-system-text) !important;
  font: inherit !important;
  font-size: .875rem !important;
  line-height: 1.5 !important;
}

body.bims-admin-shell .bims-page-stack input[type="file"] {
  min-height: var(--bims-system-control) !important;
  padding: 7px 9px !important;
  border: 1px dashed var(--bims-system-line-strong) !important;
  border-radius: var(--bims-system-radius-control) !important;
  background: var(--bims-system-surface-soft) !important;
}

body.bims-admin-shell .bims-page-stack :is(input, select, textarea):focus {
  outline: 0 !important;
  border-color: var(--bims-system-primary) !important;
  box-shadow: 0 0 0 4px var(--bims-system-focus) !important;
}

body.bims-admin-shell .bims-page-stack :is(input, select, textarea):disabled,
body.bims-admin-shell .bims-page-stack :is(input, select, textarea)[readonly] {
  border-color: var(--bims-system-line) !important;
  background: color-mix(in srgb, var(--bims-system-surface-soft) 92%, #dfe8e2) !important;
  color: var(--bims-system-muted) !important;
  opacity: 1 !important;
}

body.bims-admin-shell .bims-page-stack :is(.record-form, .form-stack, .stack-form, .compact-form) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  gap: var(--bims-system-space-4) !important;
}

body.bims-admin-shell .bims-page-stack .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: var(--bims-system-space-4) var(--bims-system-space-5) !important;
  min-width: 0;
}

body.bims-admin-shell .bims-page-stack .form-grid > :is(.span-two, .full, .full-span, .form-section-title, .form-actions, .button-row, .alert, fieldset) {
  grid-column: 1 / -1;
}

body.bims-admin-shell .bims-page-stack :is(.form-grid, .record-form, .form-stack, .stack-form) > label,
body.bims-admin-shell .bims-page-stack .form-group {
  align-self: start;
  align-content: start;
  min-width: 0;
  margin: 0 !important;
}

body.bims-admin-shell .bims-page-stack :is(.field-title, .bims-field-title) {
  min-height: 24px;
  color: var(--bims-system-text-strong) !important;
  font-size: .84rem !important;
  font-weight: 790 !important;
  line-height: 1.3 !important;
}

body.bims-admin-shell .bims-page-stack :is(.help-text, .form-help-text, .bims-field-guide, label > small) {
  margin: 0 !important;
  color: var(--bims-system-muted) !important;
  font-size: .85rem !important;
  line-height: 1.55 !important;
}

body.bims-admin-shell .bims-page-stack .form-section-title {
  min-height: 42px;
  margin: var(--bims-system-space-2) 0 0 !important;
  padding: 13px 0 8px !important;
  border-top: 1px solid var(--bims-system-line) !important;
  color: var(--bims-system-text-strong) !important;
  font-size: 1rem !important;
  font-weight: 820 !important;
  line-height: 1.3 !important;
}

body.bims-admin-shell .bims-page-stack :is(.btn, button:not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out), input[type="submit"], input[type="button"], input[type="reset"]) {
  min-height: var(--bims-system-control) !important;
}

body.bims-admin-shell .bims-page-stack :is(.btn-small, .btn--sm, .btn.small, .btn-sm, .row-actions .btn) {
  min-height: var(--bims-system-control-compact) !important;
  height: var(--bims-system-control-compact) !important;
  padding: 7px 11px !important;
  border-radius: 10px !important;
  font-size: .79rem !important;
}

body.bims-admin-shell .bims-page-stack :is(.form-actions, .button-row, .row-actions, .public-hero-actions) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end;
  flex-wrap: wrap;
  min-width: 0;
  gap: 9px !important;
}

body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters) {
  display: flex !important;
  align-items: end !important;
  flex-wrap: wrap;
  min-width: 0;
  gap: 10px !important;
  padding: 13px !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface-soft) !important;
  box-shadow: none !important;
}

body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters) > label {
  flex: 1 1 190px;
  min-width: min(190px, 100%);
  margin: 0 !important;
}

body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters) :is(
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  select:not([multiple]),
  .btn,
  button,
  input[type="submit"]
) {
  min-height: var(--bims-system-control) !important;
  height: var(--bims-system-control) !important;
  max-height: var(--bims-system-control) !important;
}

/* --------------------------------------------------------------------------
   Tables and row alignment
   -------------------------------------------------------------------------- */

body.bims-admin-shell .bims-page-stack .table-wrap {
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: none !important;
  scrollbar-color: var(--bims-system-line-strong) transparent;
}

body.bims-admin-shell .bims-page-stack .table-wrap > table {
  width: 100%;
  min-width: 720px;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body.bims-admin-shell .bims-page-stack table th {
  height: 44px;
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--bims-system-line-strong) !important;
  background: var(--bims-system-surface-soft) !important;
  color: var(--bims-system-text-strong) !important;
  font-size: .82rem !important;
  font-weight: 840 !important;
  line-height: 1.4 !important;
  letter-spacing: .025em;
  vertical-align: middle !important;
}

body.bims-admin-shell .bims-page-stack table td {
  min-width: 0;
  padding: 11px 12px !important;
  border-bottom: 1px solid var(--bims-system-line) !important;
  color: var(--bims-system-text) !important;
  font-size: .84rem !important;
  line-height: 1.4 !important;
  vertical-align: middle !important;
}

body.bims-admin-shell .bims-page-stack table tbody tr:last-child > td {
  border-bottom: 0 !important;
}

body.bims-admin-shell .bims-page-stack table tbody tr:hover > td {
  background: color-mix(in srgb, var(--bims-system-primary-soft) 58%, var(--bims-system-surface)) !important;
}

body.bims-admin-shell .bims-page-stack table :is(th, td).actions-col,
body.bims-admin-shell .bims-page-stack table td.row-actions {
  text-align: right !important;
}

body.bims-admin-shell .bims-page-stack table td.row-actions > :is(div, span) {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

/* Action cells must stay in the table layout. A flex <td> paints only as tall
   as its buttons, leaving a blank strip beside taller content cells. Keep the
   controls inline here; the mobile card layout below still owns its flex/grid
   action area. */
@media (min-width: 761px) {
  body.bims-admin-shell table tbody td.row-actions,
  body.bims-admin-shell .bims-page-stack table tbody td.row-actions {
    display: table-cell !important;
    vertical-align: middle !important;
  }

  body.bims-admin-shell table tbody td.row-actions:has(> :is(a, button, form) + :is(a, button, form)):not(:has(> :is(details, form.record-form, form.compact-form))) {
    white-space: nowrap !important;
  }

  body.bims-admin-shell table tbody td.row-actions > :is(a, button) {
    margin: 2px 0 2px 6px !important;
    vertical-align: middle;
  }

  /* Only button-only forms share the inline action row. Forms with fields keep
     their normal block layout inside the full-height table cell. */
  body.bims-admin-shell table tbody td.row-actions > form:has(> :is(button, input[type="submit"])):not(:has(:is(label, fieldset, select, textarea, input:not([type="hidden"]):not([type="submit"])))) {
    display: inline-flex !important;
    margin: 2px 0 2px 6px !important;
    vertical-align: middle;
  }
}

body.bims-admin-shell .bims-page-stack :is(.pagination-wrap, .pagination) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  min-width: 0;
  gap: 9px;
  margin-top: var(--bims-system-space-4) !important;
}

/* --------------------------------------------------------------------------
   Main dashboard outer composition. Map and chart engines remain untouched.
   -------------------------------------------------------------------------- */

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-command-center {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap;
  gap: var(--bims-system-space-4) !important;
  padding: 18px 22px !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-command-center > div {
  flex: 1 1 520px;
  min-width: 0;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-period-form {
  display: flex !important;
  align-items: end !important;
  flex: 0 1 auto;
  min-width: 0;
  gap: 9px !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-dasma-map-panel {
  padding: clamp(18px, 1.7vw, 24px) !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-metric-bar {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  min-width: 0;
  gap: 8px !important;
  margin: 0 0 var(--bims-system-space-4) !important;
  padding: 1px 0 5px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scroll-snap-type: x proximity;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-filter {
  flex: 0 0 auto !important;
  min-height: var(--bims-system-control) !important;
  height: var(--bims-system-control) !important;
  padding: 9px 13px !important;
  gap: 7px !important;
  border-radius: var(--bims-system-radius-control) !important;
  scroll-snap-align: start;
  white-space: nowrap;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-dasma-map-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
  align-items: stretch !important;
  gap: var(--bims-system-space-4) !important;
  min-width: 0;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] :is(.bpw-dasma-map-canvas, .bpw-map-details) {
  min-width: 0;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: none !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-details {
  align-content: start;
  padding: 16px !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-detail-grid > div {
  min-width: 0;
  min-height: 74px;
  padding: 11px !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: 12px !important;
  background: var(--bims-system-surface-soft) !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-actions .btn {
  width: 100% !important;
}

/* Keep Google's native fullscreen action reachable on both dashboard maps.
   The dashboard toolbar and complaint priority picker are sibling overlays,
   so they must reserve the map engine's upper-right control lane instead of
   covering it at desktop or responsive widths. */
body.bims-admin-shell[data-bims-guide-route="dashboard.php"] {
  --bims-map-native-top-control-reserve: 72px;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] :is(
  .bpw-map-toolbar,
  .complaint-radar-toolbar
) {
  right: var(--bims-map-native-top-control-reserve) !important;
}

body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .complaint-radar-toolbar {
  max-width: calc(100% - 14px - var(--bims-map-native-top-control-reserve)) !important;
}

@media (max-width: 760px) {
  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .complaint-radar-toolbar {
    max-width: calc(100% - 10px - var(--bims-map-native-top-control-reserve)) !important;
  }
}

/* Keep map-engine internals outside generic responsive-media sizing. */
body.bims-admin-shell .leaflet-container,
body.bims-admin-shell .leaflet-container * {
  max-width: none;
}

/* --------------------------------------------------------------------------
   Citizen, public, and city surfaces share the same visual grammar while
   retaining their own navigation and information architecture.
   -------------------------------------------------------------------------- */

body.public-service-body {
  --bims-public-content-max: 1180px;
}

body.public-service-body :is(.public-service-shell, .citizen-access-shell-page, .citizen-portal-shell, .mydasma-shell) {
  width: min(100% - 32px, var(--bims-public-content-max));
  min-width: 0;
  margin-right: auto;
  margin-left: auto;
}

body.public-service-body :is(
  .public-service-card,
  .citizen-account-panel,
  .citizen-resident-state-card,
  .citizen-access-card,
  .citizen-access-aside,
  .citizen-portal-feature,
  .citizen-public-view-card,
  .mydasma-section
) {
  min-width: 0;
  border-radius: var(--bims-system-radius-card) !important;
  border-color: var(--bims-system-line) !important;
  box-shadow: var(--bims-system-shadow-card) !important;
}

body.public-service-body :is(
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  select:not([multiple]),
  .btn,
  button:not(.citizen-mobile-menu-button):not(.citizen-info-modal-close)
) {
  min-height: var(--bims-system-control-touch) !important;
  border-radius: var(--bims-system-radius-control) !important;
}

body.public-service-body :is(.form-grid, .citizen-access-field-grid, .citizen-resident-fields) {
  align-items: start;
  gap: var(--bims-system-space-4) var(--bims-system-space-5) !important;
}

body.city-government .city-container {
  width: min(100% - 40px, 1240px) !important;
  min-width: 0;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.city-government :is(.city-card, .city-record-card, .city-module, .city-publication__fact) {
  min-width: 0;
  border-radius: var(--bims-system-radius-card) !important;
}

/* --------------------------------------------------------------------------
   Policy, kiosk, handoff, and print-adjacent standalone screens
   -------------------------------------------------------------------------- */

body.bims-policy-body {
  margin: 0;
  min-height: 100svh;
  padding: clamp(18px, 4vw, 48px);
  background: linear-gradient(180deg, var(--bims-system-surface-soft), color-mix(in srgb, var(--bims-system-primary-soft) 55%, #ffffff));
}

body.bims-policy-body .bims-policy-page {
  width: min(100%, 920px);
  margin: 0 auto;
  padding: clamp(22px, 4vw, 48px) !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-shell) !important;
  background: var(--bims-system-surface) !important;
  box-shadow: var(--bims-system-shadow-card) !important;
}

body.bims-policy-body .bims-policy-page h1 {
  margin-top: 0;
  color: var(--bims-system-text-strong);
  font-size: clamp(1.65rem, 4vw, 2.35rem);
  line-height: 1.16;
}

body.bims-policy-body .bims-policy-page h2 {
  margin-top: 1.65em;
  padding-top: .8em;
  border-top: 1px solid var(--bims-system-line);
  color: var(--bims-system-text-strong);
  font-size: 1.12rem;
}

body.bims-policy-body .bims-policy-page p,
body.bims-policy-body .bims-policy-page li {
  color: var(--bims-system-text);
  line-height: 1.7;
}

body.bims-kiosk-body {
  margin: 0;
  min-height: 100svh;
  padding: clamp(20px, 4vw, 56px);
  background: radial-gradient(circle at 50% -15%, #176b73 0%, #0a3f38 38%, #05251c 100%);
  color: #f7fff9;
}

body.bims-kiosk-body .bims-kiosk-header {
  max-width: 1120px;
  margin: 0 auto clamp(22px, 4vh, 42px);
  text-align: center;
}

body.bims-kiosk-body .bims-kiosk-header h1 {
  margin: .12em 0;
  color: #ffffff;
  font-size: clamp(2.4rem, 6vw, 5.5rem);
  line-height: 1;
  letter-spacing: -.04em;
}

body.bims-kiosk-body .bims-kiosk-header p {
  margin: .35em 0;
  color: #dff8e7;
  font-size: clamp(1rem, 2vw, 1.45rem);
  font-weight: 700;
}

body.bims-kiosk-body .bims-kiosk-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: clamp(18px, 3vw, 32px);
  width: min(100%, 1280px);
  margin: 0 auto;
}

body.bims-kiosk-body .bims-kiosk-panel {
  min-width: 0;
  padding: clamp(22px, 3vw, 40px);
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: var(--bims-system-radius-shell);
  background: rgba(255, 255, 255, .96);
  color: #0a2c22;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

body.bims-kiosk-body .bims-kiosk-panel h2 {
  margin: 0 0 18px;
  font-size: clamp(1.3rem, 2.5vw, 2rem);
}

body.bims-kiosk-body :is(.bims-kiosk-serving, .bims-kiosk-serving-grid) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 16px;
}

body.bims-kiosk-body :is(.token, .bims-kiosk-token) {
  padding: clamp(20px, 3vw, 30px);
  border: 2px solid #168a5b;
  border-radius: var(--bims-system-radius-card);
  background: #f7fcf9;
  text-align: center;
}

body.bims-kiosk-body :is(.token, .bims-kiosk-token) b {
  display: block;
  color: #075b39;
  font-size: clamp(3rem, 7vw, 6.4rem);
  line-height: 1;
  letter-spacing: -.045em;
}

body.bims-kiosk-body :is(.token, .bims-kiosk-token) span {
  display: block;
  margin-top: 8px;
  font-size: clamp(1rem, 2vw, 1.5rem);
  font-weight: 750;
}

body.bims-kiosk-body :is(.bims-kiosk-waiting, .bims-kiosk-waiting-list) {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

body.bims-kiosk-body .bims-kiosk-empty {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 112px;
  margin: 0;
  padding: 18px;
  border: 1px dashed #badfca;
  border-radius: var(--bims-system-radius-card);
  background: var(--bims-system-surface-soft);
  color: var(--bims-system-muted);
  text-align: center;
}

body.bims-kiosk-body :is(.bims-kiosk-serving-grid, .bims-kiosk-waiting-list).is-unavailable .bims-kiosk-empty {
  border-color: #d92d20;
  background: #fff3f1;
  color: #8f1d16;
  font-weight: 800;
}

body.bims-kiosk-body :is(.waiting-token, .bims-kiosk-waiting-token) {
  padding: 10px 15px;
  border: 1px solid #badfca;
  border-radius: 999px;
  background: #eaf7ef;
  color: #075b39;
  font-size: 1.08rem;
  font-weight: 820;
}

body.bims-kiosk-body .bims-kiosk-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: min(100%, 1280px);
  margin: 24px auto 0;
  color: #dff8e7;
  text-align: center;
}

body.bims-kiosk-body .bims-kiosk-footer p {
  margin: 0;
}

body.bims-kiosk-body .bims-kiosk-footer #retry {
  min-height: 44px;
  border-color: rgba(255, 255, 255, .52);
  background: #ffffff;
  color: #075b39;
}

body.bims-handoff-body {
  display: grid;
  place-items: center;
  min-height: 100svh;
  margin: 0;
  padding: 20px;
  background: linear-gradient(160deg, var(--bims-system-surface-soft), var(--bims-system-primary-soft));
}

body.bims-handoff-body > main,
body.bims-handoff-body > section {
  width: min(100%, 620px);
  padding: clamp(22px, 4vw, 38px);
  border: 1px solid var(--bims-system-line);
  border-radius: var(--bims-system-radius-shell);
  background: var(--bims-system-surface);
  box-shadow: var(--bims-system-shadow-card);
  text-align: center;
}

@media screen {
  body.print-page .document-print-shell,
  body.print-page .print-area {
    border-radius: var(--bims-system-radius-inset);
  }
}

/* --------------------------------------------------------------------------
   Responsive contract
   -------------------------------------------------------------------------- */

@media (max-width: 1440px) {
  body.bims-admin-shell {
    --sidebar-width: 280px;
    --bims-topbar-control-width: 238px;
    --bims-system-page-gutter: 20px;
  }
}

@media (max-width: 1180px) {
  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-dasma-map-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 1024px) {
  body.bims-admin-shell {
    --bims-system-page-gutter: 16px;
  }

  body.bims-admin-shell .app-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.bims-admin-shell .sidebar {
    width: min(292px, calc(100vw - 42px));
  }

}

@media (max-width: 760px) {
  :root {
    --bims-system-page-gutter: 12px;
  }

  body.bims-admin-shell .main {
    padding-bottom: 18px !important;
  }

  body.bims-admin-shell .topbar-title h1 {
    font-size: 1.04rem !important;
    width: 100%;
    max-width: 100%;
  }

  body.bims-admin-shell .topbar-title-copy {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
  }

  body.bims-admin-shell .topbar-title > small {
    font-size: .68rem !important;
  }

  body.bims-admin-shell .bims-page-stack {
    gap: 12px;
  }

  body.bims-admin-shell .bims-page-stack :is(.panel, .bpw-panel) {
    padding: 15px !important;
    border-radius: 16px !important;
  }

  body.bims-admin-shell .bims-page-stack .form-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 13px !important;
  }

  body.bims-admin-shell .bims-page-stack .form-grid > * {
    grid-column: 1 !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.form-actions, .button-row) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
  }

  body.bims-admin-shell .bims-page-stack :is(.form-actions, .button-row) > :is(.btn, button, input[type="submit"]) {
    width: 100% !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch !important;
    padding: 11px !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters) > * {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-command-center {
    align-items: stretch !important;
    padding: 15px !important;
  }

  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-command-center > div {
    flex: 0 1 auto;
  }

  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .dashboard-period-form {
    width: 100%;
  }

  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-dasma-map-panel {
    padding: 13px !important;
  }

  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-detail-grid,
  body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.public-service-body :is(.public-service-shell, .citizen-access-shell-page, .citizen-portal-shell, .mydasma-shell) {
    width: min(100% - 24px, var(--bims-public-content-max));
  }

  body.city-government .city-container {
    width: min(100% - 24px, 1240px) !important;
  }

  body.bims-kiosk-body .bims-kiosk-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Wrap only when title, drawer button and account controls actually need it.
   The 1024px navigation breakpoint must not create an extra header row. */
@media (max-width: 700px) {
  body.bims-admin-shell .topbar {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 8px var(--bims-system-page-gutter) !important;
    gap: 8px 10px !important;
  }

  body.bims-admin-shell .topbar > .menu-btn {
    grid-column: 1;
    grid-row: 1;
  }

  body.bims-admin-shell .topbar > .topbar-title {
    grid-column: 2;
    grid-row: 1;
  }

  body.bims-admin-shell .topbar > .userbox.bpw-account-shell {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    gap: 8px !important;
  }
}

@media (max-width: 400px) {
  body.bims-admin-shell .topbar > .userbox.bpw-account-shell {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media print {
  body.bims-admin-shell .topbar {
    display: none !important;
  }
}

@media (max-width: 480px) {
  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
  }

  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) > :is(.btn, button, a.btn) {
    width: 100% !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) > :is(.actions, .button-row, .form-actions) {
    min-width: 0;
    max-width: 100%;
  }

  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header) :is(.btn, button, a.btn) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

@media (pointer: coarse) {
  body.bims-pro-shell :is(a, button, input, select, summary) {
    touch-action: manipulation;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.bims-pro-shell *,
  body.bims-pro-shell *::before,
  body.bims-pro-shell *::after,
  body.city-government *,
  body.city-government *::before,
  body.city-government *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Secretary workspace: visible actions, readable instructions and task links. */
body.bims-admin-shell .secretary-work-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
  gap: 12px;
}
body.bims-admin-shell .secretary-work-card {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  padding: 10px;
  color: var(--bims-system-text-strong);
  border: 1px solid var(--bims-system-line);
  border-radius: var(--bims-system-radius-inset);
  background: var(--bims-system-surface-soft);
  text-decoration: none;
}
body.bims-admin-shell .secretary-work-card-heading { display: flex; align-items: center; gap: 6px; font-size: .9rem; line-height: 1.3; }
body.bims-admin-shell .secretary-work-card-heading .ico { width: 16px !important; height: 16px !important; min-width: 16px !important; min-height: 16px !important; flex: 0 0 16px !important; }
body.bims-admin-shell .secretary-work-card > b { font-size: 1.5rem; line-height: 1.1; }
body.bims-admin-shell .secretary-work-card > span:not(.secretary-work-card-heading) { color: var(--bims-system-muted); font-size: .82rem; line-height: 1.35; }
body.bims-admin-shell .secretary-work-card > small { margin-top: auto; font-size: .8rem; line-height: 1.25; font-weight: 700; }
body.bims-admin-shell .secretary-work-card > small .ico { width: 14px !important; height: 14px !important; min-width: 14px !important; min-height: 14px !important; }
body.bims-admin-shell .secretary-work-card.needs-attention { border-color: #bf591b; background: #fff7ed; }
body.bims-admin-shell :is(.secretary-work-card, .task-inbox-filter-card):hover { border-color: var(--bims-system-line-strong); box-shadow: 0 3px 12px #102c4a12; }
body.bims-admin-shell :is(.secretary-work-card, .task-inbox-filter-card, .secretary-task-filters a):focus-visible { outline: 3px solid #2364b9; outline-offset: 3px; }
body.bims-admin-shell .secretary-work-shortcuts,
body.bims-admin-shell .secretary-task-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
body.bims-admin-shell .secretary-work-shortcuts { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--bims-system-line); }
body.bims-admin-shell .task-inbox-filter-card { text-decoration: none; color: inherit; }
body.bims-admin-shell .task-inbox-filter-card[aria-current="page"],
body.bims-admin-shell .secretary-task-filters a[aria-current="page"] { border-color: #2364b9 !important; background: #edf5ff !important; color: #154778 !important; }
body.bims-admin-shell .task-inbox-filter-panel .form-help-text { margin-top: 12px !important; }
body.bims-admin-shell .resident-review-readiness { padding: 18px; border: 1px solid var(--bims-system-line-strong); border-radius: var(--bims-system-radius-inset); background: var(--bims-system-surface-soft); }
body.bims-admin-shell .resident-review-readiness .form-section-title { border-top: 0 !important; padding-top: 0 !important; margin-top: 0 !important; }
body.bims-admin-shell .resident-review-checklist { display: grid; gap: 9px; margin: 18px 0 0; padding-left: 22px; color: var(--bims-system-text); font-size: .9rem; line-height: 1.55; }
body.bims-admin-shell .resident-review-checklist .is-ready { color: #1c6240; font-weight: 700; }
body.bims-admin-shell .resident-submit-review-control { display: flex; flex-direction: column; gap: 8px; }
body.bims-admin-shell .secretary-task-cell-value { min-width: 0; overflow-wrap: anywhere; }
body.bims-admin-shell .secretary-task-cell-value > small { display: block; margin-top: 4px; font-size: .82rem; line-height: 1.5; }
@media (max-width: 760px) {
  body.bims-admin-shell .bims-page-stack .table-wrap:has(> table.bims-compact-table) {
    overflow: visible;
  }

  body.bims-admin-shell .bims-page-stack .table-wrap > table.bims-compact-table {
    display: block;
    width: 100%;
    min-width: 0;
  }

  body.bims-admin-shell table.secretary-task-table tbody tr { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  body.bims-admin-shell table.secretary-task-table tbody td { display: grid !important; grid-template-columns: 100px minmax(0, 1fr); align-items: start; gap: 12px; padding: 7px 0 !important; }
  body.bims-admin-shell table.secretary-task-table tbody td::before { min-width: 0; font-size: .78rem; line-height: 1.5; }
  body.bims-admin-shell table.secretary-task-table tbody td.row-actions { display: flex !important; justify-content: stretch; }
  body.bims-admin-shell table.secretary-task-table tbody td.row-actions .btn { width: 100% !important; white-space: normal !important; }
}
@media (max-width: 600px) {
  body.bims-admin-shell .secretary-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.bims-admin-shell .secretary-work-card { padding: 10px; gap: 3px; }
  body.bims-admin-shell .secretary-work-card-heading { align-items: flex-start; font-size: .88rem; }
  body.bims-admin-shell .secretary-work-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
  body.bims-admin-shell .secretary-work-shortcuts .btn { flex: 1 1 190px; white-space: normal; }
  body.bims-admin-shell .resident-review-readiness { padding: 14px; }
}
@media (max-width: 360px) { body.bims-admin-shell .secretary-work-grid { grid-template-columns: 1fr; } }

@media print {
  body.bims-admin-shell .bims-page-stack {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.bims-admin-shell .bims-page-stack > * {
    margin-bottom: 12px !important;
    box-shadow: none !important;
  }
}

/* Task inbox: task name first, with visible responsibility and next action. */
@media screen {
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table th:nth-child(1) { width: 44%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table th:nth-child(2) { width: 23%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table th:nth-child(3) { width: 15%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table th:nth-child(4) { width: 18%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table :is(th, td) {
    white-space: normal !important;
    overflow-wrap: anywhere;
    padding: 10px 12px !important;
    vertical-align: top !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] :is(.secretary-task-work, .secretary-task-state, .secretary-task-deadline) {
    display: grid;
    justify-items: start;
    gap: 4px;
    min-width: 0;
    max-width: 100%;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-title {
    display: inline;
    color: var(--bims-system-text-strong);
    font-size: .91rem;
    font-weight: 750;
    line-height: 1.4;
    text-decoration: none;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-title:hover { color: var(--bims-system-primary-strong); text-decoration: underline; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] :is(.secretary-task-meta, .secretary-task-owner) {
    display: block;
    margin: 0;
    color: var(--bims-system-muted);
    font-size: .78rem;
    font-weight: 400;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-reference {
    display: block;
    max-width: 100%;
    margin: 0;
    color: var(--bims-system-muted);
    font-family: Consolas, "Cascadia Mono", monospace;
    font-size: .73rem;
    font-weight: 400;
    line-height: 1.4;
    white-space: normal !important;
    overflow-wrap: anywhere;
    user-select: text;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-state :is(.badge, .status-badge) { max-width: 100%; white-space: normal; line-height: 1.35; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-width: 0; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-deadline { font-size: .82rem; line-height: 1.35; font-variant-numeric: tabular-nums; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-deadline time { display: grid; gap: 2px; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-deadline :is(small, .secretary-task-time) { font-size: .77rem; color: var(--bims-system-muted); line-height: 1.35; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-deadline .secretary-task-overdue { color: #a33227; font-size: .75rem; font-weight: 700; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table td.row-actions {
    vertical-align: middle !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table .secretary-task-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    max-width: 100%;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    font-size: .78rem !important;
    line-height: 1.35 !important;
    text-align: center;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] :is(.secretary-task-title, .secretary-task-action):focus-visible {
    outline: 3px solid #2364b9;
    outline-offset: 3px;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-title .ico { width: 15px !important; height: 15px !important; min-width: 15px !important; min-height: 15px !important; vertical-align: -.12em; margin-right: 4px; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-task-action .ico { width: 15px !important; height: 15px !important; min-width: 15px !important; min-height: 15px !important; flex: 0 0 15px !important; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-draft-table { width: 100% !important; min-width: 0 !important; table-layout: fixed; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table :is(th, td) { white-space: normal !important; overflow-wrap: anywhere; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table th:nth-child(1) { width: 17%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table th:nth-child(2) { width: 18%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table th:nth-child(3) { width: 14%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table th:nth-child(4) { width: 9%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table th:nth-child(5) { width: 42%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table .details-list { grid-template-columns: minmax(0, 1fr) !important; min-width: 0; margin: 8px 0 0; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .secretary-draft-table .details-list :is(dt, dd) { min-width: 0; margin: 0; padding: 6px !important; overflow-wrap: anywhere; }
}
@media screen and (max-width: 760px) {
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .table-wrap:has(> .secretary-task-table) {
    overflow: visible;
    border: 0 !important;
    background: transparent !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table,
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody { display: block; min-width: 0 !important; width: 100%; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table thead { display: none; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    min-width: 0;
    margin: 0 0 10px;
    padding: 12px !important;
    border: 1px solid var(--bims-system-line) !important;
    border-radius: 12px !important;
    background: var(--bims-system-surface) !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody tr:last-child { margin-bottom: 0; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td {
    display: grid !important;
    grid-template-columns: 84px minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    min-width: 0;
    padding: 8px 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td:first-child {
    display: block !important;
    padding-top: 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--bims-system-line) !important;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td:first-child::before,
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td.row-actions::before { display: none !important; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td::before {
    content: attr(data-label);
    color: var(--bims-system-muted);
    font-size: .75rem;
    font-weight: 650;
    line-height: 1.4;
    white-space: normal;
  }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td.secretary-task-state-col::before { content: "Status / owner"; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table tbody td.row-actions { display: block !important; padding-bottom: 0 !important; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-task-table .secretary-task-action { width: 100% !important; min-height: 44px !important; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .table-wrap:has(> .secretary-draft-table) { overflow: visible; }
  body.bims-admin-shell[data-bims-guide-route="desktop_tasks.php"] .bims-page-stack .secretary-draft-table { display: block; width: 100%; min-width: 0 !important; }
}

/* Compact record identity on screen; official print typography is unchanged.
 * Covered staff pages: module_view.php (all module record titles), resident_view.php,
 * household_view.php, household_location_sketch.php, payment_view.php,
 * payment_closeout_view.php, reports.php, and both desktop_activation.php variants.
 * Scope: .bims-page-stack .document-head and its resident-profile specialization.
 * Append after the current system contract: the professional layer supplies 16px
 * padding and the resident layer supplies min-height/nowrap/ellipsis. These narrow
 * overrides replace that spacing without changing heading levels or record text.
 * The two-column treatment requires direct h2 + h3; license UUID/nested headings
 * and extra date/reference paragraphs retain a compact natural reading order.
 * .module-activity-print-head keeps its existing screen-hidden/print-visible
 * lifecycle. .official-letterhead, .official-document-title and print rules are
 * deliberately outside this fragment. No CSS here applies to print media.
 */
@media screen {
  body.bims-admin-shell .bims-page-stack .document-head {
    min-width: 0;
    min-height: 0 !important;
    margin: 0 0 10px !important;
    padding: 10px 12px !important;
    text-align: left !important;
    line-height: 1.35;
    overflow: visible;
    box-shadow: none;
  }

  body.bims-admin-shell .bims-page-stack .document-head :is(h2, h3) {
    display: flex;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 6px;
    margin: 0 !important;
    font-size: 1rem !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  body.bims-admin-shell .bims-page-stack .document-head > h3 {
    margin-top: 3px !important;
  }

  body.bims-admin-shell .bims-page-stack .document-head > p {
    min-width: 0;
    margin: 2px 0 0 !important;
    font-size: .78rem !important;
    line-height: 1.4 !important;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  body.bims-admin-shell .bims-page-stack .document-head > div {
    min-width: 0;
  }

  body.bims-admin-shell .bims-page-stack .document-head :is(h2, h3) > :is(.ico, .bpw-icon, .heading-auto-icon) {
    flex: 0 0 16px !important;
    width: 16px !important;
    min-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head {
    justify-content: flex-start;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 {
    column-gap: 8px;
    row-gap: 4px;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-mark {
    flex: 0 0 28px;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    border-radius: 8px;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-mark > .resident-profile-document-icon {
    width: 16px !important;
    min-width: 16px !important;
    height: 16px !important;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-barangay {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-divider {
    height: 18px;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-label {
    flex: 0 1 auto;
    font-size: .78rem;
    line-height: 1.3;
    white-space: normal;
  }
}

@media screen and (min-width: 761px) {
  body.bims-admin-shell .bims-page-stack .document-head:not(.module-activity-print-head):has(> h2):has(> h3) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    column-gap: 18px;
    row-gap: 2px;
    align-items: center;
  }

  body.bims-admin-shell .bims-page-stack .document-head:not(.module-activity-print-head):has(> h2):has(> h3) > h2 {
    grid-column: 1;
    grid-row: 1;
  }

  body.bims-admin-shell .bims-page-stack .document-head:not(.module-activity-print-head):has(> h2):has(> h3) > p:first-of-type {
    grid-column: 1;
    grid-row: 2;
  }

  body.bims-admin-shell .bims-page-stack .document-head:not(.module-activity-print-head):has(> h2):has(> h3) > h3 {
    grid-column: 2;
    grid-row: 1 / span 2;
    justify-content: flex-end !important;
    margin: 0 !important;
    text-align: right;
  }

  body.bims-admin-shell .bims-page-stack .document-head:not(.module-activity-print-head):has(> h2):has(> h3) > p:nth-of-type(n+2) {
    grid-column: 1 / -1;
  }
}

/* Keep the full resident identity compact on phones, without an ellipsis. */
@media screen and (max-width: 760px) {
  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: auto auto;
    width: 100%;
    column-gap: 8px;
    row-gap: 2px;
    align-items: start;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 > .resident-profile-document-mark {
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 > .resident-profile-document-barangay {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    font-size: .94rem;
    line-height: 1.2;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 > .resident-profile-document-label {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    font-size: .76rem;
    line-height: 1.2;
  }

  body.bims-admin-shell .bims-page-stack .resident-profile-document-head > h2 > .resident-profile-document-divider {
    display: none;
  }
}

/* Staff screen headings: copy starts at the panel edge; actions wrap beside it. */
@media screen {
  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .category-hero, .area-dashboard-hero, .citizen-information-actions) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px 16px !important;
    min-height: 0 !important;
    padding: 16px !important;
    text-align: left !important;
  }

  /* A generated decoration must not become an extra flex item before the copy. */
  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .category-hero, .citizen-information-actions)::before {
    content: none !important;
    display: none !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .category-hero, .area-dashboard-hero, .citizen-information-actions) > div:has(> :is(h1, h2, h3)) {
    flex: 1 1 360px !important;
    min-width: 0;
    max-width: 100%;
    margin: 0 !important;
    text-align: left !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .category-hero, .area-dashboard-hero, .citizen-information-actions) :is(h1, h2, h3) {
    justify-content: flex-start !important;
    margin: 4px 0 0 !important;
    color: var(--bims-system-text-strong) !important;
    font-size: clamp(1.06rem, 1.3vw, 1.28rem) !important;
    line-height: 1.25 !important;
    text-align: left !important;
    overflow-wrap: anywhere;
  }

  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .category-hero, .area-dashboard-hero, .citizen-information-actions) p {
    max-width: 88ch;
    margin: 5px 0 0 !important;
    color: var(--bims-system-muted) !important;
    font-size: .88rem !important;
    line-height: 1.45 !important;
    text-align: left !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .area-dashboard-hero, .citizen-information-actions) > :is(.public-hero-actions, .citizen-information-action-buttons, .btn) {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    margin: 0 0 0 auto;
  }

  body.bims-admin-shell .bims-page-stack .dashboard-welcome > .public-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
  }

  body.bims-admin-shell .bims-page-stack .category-hero > .category-hero-icon {
    flex: 0 0 auto;
    align-self: flex-start;
  }

  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header, .page-heading, .premium-trend-header, .bims-workflow-stage-header, .resident-change-history-intro) {
    text-align: left !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.panel-header, .bpw-panel-head, .dashboard-panel-header, .page-heading, .premium-trend-header, .bims-workflow-stage-header, .resident-change-history-intro) :is(h1, h2, h3, p) {
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

@media screen and (max-width: 760px) {
  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .area-dashboard-hero, .citizen-information-actions) > div:has(> :is(h1, h2, h3)) {
    flex-basis: 100% !important;
  }

  body.bims-admin-shell .bims-page-stack :is(.dashboard-welcome, .area-dashboard-hero, .citizen-information-actions) > :is(.public-hero-actions, .citizen-information-action-buttons, .btn) {
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
  }

  body.bims-admin-shell .bims-page-stack .citizen-information-action-buttons {
    grid-template-columns: minmax(0, 1fr);
  }

  body.bims-admin-shell .bims-page-stack .category-hero {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start !important;
  }
}


/* Resident account linking: compact list controls and actions only. */
html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel {
  --bims-system-control: 40px;
  --ui-action-height: 36px;
  --ui-action-padding-x: 10px;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .btn {
  min-height: var(--ui-action-height) !important;
  height: auto !important;
  max-height: none !important;
  padding: 7px var(--ui-action-padding-x) !important;
  font-size: .8125rem !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  text-align: center;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 8px !important;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0 0 14px !important;
  padding: 10px !important;
  border: 1px solid var(--bims-system-line);
  border-radius: 12px;
  background: var(--bims-system-surface-soft);
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 150px;
  gap: 4px !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  font-size: .75rem !important;
  line-height: 1.3 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label:first-child {
  flex: 2 1 240px;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form :is(input[name="q"], select) {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  font-size: .8125rem !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form select {
  padding-right: 28px !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label:has(input[name="overdue"]) {
  flex: 0 0 auto;
  flex-direction: row !important;
  align-items: center !important;
  align-self: flex-end;
  padding-left: 0 !important;
  min-height: 40px;
  gap: 7px !important;
  white-space: nowrap;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form input[name="overdue"] {
  flex: 0 0 18px;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > .btn {
  flex: 0 0 auto;
  min-height: 40px !important;
  margin: 0 !important;
}

@media (max-width: 767px), (pointer: coarse) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel {
    --bims-system-control: 44px;
    --ui-action-height: 44px;
  }
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form :is(input[name="q"], select) {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    font-size: 1rem !important;
  }
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > :is(.btn, label:has(input[name="overdue"])) {
    min-height: 44px !important;
  }
}

@media (max-width: 767px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label:first-child {
    flex-basis: 100%;
  }
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label:not(:first-child):not(:has(input[name="overdue"])) {
    flex-basis: calc(50% - 4px);
  }
}

@media (max-width: 420px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .filter-form > label:not(:first-child):not(:has(input[name="overdue"])) {
    flex-basis: 100%;
  }
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .table-responsive {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .table-responsive .btn {
  width: max-content !important;
  min-width: max-content !important;
  white-space: nowrap !important;
}


/* Archived Residents: keep enhanced list search and actions on one desktop row. */
html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 8px !important;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] .bims-filter-search {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] .bims-filter-actions {
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  width: auto !important;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] .bims-filter-actions > .btn,
html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] > .bims-filter-toggle {
  flex: 0 0 auto !important;
  width: auto !important;
}
@media (min-width: 768px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] {
    flex-wrap: nowrap !important;
  }
}
@media (max-width: 767px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready] .bims-filter-search {
    flex: 1 1 100% !important;
  }
  html:root body.bims-admin-shell[data-bims-guide-route="resident_archived.php"] .bims-page-stack form.resident-simple-search[data-bims-filter-ready][data-bims-filter-simple="true"] > .bims-filter-toggle {
    display: none !important;
  }
}


/* Resident Data Governance: inset notices and separate the policy action from filters. */
html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > .notice-card {
  box-sizing: border-box;
  padding: 14px 16px !important;
  margin: 0 0 14px !important;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > .notice-card > p {
  margin: 8px 0 0 !important;
  line-height: 1.55;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > details.notice-card > summary {
  margin: 0 !important;
  min-height: 24px;
  line-height: 1.4;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > details.notice-card > .table-wrap {
  margin-top: 10px !important;
}
html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > form.notice-card > .btn {
  margin-top: 12px !important;
  max-width: 100%;
}
@media (max-width: 560px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > .notice-card {
    padding: 12px !important;
  }
  html:root body.bims-admin-shell[data-bims-guide-route="resident_data_governance.php"] .bims-page-stack > .panel > form.notice-card > .btn {
    height: auto !important;
    min-height: 44px !important;
    max-height: none !important;
    max-width: 100% !important;
    white-space: normal !important;
    line-height: 1.3 !important;
  }
}


/* Resident CSV Import: compact route-scoped layout only. */
html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .panel-header {
  margin-bottom: 14px !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 12px !important;
  margin: 0 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0;
  padding: 13px 14px !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface-soft) !important;
  box-shadow: none !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card > h3 {
  margin: 0 !important;
  color: var(--bims-system-text-strong) !important;
  font-size: .96rem !important;
  line-height: 1.35 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card > p {
  margin: 7px 0 0 !important;
  color: var(--bims-system-muted) !important;
  font-size: .84rem !important;
  line-height: 1.48 !important;
  overflow-wrap: anywhere;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card > .btn {
  align-self: flex-start;
  max-width: 100%;
  margin: 10px 0 0 !important;
  padding: 9px 11px !important;
  font-size: .8rem !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  text-align: center;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid + p {
  margin: 11px 0 !important;
  color: var(--bims-system-muted) !important;
  font-size: .8rem !important;
  line-height: 1.48 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid + p > small {
  font-size: inherit !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > details {
  min-width: 0;
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-control) !important;
  background: var(--bims-system-surface-soft) !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > details > summary {
  color: var(--bims-system-text-strong) !important;
  font-size: .86rem !important;
  line-height: 1.4 !important;
  cursor: pointer;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > details > .table-wrap {
  margin-top: 10px !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
  margin-top: 0 !important;
  padding: 13px 14px !important;
  border: 1px solid var(--bims-system-line) !important;
  border-radius: var(--bims-system-radius-inset) !important;
  background: var(--bims-system-surface-soft) !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"]:has(> label:nth-of-type(2)) {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > label {
  display: grid !important;
  padding: 0 !important;
  min-width: 0;
  align-content: start !important;
  gap: 7px !important;
  font-size: .86rem !important;
  line-height: 1.45 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > label > small {
  font-size: .78rem !important;
  line-height: 1.4 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] input[type="file"] {
  width: 100% !important;
  min-width: 0;
  max-width: 100%;
  min-height: 44px !important;
  height: 44px !important;
  max-height: none !important;
  font-size: .8rem !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions {
  display: flex !important;
  grid-column: auto !important;
  align-self: start !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  margin: calc(1.247rem + 7px) 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions > .btn {
  min-height: 44px !important;
  height: 44px !important;
  white-space: nowrap !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card:last-child {
    grid-column: 1 / -1 !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"]:has(> label:nth-of-type(2)) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"]:has(> label:nth-of-type(2)) > .form-actions {
    grid-column: 1 / -1 !important;
    margin-top: 0 !important;
  }
}

@media (max-width: 767px) {
  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid,
  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"],
  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"]:has(> label:nth-of-type(2)) {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > .detail-grid > .detail-card,
  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions {
    grid-column: 1 !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions {
    margin-top: 1px !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions > .btn {
    width: 100% !important;
  }
}


/* Resident guidance: native Details enhancement, route scoped. */
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide {
  box-sizing: border-box;
  min-width: 0;
  max-width: 78ch;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary {
  display: flex !important;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  width: max-content;
  max-width: 100%;
  min-height: 32px;
  margin: 0 !important;
  padding: 4px 8px !important;
  border-radius: 7px;
  color: var(--bims-system-primary, #007e5a) !important;
  font-size: .82rem !important;
  font-weight: 750;
  line-height: 1.4;
  list-style: none !important;
  cursor: pointer;
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary::-webkit-details-marker {
  display: none;
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary::before {
  content: '' !important;
  position: static !important;
  display: block !important;
  flex: 0 0 6px;
  width: 6px !important;
  height: 6px !important;
  margin: 0 2px 0 0 !important;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  background: none !important;
  transform: rotate(-45deg);
  transition: transform 280ms cubic-bezier(.22,.61,.36,1);
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide[open] > summary::before {
  transform: rotate(45deg);
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary:hover {
  background: var(--bims-system-surface-soft, #f2faf6);
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary:focus-visible {
  outline: 2px solid var(--bims-system-primary, #007e5a) !important;
  outline-offset: 2px !important;
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > .bims-resident-guide__body {
  box-sizing: border-box;
  min-width: 0;
  margin: 4px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--bims-system-line, #d6e9df);
  border-radius: 10px;
  background: var(--bims-system-surface-soft, #f2faf6);
}
html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > .bims-resident-guide__body > p {
  max-width: none;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bims-system-muted, #526d60) !important;
  font-size: .85rem !important;
  font-weight: 400;
  line-height: 1.55 !important;
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary {
    min-height: 44px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary::before {
    transition: none;
  }
}
@media print {
  html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > summary {
    display: none !important;
  }
  html:root body.bims-admin-shell[data-bims-resident-guidance][data-bims-guide-route] :is(.bims-page-stack, .modal-frame-main) details.bims-resident-guide > .bims-resident-guide__body {
    border: 0;
    padding: 0;
    background: transparent;
  }
}

/* Translated labels and record numbers reflow inside the same padded controls.
   Keep this final, shared screen rule after route-specific fixed-height rules.
   Native map/chart controls and document print geometry retain their own rules. */
@media screen {
  html:root body:is(.bims-pro-shell, .public-service-body, .mydasma-body, .citizen-page, .city-government) .btn:not(.btn-icon):not(.icon-btn) {
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.3 !important;
    text-align: center;
  }

  html:root body.bims-admin-shell .bims-page-stack :is(.filter-bar, .complaint-basic-filter, .service-request-quick-filters, .row-actions) .btn:not(.btn-icon):not(.icon-btn) {
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body:is(.bims-pro-shell, .public-service-body, .mydasma-body, .citizen-page, .city-government) .btn > :is(.bims-action-label, span:not(.ico):not(.bpw-icon):not(.icon):not(.ui-icon)) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  html:root body:is(.bims-pro-shell, .public-service-body, .mydasma-body, .citizen-page, .city-government) .btn > :is(.ico, .bpw-icon, .icon, .ui-icon) {
    flex-shrink: 0 !important;
  }

  html:root body:is(.bims-pro-shell, .public-service-body, .mydasma-body, .citizen-page, .city-government) :is(.badge, .status-badge, .notice-card, .alert) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell :is(.panel-header, .bpw-panel-head, .dashboard-panel-header, .detail-grid, .module-grid, .module-grid-pro, .stat-grid, .stats-grid, .form-grid, .button-row, .form-actions, .filter-actions, .actions) > * {
    min-width: 0;
    max-width: 100%;
  }

  html:root body.bims-admin-shell :is(.panel-header, .bpw-panel-head, .dashboard-panel-header, .detail-card, .module-card, .module-card-pro, .notice-card, .alert, .form-grid) :is(h1, h2, h3, h4, p, label, small, strong) {
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell :is(.actions, .filter-actions, .button-row, .form-actions) {
    flex-wrap: wrap !important;
    min-width: 0;
    max-width: 100%;
  }

  html:root body.bims-admin-shell :is(.area-report-tabs, .complaint-view-tabs, .status-tabs, .secretary-task-filters, .resident-review-desk-filters) > :is(a, button) {
    flex-wrap: wrap;
    max-width: 100%;
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell :is(.area-report-tabs, .complaint-view-tabs, .status-tabs, .secretary-task-filters, .resident-review-desk-filters) > :is(a, button) > :is(span, small, b, strong):not(.ico):not(.bpw-icon) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell .bims-page-stack table :is(th, td):not(.row-actions) {
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell table.resident-verification-table .resident-photo-cell > .badge {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100% !important;
    padding-inline: 5px !important;
    line-height: 1.3;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-align: center;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-workflow-page-detail--guidance > strong {
    flex: 0 0 auto;
    white-space: nowrap;
    overflow-wrap: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-workflow-page-detail--guidance > span {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps > li > a {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
  }

  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps .resident-workflow-tab-copy {
    flex: 1 1 150px;
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
    gap: 3px 6px;
  }

  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps .resident-workflow-tab-copy > :is(strong, small),
  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps .resident-workflow-tab-count {
    min-width: 0;
    max-width: 100%;
    line-height: 1.3;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps .resident-workflow-tab-count {
    flex: 0 1 auto;
    flex-wrap: wrap;
  }

  html:root body.bims-pro-shell.bims-admin-shell .resident-three-step-workflow .resident-verification-hub-steps > li > a > .ico {
    flex-shrink: 0;
  }

  html:root body.bims-pro-shell.bims-admin-shell table.resident-verification-table :is(.resident-household-reference, .resident-household-reference-title, .resident-household-reference-title > a, .resident-household-reference-title [data-bims-record-value], .resident-household-reference-meta, .resident-household-reference-meta > small) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-actions-cluster > .resident-row-actions-inner {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 120px), 1fr)) !important;
    min-width: 0;
    max-width: 100%;
    align-items: stretch;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-actions-cluster > .resident-workflow-action > .btn,
  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-actions-cluster > .resident-row-actions-inner > .resident-row-action {
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    padding: 6px 10px !important;
    line-height: 1.3 !important;
    overflow: visible;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-actions-cluster > .resident-row-actions-inner > .resident-row-action > span,
  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-actions-cluster.has-inline-review > .resident-row-actions-inner > .resident-row-action:first-child > span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-actions {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)) !important;
    align-items: stretch;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-actions .btn {
    min-width: 0 !important;
    height: auto !important;
    min-height: var(--bims-system-control) !important;
    padding: 10px 12px !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] :is(.bpw-map-detail-grid > div, .bpw-map-selected-title > div, .bpw-map-meta-list p > *, .bpw-map-status-row > *) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-legend {
    flex-wrap: wrap !important;
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    white-space: normal;
    gap: 7px 12px !important;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-legend > :is(span, b) {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="dashboard.php"] .bpw-map-legend .bpw-map-population-scale {
    flex-wrap: wrap;
  }

  html:root body:is(.auth-page, .citizen-page, .public-service-body, .mydasma-body) :is(.auth-login-form, .auth-recovery-actions, .citizen-access-form-actions, .public-hero-actions, .citizen-information-action-buttons) {
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
  }

  html:root body:is(.auth-page, .citizen-page, .public-service-body, .mydasma-body) :is(.auth-login-form, .auth-recovery-actions, .citizen-access-form-actions, .public-hero-actions) > *,
  html:root body.auth-page :is(.auth-login-intro, .auth-recovery-help, .auth-recovery-note, .field-title) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  html:root body.mydasma-body :is(.mydasma-guest-actions, .mydasma-section-head, .mydasma-top) {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
  }

  html:root body.mydasma-body :is(.mydasma-guest-actions > a, .mydasma-install, .mydasma-form > button, .mydasma-verify button, .mydasma-section-head > a) {
    min-width: 0;
    max-width: 100%;
    height: auto !important;
    min-height: 42px;
    padding-block: 9px;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.3;
  }

  html:root body.mydasma-body :is(.mydasma-guest-actions > a, .mydasma-install, .mydasma-guest-options > a, .mydasma-quick > a, .mydasma-history > a, .mydasma-news > a, .mydasma-auth-card-head, .mydasma-verify) > :is(span, div) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  html:root body.mydasma-body .mydasma-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  html:root body.mydasma-body .mydasma-nav a {
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: center;
  }

  html:root body:is(.city-government, .city-web) :is(.city-button, .city-text-link, .city-record-card__action, .city-record-card__details-toggle, .city-public-forms-link, .city-publication__actions a, .city-publication-actions a) {
    min-width: 0;
    max-width: 100%;
    height: auto;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.3;
    text-align: center;
  }

  html:root body:is(.city-government, .city-web) :is(.city-hero-actions, .city-page-hero__actions, .city-record-card__actions, .city-publication__actions, .city-publication-actions, .city-contact-actions) {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
  }

  html:root body:is(.city-government, .city-web) :is(.city-button, .city-text-link, .city-record-card__action, .city-record-card__details-toggle, .city-public-forms-link) > span:not(.ico):not(.bpw-icon) {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell .bims-update-notice {
    flex-wrap: wrap;
  }

  html:root body.bims-admin-shell .bims-update-notice > * {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  /* Match the earlier route selectors so their intrinsic widths and fixed
     heights cannot clip expanded translations in these padded controls. */
  html:root body.bims-admin-shell[data-bims-guide-route="resident_account_claims.php"] .bims-page-stack > .panel .table-responsive .btn {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions {
    flex-wrap: wrap !important;
    min-width: 0;
    max-width: 100%;
  }

  html:root body.bims-admin-shell[data-bims-guide-route="resident_import.php"] .bims-page-stack > .panel:first-of-type > form.form-grid[enctype="multipart/form-data"] > .form-actions > .btn {
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    padding-block: 7px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow) .resident-tool-group .btn {
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    padding-block: 6px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}


/* The workflow population count is one numeric value, including on a phone. */
html:root body.bims-pro-shell.bims-admin-shell .panel:has(> .resident-three-step-workflow)
  table.resident-verification-table .resident-workflow-group-heading > th > b {
  flex: 0 0 auto;
  width: max-content !important;
  min-width: max-content;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}


/* Keep all four security sections visible inside the panel on narrow screens. */
@media (max-width: 760px) {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="security_dashboard.php"]
    .security-dashboard .security-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 8px !important;
    min-width: 0;
    max-width: 100%;
    overflow: visible !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="security_dashboard.php"]
    .security-dashboard .security-tabs > [role="tab"] {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    height: auto !important;
    max-height: none !important;
    justify-content: center;
    padding: 8px 10px !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-overflow: clip;
    line-height: 1.4 !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="security_dashboard.php"]
    .security-dashboard .security-tabs > [role="tab"] > :is(.ico, svg) { flex: 0 0 auto; }
}
@media (max-width: 480px) {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="security_dashboard.php"]
    .security-dashboard .security-tabs { grid-template-columns: minmax(0, 1fr); }
}


/* Household mobile cards: give validation its own readable value stack and
   let native edit/archive controls reflow within the existing card padding. */
@media screen and (max-width: 760px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) {
    grid-column: 1 / -1;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
    min-width: 0;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6)::before {
    min-width: 0 !important;
    padding-right: 0 !important;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) > br {
    display: none;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) > .badge {
    align-self: flex-start;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) > small {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    flex-wrap: wrap !important;
    white-space: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner .btn {
    box-sizing: border-box;
    flex: 1 1 8rem !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100%;
    min-height: 44px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

@media screen and (max-width: 420px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner .btn {
    flex-basis: 100% !important;
    width: 100% !important;
  }
}

/* The native desktop table also needs a bounded action column: long translated
   buttons must wrap instead of taking the validation column's readable space. */
@media screen and (min-width: 761px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table :is(thead tr > th:nth-child(6), tbody tr.data-row-modal > td:nth-child(6)) {
    width: 20%;
    min-width: 10rem;
    white-space: normal !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) > .badge {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table :is(thead tr > th.actions-col, tbody tr.data-row-modal > td.row-actions) {
    width: 22%;
    white-space: normal !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    flex-wrap: wrap !important;
    white-space: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner > :is(a.btn, form.inline-delete-form) {
    box-sizing: border-box;
    flex: 1 1 4.5rem !important;
    min-width: 0 !important;
    max-width: 100%;
    white-space: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner > form.inline-delete-form {
    display: flex !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner > form.inline-delete-form > .btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

/* Eight household facts need readable room. Retain the familiar household card
   presentation through medium desktop widths; wide screens keep the table. */
@media screen and (min-width: 761px) and (max-width: 1360px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack .table-wrap:has(> table.bims-households-table) {
    overflow: visible;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    border-spacing: 0;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead {
    display: none;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody {
    display: grid;
    gap: 8px;
    padding: 8px;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 12px;
    padding: 9px 12px;
    border: 1px solid #e0eee0;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(6, 54, 35, .04);
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: auto !important;
    min-width: 0 !important;
    gap: 4px;
    padding: 5px 0;
    border: 0;
    font-size: .85rem;
    line-height: 1.3;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td::before {
    content: attr(data-label);
    display: block;
    min-width: 0;
    padding-right: 0;
    color: #718274;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .045em;
    line-height: 1.3;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > :is(td:nth-child(1), td:nth-child(6), td.row-actions) {
    grid-column: 1 / -1;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td > .badge {
    align-self: flex-start;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td:nth-child(6) > br {
    display: none;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions {
    margin-top: 5px;
    padding-top: 8px;
    border-top: 1px solid #edf3ed;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions::before {
    content: none;
    display: none;
  }
}

@media screen {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table .subdivision-chip {
    min-width: 0 !important;
    max-width: 100%;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip;
    overflow-wrap: anywhere;
  }
}

@media screen and (min-width: 1361px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table {
    table-layout: fixed;
    width: 100% !important;
    min-width: 0 !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table :is(th, td) {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(1) { width: 18% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(2) { width: 11% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(3) { width: 6% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(4) { width: 12% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(5) { width: 9% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(6) { width: 19% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(7) { width: 10% !important; }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table thead th:nth-child(8) { width: 15% !important; }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td > .badge {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* Cap every direct household status badge at the cell's padded value width. */
@media screen {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td > .badge {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* Keep icon-enhanced household actions readable at wide-table widths. Each
   action gets the padded cell width; phrases wrap at spaces, never mid-word. */
@media screen and (min-width: 1361px) {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch;
    justify-items: stretch;
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    gap: 6px;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner > :is(a.btn, form.inline-delete-form) {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner > form.inline-delete-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-households-table tbody tr.data-row-modal > td.row-actions > .household-row-actions-inner :is(a.btn, form.inline-delete-form > .btn) {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}

/* Cashier actions keep their complete labels within the padded action cell. */
@media screen {
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-payments-table td.row-actions > .payment-row-actions-inner {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    gap: 6px;
    white-space: normal !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-payments-table .payment-row-actions-inner > form.inline-delete-form {
    display: flex !important;
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    margin: 0 !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-payments-table .payment-row-actions-inner :is(a.btn, button.btn) {
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center;
    flex-wrap: wrap !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 34px;
    margin: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }
  html:root body.bims-pro-shell.bims-admin-shell .bims-page-stack table.bims-payments-table .payment-row-actions-inner .btn > span:not(.ico):not(.bpw-icon) {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

/* Keep the Filipino photo heading whole, including its existing cell padding.
   The four desktop column percentages still total 100; mobile cards stay as-is. */
@media screen and (min-width: 1361px) {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table thead th:nth-child(1),
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table tbody tr.resident-verification-row > td:nth-child(1) { width: 11% !important; }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table thead th:nth-child(2),
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table tbody tr.resident-verification-row > td:nth-child(2) { width: 19% !important; }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table thead th:nth-child(3),
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-session-kind="staff"] .bims-page-stack table.resident-verification-table tbody tr.resident-verification-row > td:nth-child(3) { width: 22% !important; }
}


/* Validation queue: the compact-filter runtime owns the enhanced inner row.
   Keep the unenhanced three-control fallback and all submitted values intact. */
@media screen {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-search {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-actions {
    min-width: 0 !important;
    max-width: 100%;
    flex-wrap: wrap !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] :is(.residency-queue-actions, .residency-queue-action-details, .residency-queue-action-copy) {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] .residency-queue-actions :is(a.btn, summary),
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] .residency-queue-action-copy .btn {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}
@media screen and (max-width: 760px) {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] table.residency-queue-table tbody tr > td:nth-child(n) {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-row {
    flex-wrap: wrap !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-search {
    flex: 1 1 100% !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-actions {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="residency_queue.php"] form.resident-simple-search[data-bims-filter-ready] .bims-filter-actions > .btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* Reserve actual desktop room for cashier actions. Expanded labels may wrap
   at word boundaries; preserving every column may use the existing scroller. */
@media screen and (min-width: 761px) {
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="payments.php"] .table-wrap:has(> table.bims-payments-table) {
    max-width: 100%;
    overflow-x: auto !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="payments.php"] table.bims-payments-table :is(th.actions-col, td.row-actions) {
    box-sizing: border-box;
    width: 180px !important;
    min-width: 180px !important;
    max-width: none !important;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="payments.php"] table.bims-payments-table .payment-row-actions-inner :is(a.btn, button.btn) {
    flex-wrap: nowrap !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none;
  }
  html:root body.bims-pro-shell.bims-admin-shell[data-bims-guide-route="payments.php"] table.bims-payments-table .payment-row-actions-inner .btn > span:not(.ico):not(.bpw-icon) {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none;
  }
}


/* Compact staff summaries, 2026-10-17.
   Summary cards grow with their complete text; forms, maps, detail cards and
   diagnostic health checks retain their existing layout and spacing. */
@media screen {
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid, .stats-grid, .executive-kpi-grid, .area-dashboard-kpis, .trend-summary-grid, .secretary-work-grid) {
    gap: 8px !important;
    margin-bottom: 12px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card),
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) {
    min-width: 0;
    min-height: 76px !important;
    height: auto !important;
    padding: 10px 12px !important;
    gap: 8px !important;
    align-items: center !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid, .stats-grid) > .stat-card.panel::before,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric::before,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article::before {
    content: none !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.secretary-work-today, .trend-report-panel)::before {
    margin-bottom: 10px !important;
  }

  /* Put a count beside its label instead of reserving a separate tall row. */
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > div,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 3px 10px;
    flex: 1 1 0;
    min-width: 0;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card):not(:has(> div)) {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: center;
    gap: 3px 10px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) :is(span, small),
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) :is(span, small) {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > div > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div > strong {
    grid-column: 2;
    grid-row: 1;
    margin: 0 !important;
    font-size: 1.45rem !important;
    line-height: 1.15 !important;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
    flex: 0 1 auto;
    overflow-wrap: break-word;
    word-break: normal;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > div > small,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > small,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div > small {
    grid-column: 1 / -1;
    flex: 1 1 100%;
    margin: 0 !important;
    font-size: .78rem !important;
    line-height: 1.3 !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid, .stats-grid, .executive-kpi-grid, .area-dashboard-kpis) .metric-icon {
    flex: 0 0 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid, .stats-grid) > .stat-card > div > a.btn {
    grid-column: 1 / -1;
    justify-self: start;
    min-height: 44px !important;
    margin-top: 3px;
    white-space: normal !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    align-content: start;
    align-items: center;
    min-height: 88px;
    height: auto;
    padding: 10px 12px;
    gap: 3px 10px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card-heading {
    grid-column: 1;
    min-width: 0;
    align-items: flex-start;
    font-size: .9rem;
    line-height: 1.3;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card > b {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.15;
    flex: 0 1 auto;
    overflow-wrap: break-word;
    word-break: normal;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card > :is(span:not(.secretary-work-card-heading), small) {
    grid-column: 1 / -1;
    flex: 1 1 100%;
    min-width: 0;
    margin: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.3;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > div > span:not(.ico):not(.bpw-icon),
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > span:not(.ico):not(.bpw-icon),
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div > span,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card-heading,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > span,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric > span,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article > span {
    flex: 1 1 min(100%, 12ch);
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > div > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid) > .stat-card:not(.resident-summary-card) > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card > b,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article > strong {
    width: max-content;
    max-width: 100%;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-shortcuts {
    margin-top: 10px;
    padding-top: 10px;
    gap: 8px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.secretary-work-today, .trend-report-panel) {
    padding: 14px 16px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.secretary-work-today, .trend-report-panel) > .panel-header {
    gap: 8px 12px !important;
    margin-bottom: 10px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: center;
    align-items: center;
    gap: 4px 10px;
    min-width: 0;
    min-height: 76px;
    height: auto;
    padding: 10px 12px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > strong {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.15;
    min-width: 0;
    flex: 0 1 auto;
    overflow-wrap: break-word;
    word-break: normal;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > :is(span, small) {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.3;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > small {
    grid-column: 1 / -1;
    flex: 1 1 100%;
    margin: 0;
    font-size: .78rem;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-report-panel > .trend-footnote {
    margin: 8px 0;
    line-height: 1.4;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-report-panel[aria-labelledby="dashboard-finance-title"] > form.filter-bar :is(select[name="period"], button[type="submit"]) {
    min-height: 44px !important;
    height: auto !important;
  }

  /* Compact the period-only filter, without narrowing other filter forms. */
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-report-panel[aria-labelledby="dashboard-finance-title"] > form.filter-bar {
    --bims-filter-control-height: 44px;
    width: fit-content !important;
    min-width: min(100%, 350px) !important;
    max-width: 100% !important;
    margin-bottom: 10px !important;
    padding: 8px 10px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-report-panel[aria-labelledby="dashboard-finance-title"] > form.filter-bar :is(label, .bims-filter-field) {
    flex: 1 1 180px !important;
    min-width: 0 !important;
    max-width: 100%;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.panel > .empty-state, .table-wrap .empty-state) {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 0;
    height: auto;
    gap: 10px;
    padding: 12px 14px;
    text-align: left;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.panel > .empty-state, .table-wrap .empty-state) .empty-state-copy {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.panel > .empty-state, .table-wrap .empty-state) .empty-state-icon {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.complaint-action-grid, .complaint-review-action-grid, .security-metrics, .citywide-alert-metrics, .bims-session-summary-grid) {
    gap: 8px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: center;
    align-items: center;
    min-width: 0;
    min-height: 76px;
    height: auto;
    padding: 10px 12px !important;
    gap: 4px 10px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric > strong,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article > strong {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
    font-size: 1.45rem;
    line-height: 1.15;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .security-metrics > .security-metric > small,
  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .citywide-alert-metrics > article > small {
    grid-column: 1 / -1;
    flex: 1 1 100%;
    margin: 0;
    line-height: 1.3;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .bims-session-summary-card {
    min-width: 0;
    padding: 10px 12px;
    gap: 7px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .panel:has(> .empty-state):not(:has(> form)) {
    padding: 14px 16px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .panel:has(> .empty-state):not(:has(> form)) > .panel-header {
    margin-bottom: 10px !important;
    gap: 8px 12px !important;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .area-empty-state {
    min-height: 0;
    height: auto;
    padding: 10px 12px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .premium-trend-stats {
    padding-block: 10px;
    margin-bottom: 10px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .governance-area-card {
    padding: 10px 12px;
    gap: 4px;
  }

  html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .governance-area-card .governance-counts {
    margin-top: 0;
  }

  @media (max-width: 760px) {
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.secretary-work-today, .trend-report-panel) {
      padding: 12px !important;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-report-panel[aria-labelledby="dashboard-finance-title"] > form.filter-bar {
      width: 100% !important;
      min-width: 0 !important;
    }

    /* Intrinsic card bases let large counts/text use a complete row when needed.
       Ordinary short values still share rows; no hidden or clipped amounts. */
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary), .executive-kpi-grid, .area-dashboard-kpis, .trend-summary-grid, .secretary-work-grid) {
      display: flex !important;
      flex-wrap: wrap;
      align-items: stretch;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary)) > .stat-card:not(.resident-summary-card),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div,
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card {
      box-sizing: border-box;
      flex: 1 1 min-content;
      min-width: min(100%, 9rem);
      max-width: 100%;
      grid-template-columns: minmax(0, 1fr);
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card,
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div,
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary)) > .stat-card:not(.resident-summary-card):not(:has(> div)) {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: stretch !important;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary)) > .stat-card:not(.resident-summary-card) > div,
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: stretch;
      flex-basis: auto;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary)) > .stat-card:not(.resident-summary-card) > :is(span, strong, small),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid:not(.service-request-summary), .stats-grid:not(.resident-master-summary)) > .stat-card:not(.resident-summary-card) > div > :is(span, strong, small),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.executive-kpi-grid, .area-dashboard-kpis) > .metric-card:not(.health-check) > div > :is(span, strong, small),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > :is(span, strong, small),
    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .secretary-work-card > :is(.secretary-work-card-heading, b, span, small) {
      grid-column: 1 / -1;
      grid-row: auto;
      flex: 0 1 auto !important;
      min-width: 0;
      max-width: 100%;
      overflow-wrap: break-word;
      word-break: normal;
      white-space: normal;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) .trend-summary-grid > div > strong {
      font-size: 1.1rem;
    }

    html:root body.bims-admin-shell :is(.bims-page-stack, .modal-frame-main) :is(.stat-grid, .stats-grid, .executive-kpi-grid, .area-dashboard-kpis) .metric-icon {
      flex-basis: 24px !important;
      width: 24px !important;
      min-width: 24px !important;
      height: 24px !important;
    }
  }
}