th.rotate {
    height: 130px;
    white-space: nowrap;
    position: relative;
    min-width: 80px;
}

th.rotate.detailpage {
    min-width: 50px !important;
    top: 0;
    text-align: left !important;
}

th.rotate.printDetailpage {
    min-width: 40px !important;
    top: 0;
    text-align: left !important;
}

th.rotate > span {
    position: absolute;
    left: 0;
    right: 0;
    top: 10px;
    margin: auto;
    writing-mode: vertical-rl;
    white-space: normal;
    text-orientation: mixed;
}

.table td.critical {
    background: red;
    color: white;
}

/* TODO @csm this is also impacting labels in DataTables like the "global search input" for example */
td input[type="radio"], td input[type="checkbox"], td label, div input[type="radio"], div input[type="checkbox"], div label {
    margin-right: 8px;
}

.separator {
    border-bottom: 1px solid lightgray;
}

.toggle-handle {
    background-color: white !important;
}

.toggle-off.btn-sm {
    padding-left: 15px !important;
}

.overflow-auto-50vh {
    max-height: var(--bs-scroll-height, 50vh);
    overflow-y: auto;
}

.activities-select {
    padding-left: 5px;
}