/* Shared candidate-style filtering across the service. */
.service-filters {
    display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px;
    padding: 14px 16px; background: #f5f8fc; border-color: #dce6f4;
    box-shadow: inset 0 2px 4px rgb(35 53 78 / 8%), inset 0 -1px 0 #ffffffcc;
}
.service-filters label.service-filter-field {
    --filter-tone: #376caf; display: flex; flex-direction: column; gap: 4px;
    flex: 1 1 150px; min-width: 0; margin: 0; font-size: 11px; color: var(--filter-tone);
}
.service-filters label.service-filter-field:nth-child(3n+2) { --filter-tone: #8061a3; }
.service-filters label.service-filter-field:nth-child(3n) { --filter-tone: #398476; }
.service-filters label.service-filter-field > span { font-size: 11px; font-weight: 600; color: var(--filter-tone); margin: 0; }
.service-filters input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
.service-filters select {
    height: 32px; min-height: 32px; min-width: 0; width: 100%; padding: 5px 8px;
    border: 1px solid #d7e1ed; border-radius: 5px; background: #fff; color: #30445d;
    font-size: 12px; box-shadow: inset 0 1px 2px rgb(35 53 78 / 7%);
    transition: border-color .16s, background .16s, box-shadow .16s;
}
.service-filters input:hover, .service-filters select:hover { border-color: #9ab1ce; }
.service-filters input:focus, .service-filters select:focus { outline: 2px solid #9fdbd3; outline-offset: 1px; }
.service-filters [data-filter-active=true]:not([type=checkbox]):not([type=radio]) {
    background: #e8f6f4; border-color: #48b9aa; box-shadow: inset 3px 0 #9fdbd3;
}
.service-filters label.service-filter-toggle {
    display: flex; flex-direction: row; flex: 0 1 auto; align-items: center; gap: 6px;
    min-height: 32px; font-size: 12px; color: #5c718c;
}
.service-filters label.service-filter-toggle:has(input:checked) { color: #307e74; }
.service-filters input[type=checkbox], .service-filters input[type=radio] { width: 15px; min-width: 15px; height: 15px; margin: 0; accent-color: #358c80; }
.service-filters button, .service-filters .button { min-height: 32px; font-size: 12px; }
.service-filters > .muted { flex-basis: 100%; font-size: 11px; color: #8191a6; }
.analytics-page .analytics-filter-grid.service-filters { display: grid; padding: 0; background: none; box-shadow: none; }
.service-admin #changelist-search.service-filters { display: flex; padding: 12px 16px; }
.service-admin #changelist-search.service-filters .service-filter-field { flex: 1 1 240px; }
.service-admin #changelist-search.service-filters > .visually-hidden { position: absolute; }
.admin-filters .panel-title { background: #eef5ff; color: #376caf; }
.admin-filters details { margin: 10px; padding: 10px; background: #f2f7ff; border: 1px solid #dce6f4; border-radius: 6px; box-shadow: inset 0 2px 4px #23354e0c; }
.admin-filters details:nth-of-type(3n+2) { background: #f7f3fc; border-color: #e6ddf3; }
.admin-filters details:nth-of-type(3n) { background: #f0f8f5; border-color: #d4e9e1; }
.admin-filters summary { color: #376caf; cursor: pointer; font-size: 12px; }
.admin-filters li.selected { background: #e2f4f1; border-radius: 4px; }
.admin-filters li.selected a { color: #2c756b; }
@media(max-width:700px) {
    .service-filters { gap: 8px; padding: 12px; }
    .service-filters label.service-filter-field { flex-basis: calc(50% - 8px); }
    .calendar-filter.service-filters { width: 100%; }
}
@media(prefers-reduced-motion:reduce) { .service-filters input, .service-filters select { transition: none; } }