.portal-filters {
    min-width: 0;
    margin-bottom: 20px;
    padding: 14px 20px;
    border: 1px solid var(--portal-border);
    border-radius: 10px;
    background: var(--portal-surface);
    color: var(--portal-ink);
}
.portal-filters > summary {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    list-style: none;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: var(--portal-ink);
}
.portal-filters > summary::-webkit-details-marker { display: none; }
.portal-filters > summary::after {
    content: "+";
    margin-left: auto;
    font-size: 22px;
    font-weight: 400;
    color: var(--portal-muted);
}
.portal-filters[open] > summary::after { content: "−"; }
.portal-filters > summary .ui-icon { width: 20px; height: 20px; flex-shrink: 0; }
.portal-filters > summary:focus-visible { outline: 3px solid var(--portal-blue); outline-offset: 3px; border-radius: 4px; }
.portal-filter-body { min-width: 0; padding-top: 16px; }
.portal-filter-body .table-toolbar { padding: 0; flex-wrap: wrap; gap: 16px; border-bottom: 0; }
.portal-filter-body .table-toolbar > label { flex: 1 1 200px; min-width: 0; }
.portal-filter-body :is(input, select, .search-field, .search-select) { min-width: 0; max-width: 100%; }
.portal-filter-body :is(.notification-filters, .instructions-admin-filters) { margin: 0; padding: 0; border: 0; border-radius: 0; }
.portal-filter-body .field-help { margin: 12px 0 0; }
.portal-filter-body .filter-local-refinement { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--portal-border); }
.data-surface > .portal-filters ~ .field-help {
    margin: 8px 20px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}
.data-surface > .portal-filters ~ .field-help + .table-scroll { margin-top: 16px; }
.filter-settings > p { max-width: 780px; color: var(--portal-muted); line-height: 1.6; }
.filter-preferences { display: grid; gap: 20px; }
.filter-preferences fieldset { min-width: 0; margin: 0; padding: 16px; border: 1px solid var(--portal-border); border-radius: 10px; }
.filter-preferences legend { padding: 0 6px; color: var(--portal-ink); font-size: 15px; font-weight: 600; }
.filter-preference-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.filter-preference-option { display: flex; align-items: flex-start; gap: 12px; min-width: 0; margin: 0; padding: 12px; border-radius: 8px; background: var(--portal-background); cursor: pointer; }
.filter-preference-option input[type="checkbox"] { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; margin: 2px 0 0; accent-color: var(--portal-blue); }
.filter-preference-option > span { display: grid; min-width: 0; gap: 5px; }
.filter-preference-option strong { font-size: 14px; color: var(--portal-ink); }
.filter-preference-option small { font-size: 12px; line-height: 1.5; color: var(--portal-muted); overflow-wrap: anywhere; }
:root[data-theme="dark"] .portal-filters > summary .ui-icon { filter: brightness(0) invert(1); }
.api-explorer .swagger-ui .portal-filters .filter-container { margin: 0; padding: 0; }
.api-explorer .swagger-ui .portal-filter-body label { display: block; color: var(--portal-ink); font-size: 14px; }
.api-explorer .swagger-ui .portal-filter-body input { width: 100%; margin-top: 8px; background: var(--portal-surface); color: var(--portal-ink); }
@media (max-width: 600px) {
    .portal-filters { padding: 12px 14px; }
    .data-surface > .portal-filters ~ .field-help { margin-inline: 14px; }
    .portal-filter-body .table-toolbar > label { flex-basis: 100%; }
    .portal-filter-body .table-toolbar > :is(button, a) { width: 100%; justify-content: center; }
    .portal-filter-body :is(input:not([type="checkbox"]), select) { font-size: 16px; }
    .filter-preference-options { grid-template-columns: 1fr; }
    .filter-preferences fieldset { padding: 12px; }
}
