/* Preloader */
body.loading {
    background-color: #4b43e4;
    visibility: visible !important;
}

#preloader {
    background-color: #4b43e4 !important;
}

/* Content */
.content-page {
    padding-top: 60px;
    padding-bottom: 60px;
}

/* Chat-Board */
.conversation-list .ctext-wrap-custom {
    background: var(--ct-chat-secondary-user-bg);
    border-radius: 3px;
    display: inline-block;
    padding: 12px;
    position: relative;
    i {
        display: block;
        font-size: 12px;
        font-style: normal;
        font-weight: bold;
        position: relative;
    }

    p {
        margin: 0;
        padding-top: 3px;
    }
}

    .conversation-list .conversation-text {
        white-space: pre-line;
        text-align: left;
    }
        .conversation-list .conversation-text li {
            margin-top: 2px !important;
            margin-bottom: 2px !important;
        }

.chat_body {
    height: 550px;
    overflow-y: auto;
}

.board_body {
    height: 640px;
    overflow-y: auto;
}

.chat_input:focus {
    background-color: var(--ct-input-bg);
}


/* Dropzone */
.dz-preview {
    display: block !important;
    margin-left: 0px;
    margin-right: 0px;
}
.dz-preview .dz-image {
    width: 100% !important;
}

/* Dragula */
.tasks #clustering_button,
.tasks .btn-group, .tasks .btn-group .btn {
    font-size: 0.75rem;
}

.tasks.uploaded_files_task {
    width: 18rem;
}

.tasks:not(.uploaded_files_task) {
    width: 20rem;
}

.tasks .card-body {
    font-size: 0.7rem;
}

.no-content::before {
    content: none !important;
}

.text_ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}

.disabled_content {
    opacity: 0.6;
    filter: grayscale(100%);
    pointer-events: none;
}
.blurred_content {
    filter: blur(3px);
    pointer-events: none;
}

/* Rangeslider */
.irs--flat {
    width: 100% !important;
}

.simplebar-content .dropdown.bootstrap-select {
    width: 232px !important;
}


/* Handsontable */
.handsontable {
    font-size: 13px;
    font-weight: var(--ct-body-font-weight);
    font-family: var(--ct-body-font-family);
    background-color: var(--ct-table-bg);
    color: var(--ct-pagination-color);
}

.handsontable .normal_cell {
    background: var(--ct-input-bg) !important;
    color: var(--ct-pagination-color) !important;
}

.handsontable .edited_cell {
    background: #ffff00 !important;
}

.handsontable .invalid_cell {
    background: rgba(250, 92, 124, 0.18) !important;
    color: #ee5776 !important;
}

.handsontable .warning_cell {
    background-color: rgba(255, 188, 0, 0.18);
    color: #f2b300 !important;
}

.handsontable .formula_cell {
    background: #add8e6 !important;
}

.handsontable THEAD TH.editable_column {
    background: #79bd8f;
    border-color: #549a6b;
}

.handsontable span.colHeader.columnSorting:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.handsontable .htUIInput.htUIButtonOK input {
    background-color: var(--ct-link-hover-color);
    border-color: var(--ct-link-color);
}

.handsontable .htUIInput.htUIButtonOK input:hover {
    background-color: var(--ct-link-color);
}

.handsontable td {
    position: relative;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 20px;
}

.handsontable td.htAutocomplete {
    overflow: hidden;
}

.handsontable .htAutocompleteArrow {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    cursor: default;
    width: 16px;
    text-align: center;
    color: var(--ct-popover-arrow-outer-color);
}

/* 
Comment out because issues with row displaying strangely
.handsontable td.highlight.current {
    white-space: normal;
    text-overflow: initial;
} */

.simplebar-content .dropdown.bootstrap-select {
    width: 232px !important;
}

.handsontable tr {
    background: var(--ct-input-bg);
}

/* Single select dropdowns */
.handsontable .handsontableInput {
    background-color: var(--ct-input-focus-bg);
    color: var(--ct-pagination-color);
}

.handsontable.listbox .ht_master table {
    background-color: var(--ct-dropdown-bg);
    color: var(--ct-dropdown-color);
}

