/*==========================================
  Table Header Base Styles
==========================================*/
.uk-table th, .ui.table th, .ui.table th a{
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: var(--bb-text-color) !important;
}

.uk-table .uk-table-link > a,.uk-table th{
    color: #000 !important;
}
.uk-table .uk-table-link:hover > a{
    color: var(--bb-accent-color) !important;
}

/*==========================================
  Sortable Header Setup
==========================================*/
/* Establish positioning context and reserve space for sort icons */
th.sort,
th.sort-DESC,
th.sort-ASC {
    position: relative;
}

/* Common styles for the sort icons */
th.sort:after,
th.sort-DESC:after,
th.sort-ASC:after {
    font-family: bootstrap-icons !important;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 0.8em;
}

/* Default sort icon */
th.sort:after {
    color: #888;
}

/* Change icon on hover */
th.sort:hover:after {
    content: "\F286"; /* Hover icon (downward arrow) */
}

/* Descending sort state */
th.sort-DESC:after {
    content: "\F286"; /* Descending arrow */
    color: var(--bb-accent-color);
}

/* Ascending sort state */
th.sort-ASC:after {
    content: "\F282"; /* Ascending arrow */
    color: var(--bb-accent-color);
}