/*#region ====[ Sortable Table Headers ]==== */
.fb-sortable {
  cursor: pointer;
  user-select: none;
  position: relative;
  transition: background-color 200ms ease-in-out;
}

.fb-sortable:hover {
  background-color: rgba(153, 0, 153, 0.1);
}

.fb-sortable i {
  margin-left: 4px;
  opacity: 0.6;
  transition: opacity 200ms ease-in-out;
}

.fb-sortable:hover i {
  opacity: 1;
}

/* Target the currently sorted column by checking if the icon is NOT fa-sort (meaning it's fa-sort-up or fa-sort-down) */
.fb-sortable i.fa-sort-up,
.fb-sortable i.fa-sort-down {
  opacity: 1 !important;
  color: #990099 !important;
}

/* Make sure all sort icons are visible */
.fb-sortable i.fa-sort {
  opacity: 0.6;
}

/* Show sort icons more prominently on hover */
.fb-sortable:hover i.fa-sort {
  opacity: 0.8;
}
/*#endregion*/