.handsontable.listbox .ht_master table tr td.listbox.htDimmed {
    /* border-color: var(--ct-dropdown-divider-bg); */
    border: none;
}

.handsontable.listbox .ht_master table tr td.current,
.handsontable.listbox tr:hover td {
    background-color: var(--ct-dropdown-link-active-bg);
    color: var(--ct-dropdown-link-active-color);
}

/* Multi select dropdowns */
.chosen-container-multi,
.chosen-container-multi .chosen-choices,
.chosen-container-multi .chosen-choices .chosen-results {
    background: var(--ct-dropdown-bg) !important;
    color: var(--ct-dropdown-color);
    border: none;
}

.chosen-container .chosen-results li.highlighted {
    background: var(--primary-color-transparent);
    color: var(--ct-link-color);
}

.chosen-container-multi .chosen-choices li.search-choice {
    border: 1px solid var(--ct-dropdown-divider-bg);
    background: var(--ct-component-active-bg);
    color: var(--ct-component-active-color);
}

.search-choice .search-choice-close {
    color: var(--ct-component-active-color);
}


/* All headers */
body[data-layout-color=dark] .handsontable th {
    background-color: var(--ct-table-striped-bg);
    color: var(--ct-pagination-color);
}

/* Row headers */
body[data-layout-color=dark] .ht_clone_left th {
    background-color: var(--ct-table-striped-bg);
    color: var(--ct-pagination-color);
}

/* Column headers */
body[data-layout-color=dark] .ht_clone_top th {
    background-color: var(--ct-table-striped-bg);
    color: var(--ct-pagination-color);
}

