/* SecureBand: one shared look for EVERY filter / sort control (Admin + Organizer)
   Markup:
   <label class="sb-filter"><i class="fa-solid fa-tags sb-filter-icon"></i><span class="sb-filter-label">Event Type:</span><select>...</select></label> */
.sb-filter { display: inline-flex; align-items: center; gap: .5rem; font-size: .75rem; line-height: 1rem; white-space: nowrap; }
.sb-filter-icon { color: #4b5563; }
.sb-filter-label { font-weight: 700; color: #4b5563; }
.sb-filter select { background-color: #f9fafb; border: 1px solid #d1d5db; border-radius: .5rem; padding: .375rem .75rem; font-size: .75rem; line-height: 1rem; font-weight: 600; color: #374151; cursor: pointer; max-width: 16rem; outline: 0; transition: border-color .15s, box-shadow .15s; }
.sb-filter select:hover { border-color: #9ca3af; }
.sb-filter select:focus { border-color: #3b82f6; box-shadow: 0 0 0 1px #3b82f6; }
.sb-filter input[type=checkbox] { cursor: pointer; }
.sb-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.sb-filter.hidden { display: none !important; }

html.sb-dark .sb-filter-icon, html.sb-dark .sb-filter-label { color: #cbd5e1; }
html.sb-dark .sb-filter select { background-color: #151f31; border-color: #2f3e57; color: #e2e8f0; }
html.sb-dark .sb-filter select:hover { border-color: #475a7a; }
html.sb-dark .sb-filter select:focus { border-color: #60a5fa; box-shadow: 0 0 0 1px #60a5fa; }
