/* Sortable table headers. Pairs with wwwroot/js/table-sort.js. */
th.ts-sortable {
    cursor: pointer;
    user-select: none;
}

th.ts-sortable:hover,
th.ts-sortable:focus-visible {
    color: #0f766e;
}

th.ts-sortable:focus-visible {
    outline: 2px solid #14b8a6;
    outline-offset: -2px;
}

/* Up/down arrows drawn with borders so they do not depend on an icon font being loaded. */
.ts-icon {
    display: inline-block;
    position: relative;
    width: .6em;
    height: 1em;
    margin-left: .4em;
    vertical-align: -.15em;
}

.ts-icon::before,
.ts-icon::after {
    content: "";
    position: absolute;
    left: 0;
    border-left: .3em solid transparent;
    border-right: .3em solid transparent;
    opacity: .3;
}

.ts-icon::before {
    top: .1em;
    border-bottom: .35em solid currentColor;
}

.ts-icon::after {
    bottom: .1em;
    border-top: .35em solid currentColor;
}

th[aria-sort="ascending"] .ts-icon::before,
th[aria-sort="descending"] .ts-icon::after {
    opacity: 1;
    color: #0f766e;
}

@media print {
    .ts-icon {
        display: none;
    }
}
