.why-table-scroll {
  display: contents;
}

.why-table-scroll > table { margin-bottom: 0; width: 100%; border-collapse: collapse; }

.why-table-scroll thead th.why-sortable { cursor: pointer; user-select: none; white-space: nowrap; }

.why-sort-ind {
  display: inline-block;
  margin-left: 6px;
  font-size: 0.72em;
  line-height: 1;
  opacity: 0.45;
  transform: translateY(-1px);
}
.why-table-scroll thead th.why-sort-asc .why-sort-ind::after { content: "\25B2"; opacity: 1; }
.why-table-scroll thead th.why-sort-desc .why-sort-ind::after { content: "\25BC"; opacity: 1; }
.why-table-scroll thead th.why-sortable:not(.why-sort-asc):not(.why-sort-desc) .why-sort-ind::after { content: "\2195"; }

@media (max-width: 768px) {
  .why-table-scroll {
    display: block;
    position: relative;
    max-height: var(--why-table-maxh, 460px);
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-panel, #121820);
  }
  .why-table-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--bg-panel-light, #1a222d) !important;
    color: var(--text-main, #e6ebf2) !important;
    box-shadow: inset 0 -1px 0 var(--border-light, rgba(255, 255, 255, 0.10));
    vertical-align: middle;
  }
  .why-table-scroll thead th.why-sortable:hover { background: var(--bg-panel, #121820) !important; }
  .why-table-scroll tbody tr:nth-child(even) {
    background: color-mix(in srgb, var(--bg-panel-light) 35%, transparent);
  }
}