/* Row headers */
body[data-layout-color=dark] .ht_clone_top_left_corner th {
    border-bottom: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .ht_clone_left th {
    border-right: 1px solid var(--ct-table-border-color);
    border-left: 1px solid var(--ct-table-border-color);
}

/* Column headers */
body[data-layout-color=dark] .ht_clone_top th {
    border-top: 1px solid var(--ct-table-border-color);
    border-right: 1px solid var(--ct-table-border-color);
    border-bottom: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .ht_clone_top_left_corner th {
    border-right: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .handsontable .changeType {
    background: inherit;
    border-color: var(--ct-table-border-color);
}

/* Borders */
body[data-layout-color=dark] .handsontable th,
body[data-layout-color=dark] .handsontable td {
    border-right: 1px solid var(--ct-table-border-color);
    border-bottom: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .handsontable tr:first-child td,
body[data-layout-color=dark] .handsontable tr:first-child th {
    border-top: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .ht_master tr>td {
    border-bottom: 1px solid var(--ct-table-border-color);
}

/* Right */
body[data-layout-color=dark] .ht_master tr>td {
    border-right: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .handsontable .htNoFrame+td,
body[data-layout-color=dark] .handsontable .htNoFrame+th,
body[data-layout-color=dark] .handsontable.htRowHeaders thead tr th:nth-child(2),
body[data-layout-color=dark] .handsontable td:first-of-type,
body[data-layout-color=dark] .handsontable th:first-child,
body[data-layout-color=dark] .handsontable th:nth-child(2) {
    border-left: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .ht_clone_top_left_corner thead tr th:nth-last-child(2) {
    border-right: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .handsontable th:last-child {
    border-right: 1px solid var(--ct-table-border-color);
    border-bottom: 1px solid var(--ct-table-border-color);
}

body[data-layout-color=dark] .handsontable table.htCore {
    border-collapse: collapse;
}

/* Cell */
.handsontable tr>td {
    background: var(--ct-input-bg);
}

/* Selected cell */
.handsontable tr>td.current {
    background: var(--ct-table-active-bg);
}

.handsontable tr>td.current:not(.htDimmed) {
    color: var(--ct-dropdown-link-active-color) !important;
}

.handsontable .htDimmed {
    color: var(--ct-text-muted);
}

/* Context menu */
.htContextMenu tr,
.htDropdownMenu tr,
.htFiltersConditionsMenu tr {
    background-color: var(--ct-pagination-bg);
}

.htContextMenu table tbody tr td,
.htDropdownMenu table tbody tr td,
.htFiltersConditionsMenu table tbody tr td {
    background-color: var(--ct-pagination-bg);
}

.htContextMenu table tbody tr td.current,
.htContextMenu table tbody tr td.zeroclipboard-is-hover,
.htDropdownMenu table tbody tr td.current,
.htDropdownMenu table tbody tr td.zeroclipboard-is-hover,
.htFiltersConditionsMenu table tbody tr td.current,
.htFiltersConditionsMenu table tbody tr td.zeroclipboard-is-hover {
    background-color: var(--ct-pagination-hover-bg);
}


.htContextMenu .handsontable table td.htCustomMenuRenderer,
.htDropdownMenu .handsontable table td.htCustomMenuRenderer {
    background-color: var(--ct-pagination-bg);
}

.handsontable .htUISelectCaption .handsontable .htUISelectCaption:hover {
    background-color: var(--ct-pagination-bg);
}

/* Scroll bar */
.handsontable ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.handsontable ::-webkit-scrollbar-track {
    background: var(--ct-pagination-bg);
}

.handsontable ::-webkit-scrollbar-thumb {
    background: var(--ct-accordion-color);
}

.handsontable ::-webkit-scrollbar-thumb:hover {
    background: var(--ct-accordion-color);
}


/* Tokenfields */
.tokenfield {
    border-radius: 0 !important;
    padding-bottom: 0 !important;
}

.tokenfield.focus {
    box-shadow: 2px solid var(--ct-border-color) !important;
    border: 2px solid var(--ct-border-color) !important;
}

.tokenfield .ui-autocomplete-input {
    color: var(--ct-dropdown-link-hover-color);
}

.tokenfield .token {
    color: var(--ct-input-plaintext-color);
}


/* Amcharts */

.amcharts_container {
    height: 100% !important;
}

g g[opacity][style][aria-labelledby][transform][filter] {
    display: none !important;
}

/* Color indicators */
ul.color_list {
    margin: 0;
}

.input-color {
    position: relative;
}

.input-color span {
    padding-left: 20px;
}

.input-color .color-box {
    width: 10px;
    height: 10px;
    display: inline-block;
    background-color: #ccc;
    position: absolute;
    left: 5px;
    top: 5px;
}


/* Datatables */

.dataTables_filter {
    float: right !important;
}

table.dataTable {
    border-spacing: 0;
    color: var(--ct-table-color);
    background-color: var(--ct-table-bg);
    z-index: 9999;
}

table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after {
    display: none;
}

table.dataTable>tbody>tr>td,
table.dataTable>tbody>tr>th,
table.dataTable>tfoot>tr>td,
table.dataTable>tfoot>tr>th,
table.dataTable>thead>tr>td,
table.dataTable>thead>tr>th {
    border: none;
    padding: 5px;
    text-wrap: wrap;
}

table.dataTable.nowrap th,
table.dataTable.nowrap td {
    white-space: normal !important;
}

table.dataTable thead tr {
    background: var(--ct-table-striped-bg);
}

table.dataTable>thead>tr>th,
table.dataTable>tbody>tr>td {
    border: 1px solid var(--ct-table-border-color);
}

table.dataTable>tfoot>tr>th {
    border-top: 1px solid var(--ct-table-border-color);
}

table.dataTable>tbody>tr>:first-child td {
    border-top: none;
}

table.dataTable>tbody>tr>td:first-child {
    border-left: none;
}

table.dataTable>tbody>tr>td:last-child {
    border-right: none;
}


table.dataTable>tfoot>tr>th:last-child {
    border-right: none !important;
}

.table_read_tbody input[type="text"] {
    width: 70px;
}

.table_read_tbody select {
    min-width: 100px;
}

.table.table-bordered th {
    white-space: nowrap;
    overflow: hidden;
}

div.dataTables_wrapper div.dataTables_filter input {
    width: 150px !important;
}


/* Printing */
@page {
    size: auto;
    margin: 20mm 20mm 20mm 20mm;
}
@media print {
    .pagebreak {
        page-break-before: always;
    }
}