.column-filter-button { margin-left: .4rem; padding: .1rem .35rem; white-space: nowrap; }
.column-filter-button.is-filtered { color: #fff; background: #0d6efd; }
.column-filter-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: .5rem; }
.column-filter-help { max-width: 52rem; }
.column-filter-panel { box-sizing: border-box; border: 1px solid #adb5bd; border-radius: .5rem; padding: 1rem; width: 22rem; max-width: calc(100vw - 2rem); max-height: calc(100dvh - 2rem); overflow: auto; box-shadow: 0 .5rem 2rem #0003; }
.column-filter-panel::backdrop { background: #0003; }
.column-filter-options { max-height: 36vh; overflow: auto; border-block: 1px solid #dee2e6; margin-block: .6rem; padding-block: .4rem; }
.column-filter-option { display: flex; align-items: baseline; gap: .5rem; padding: .2rem; overflow-wrap: anywhere; }
.column-filter-option input { flex-shrink: 0; }
.column-filter-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .6rem; }
table[data-column-filters] thead th { vertical-align: top; }
table[data-column-filters] tr[hidden] { display: none !important; }