/* TomSelect */

.ts-dropdown, .ts-control, .ts-control input {
    color: var(--bs-body-color);
}

.ts-wrapper.plugin-remove_button .item .remove {
    color: var(--bs-danger);
}

.plugin-clear_button .clear-button {
    color: var(--bs-danger);
    right: 60px;
}
.ts-dropdown {
    z-index: 1060;
}

.ts-wrapper.multi .ts-control > div.ts-colour {
  cursor: pointer;
  margin: 0 2px 2px 0;
  padding: 1px 2px;
  background: #fff;
  color: #343a40;
}

/* HTMX Indicator */
#tray-indicator {
  pointer-events: none; /* Prevent the indicator to block the hamburger menu in mobile view */
}

/* Table Hover */

.table-hover .row-action {
    opacity: 0;
    transition: opacity 0.15s ease;
}
.table-hover tbody tr:hover .row-action {
    opacity: 1;
}

.border-hover:hover {
    border-color: var(--bs-primary-border-subtle);
}

/* Protocol Listing Navgation Bar */

.navbar-protocol {
    position: sticky;
    overflow-y: auto;
    height: calc(100vh - 200px);
    top: 50px;
}

.grouped-cards-scrollable {
    height: calc(100vh - 200px);
    overflow-y: auto;
    padding-bottom: calc(100vh - 400px);
}

.border-dashed {
    border-style: dashed !important;
}

/* Description Tags */

.label-gray {
    color: #495057;
    background-color: #f1f3f5;
    border-color: #dee2e6;
}

.label-blue {
    color: #084298;
    background-color: #cfe2ff;
    border-color: #9ec5fe;
}

.label-indigo {
    color: #3d0a91;
    background-color: #e0cffc;
    border-color: #c29ffa;
}

.label-purple {
    color: #432874;
    background-color: #e2d9f3;
    border-color: #c5b3e6;
}

.label-pink {
    color: #801f4f;
    background-color: #f7d6e6;
    border-color: #efadce;
}

.label-teal {
    color: #0f5132;
    background-color: #d2f4ea;
    border-color: #a6e9d5;
}

.label-cyan {
    color: #055160;
    background-color: #cff4fc;
    border-color: #9eeaf9;
}

.label-green {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #a3cfbb;
}

.label-amber {
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffda6a;
}

.label-brown {
    color: #5c4033;
    background-color: #eadfd7;
    border-color: #d6c2b6;
}

/* Table Pagination */
/* FIXME: these selectors target the tables pagination */
#table-content > div > nav, #results > div:nth-child(4) > div > nav, body > main > .table-container.table-responsive > nav {
    display: flex;
    justify-content: end;
}

.table-container-fixed-height {
    min-height: 46rem;
    display: flex;
    flex-direction: column;
}

.table-container-fixed-height nav {
    margin-top: auto;
}

.table-container-fixed-height td {
    height: 5rem;
}