/* 0.10.27 — whitelist: even rows, pills, grouped actions, search and filters. */
.whitelist-table-panel .wl-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:4px 0 14px}
.whitelist-table-panel .wl-search{flex:1 1 220px;max-width:340px;min-height:36px;padding:7px 12px;border-radius:10px}
.whitelist-table-panel .wl-filters{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2)}
.whitelist-table-panel .wl-chip{border:0;background:transparent;color:var(--muted);font:inherit;font-size:11px;font-weight:600;padding:6px 12px;border-radius:8px;cursor:pointer}
.whitelist-table-panel .wl-chip:hover{color:var(--text)}
.whitelist-table-panel .wl-chip[aria-pressed="true"]{background:var(--lime-soft);color:var(--lime-strong)}
.whitelist-table-panel .wl-chip:focus-visible{outline:2px solid var(--lime-strong);outline-offset:1px}
.whitelist-table-panel .wl-count{margin-left:auto;color:var(--quiet);font-size:11px;font-variant-numeric:tabular-nums}

.whitelist-table-panel table{table-layout:fixed;border-collapse:separate;border-spacing:0}
.whitelist-table-panel thead th{position:sticky;top:0;z-index:1;background:var(--surface);padding:10px 14px;text-align:left}
.whitelist-table-panel thead th:nth-child(1){width:30%}
.whitelist-table-panel thead th:nth-child(2){width:14%}
.whitelist-table-panel thead th:nth-child(3){width:18%}
.whitelist-table-panel tbody td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:middle;height:58px;box-sizing:border-box}
.whitelist-table-panel tbody tr.wl-row:hover td{background:rgba(175,209,94,.035)}
.whitelist-table-panel tbody tr[data-banned="true"] td{background:rgba(232,111,104,.035)}
/* The old .table-actions made the cell display:flex and broke the row lines. */
.whitelist-table-panel td.wl-actions-cell{display:table-cell}

.wl-who{display:table-cell}
.wl-who>*{vertical-align:middle}
.wl-avatar{display:inline-grid;place-items:center;width:32px;height:32px;margin-right:10px;border-radius:50%;background:var(--surface-3);border:1px solid var(--line-strong);color:var(--lime-strong);font-weight:700;font-size:13px}
.wl-names{display:inline-flex;flex-direction:column;gap:2px;max-width:calc(100% - 46px);overflow:hidden}
.wl-names strong{color:var(--text);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-names small{color:var(--quiet);font-size:11px;display:flex;align-items:center;gap:6px}
.wl-online{display:inline-flex;align-items:center;gap:4px;color:var(--lime);font-size:10px;font-weight:600}
.wl-online::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(175,209,94,.15)}

.wl-pill{display:inline-block;padding:3px 9px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.03em;border:1px solid var(--line-strong);color:var(--muted);background:var(--surface-2)}
.wl-pill-staff{color:#c9b6ea;border-color:rgba(163,136,207,.45);background:rgba(163,136,207,.12)}
.wl-pill-ok{color:var(--quiet)}
.wl-pill-ban{color:#ffb1ab;border-color:rgba(232,111,104,.5);background:var(--red-soft)}
.wl-pill-temp{color:#f2c98a;border-color:rgba(229,169,77,.5);background:rgba(229,169,77,.12)}
.wl-ban-until{display:block;margin-top:4px;color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums}

.wl-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.wl-actions .wl-rank,.wl-actions .wl-mod{display:inline-flex;align-items:center;gap:6px}
.wl-actions .wl-rank{padding-right:10px;border-right:1px solid var(--line)}
.wl-actions .access-level-select{width:auto;min-width:108px;min-height:30px;padding:4px 8px;font-size:11px;border-radius:8px}
.wl-actions .button.tiny{min-height:30px;border-radius:8px}
.wl-actions .wl-remove{margin-left:auto}

@media (max-width:900px){
  .whitelist-table-panel table,.whitelist-table-panel tbody,.whitelist-table-panel tr,.whitelist-table-panel td{display:block;width:100%}
  .whitelist-table-panel thead{display:none}
  .whitelist-table-panel tbody tr.wl-row{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:6px 4px}
  .whitelist-table-panel tbody td{border:0;height:auto;padding:6px 12px}
  .whitelist-table-panel td.wl-actions-cell{display:block}
  .wl-actions .wl-remove{margin-left:0}
  .whitelist-table-panel .wl-count{margin-left:0}
}
