/* Provider service chooser (static/js/provider-service-chooser.js): the provider
 * "Service type" checkbox group with a category filter, search, a bounded scroll
 * area and rows shown in batches. Colours/radii come from the form's .stripe-inputs
 * tokens (--si-*, static/css/stripe-inputs.css) with neutral fallbacks, so each
 * funnel theme keeps its own accent. Rows keep the theme's own checkbox style. */
.psc { display: block; clear: both; width: 100%; min-width: 0; }
/* Rows carry Tailwind's .flex (display:flex) and field labels get .stripe-inputs'
 * label { display:block !important } (0,2,2) — both beat the [hidden] UA rule. */
.psc [hidden], .psc .psc-row[hidden], .psc .psc-field[hidden] { display: none !important; }

.psc-toolbar { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 0 0 6px; }
.psc .psc-field { display: block; flex: 1 1 200px; min-width: 0; margin: 0; }
.psc .psc-field-search { flex: 2 1 260px; }
.psc .psc-field-label { display: block; }
.psc .psc-category, .psc .psc-search { width: 100%; max-width: 100%; margin: 0; }

.psc-meta { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; margin: 0 0 6px; font-size: 13px; line-height: 1.4; color: var(--si-placeholder, #667085); }
.psc-meta p { margin: 0; }
.psc .psc-count { font-weight: 600; color: var(--si-text, #30313d); }

.psc-scroll { box-sizing: border-box; max-height: min(22rem, 60vh); overflow-y: auto; overscroll-behavior: contain; padding: 4px; border: 1px solid var(--si-border, #d1d5db); border-radius: var(--si-radius, 6px); scrollbar-width: thin; }
.psc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 2px 12px; }
.psc .psc-row { display: flex; align-items: center; gap: 10px; min-width: 0; margin: 0; padding: 0 10px; border-radius: 4px; }
.psc .psc-row:hover { background: rgb(100 116 139 / 8%); }
.psc .psc-row:has(> input:checked) { background: var(--si-ring, rgb(37 99 235 / 14%)); }
.psc .psc-row > input { flex: 0 0 auto; margin: 0; }
.psc .psc-row > input:focus-visible { outline: 2px solid var(--si-accent, #2563eb); outline-offset: 2px; }
/* !important + the extra classes outrank .stripe-inputs' bare-label rule
 * (display:block / margin / padding with !important) for these row labels. */
.psc .psc-row > label.psc-row-label { display: flex !important; align-items: center; flex: 1 1 auto; min-width: 0; min-height: 36px; margin: 0 !important; padding: 6px 0 !important; overflow-wrap: anywhere; cursor: pointer; }

.psc-empty { padding: 20px 12px; text-align: center; }
.psc .psc-empty-text { margin: 0 0 10px; }
.psc .psc-clear, .psc .psc-more { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 6px 16px; border: 1px solid var(--si-accent, #2563eb); border-radius: 999px; background: transparent; color: var(--si-accent, #2563eb); font: 600 14px/1.2 var(--si-font, inherit); cursor: pointer; }
.psc .psc-more { margin-top: 10px; }
.psc .psc-clear:hover, .psc .psc-more:hover { background: var(--si-ring, rgb(37 99 235 / 14%)); }
.psc .psc-clear:focus-visible, .psc .psc-more:focus-visible { outline: 2px solid var(--si-accent, #2563eb); outline-offset: 2px; }

@media (max-width: 575px) {
  .psc .psc-field, .psc .psc-field-search { flex-basis: 100%; }
  .psc .psc-row > label.psc-row-label { min-height: 44px; }
  .psc-scroll { max-height: min(24rem, 55vh); }
  .psc .psc-more { width: 100%; }
}
@media (forced-colors: active) {
  .psc .psc-row:has(> input:checked) { outline: 1px solid CanvasText; }
}