/* Default (light) theme */
.ct-theme-default {
    --ct-border-color: #f5f5f5;
    --ct-border-radius: .25em;
    --ct-active-color: #00a6f4;
    --ct-bg-color: #fff;
    --ct-header-bg-color: #f5f5f5;
    --ct-header-text-color: #333;
    --ct-text-color: #333;
    --ct-row-hover: #fbfbfb;
    --ct-row-even-bg-color: #fff;
    --ct-box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
    --ct-arrow: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.70711 9.71069C5.31658 10.1012 5.31658 10.7344 5.70711 11.1249L10.5993 16.0123C11.3805 16.7927 12.6463 16.7924 13.4271 16.0117L18.3174 11.1213C18.708 10.7308 18.708 10.0976 18.3174 9.70708C17.9269 9.31655 17.2937 9.31655 16.9032 9.70708L12.7176 13.8927C12.3271 14.2833 11.6939 14.2832 11.3034 13.8927L7.12132 9.71069C6.7308 9.32016 6.09763 9.32016 5.70711 9.71069Z' fill='%23333'/%3E%3C/svg%3E");
}

/* Dark theme */
.ct-theme-dark {
    --ct-border-color: #262626;
    --ct-border-radius: .25em;
    --ct-active-color: #00a6f4;
    --ct-bg-color: #1a1a1a;
    --ct-header-bg-color: #2a2a2a;
    --ct-header-text-color: #c5c5c5;
    --ct-text-color: #c5c5c5;
    --ct-row-hover: #1e1e1e;
    --ct-row-even-bg-color: #1a1a1a;
    --ct-box-shadow: rgba(3, 3, 3, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
    --ct-arrow: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.70711 9.71069C5.31658 10.1012 5.31658 10.7344 5.70711 11.1249L10.5993 16.0123C11.3805 16.7927 12.6463 16.7924 13.4271 16.0117L18.3174 11.1213C18.708 10.7308 18.708 10.0976 18.3174 9.70708C17.9269 9.31655 17.2937 9.31655 16.9032 9.70708L12.7176 13.8927C12.3271 14.2833 11.6939 14.2832 11.3034 13.8927L7.12132 9.71069C6.7308 9.32016 6.09763 9.32016 5.70711 9.71069Z' fill='%23c5c5c5'/%3E%3C/svg%3E");
}

/* Dark Plus theme */
.ct-theme-dark-plus {
    --ct-border-color: #161616;
    --ct-border-radius: .25em;
    --ct-active-color: #00a6f4;
    --ct-bg-color: #0c0c0c;
    --ct-header-bg-color: #000000;
    --ct-header-text-color: #c5c5c5;
    --ct-text-color: #c5c5c5;
    --ct-row-hover: #0a0a0a;
    --ct-row-even-bg-color: #0c0c0c;
    --ct-box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 20px -20px;
    --ct-arrow: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.70711 9.71069C5.31658 10.1012 5.31658 10.7344 5.70711 11.1249L10.5993 16.0123C11.3805 16.7927 12.6463 16.7924 13.4271 16.0117L18.3174 11.1213C18.708 10.7308 18.708 10.0976 18.3174 9.70708C17.9269 9.31655 17.2937 9.31655 16.9032 9.70708L12.7176 13.8927C12.3271 14.2833 11.6939 14.2832 11.3034 13.8927L7.12132 9.71069C6.7308 9.32016 6.09763 9.32016 5.70711 9.71069Z' fill='%23c5c5c5'/%3E%3C/svg%3E");
}

/* Spirit theme */
.ct-theme-spirit {
    --ct-border-color: #f1f1f1;
    --ct-border-radius: 0;
    --ct-active-color: #000;
    --ct-bg-color: #fff;
    --ct-header-bg-color: #f1f1f1;
    --ct-header-text-color: #333;
    --ct-text-color: #333;
    --ct-row-hover: #fbfbfb;
    --ct-row-even-bg-color: #fff;
    --ct-box-shadow: rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px;
    --ct-arrow: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.70711 9.71069C5.31658 10.1012 5.31658 10.7344 5.70711 11.1249L10.5993 16.0123C11.3805 16.7927 12.6463 16.7924 13.4271 16.0117L18.3174 11.1213C18.708 10.7308 18.708 10.0976 18.3174 9.70708C17.9269 9.31655 17.2937 9.31655 16.9032 9.70708L12.7176 13.8927C12.3271 14.2833 11.6939 14.2832 11.3034 13.8927L7.12132 9.71069C6.7308 9.32016 6.09763 9.32016 5.70711 9.71069Z' fill='%23333'/%3E%3C/svg%3E");
}

/* Paper theme */
.ct-theme-paper {
    --ct-border-color: #efe5d6;
    --ct-border-radius: 0;
    --ct-active-color: #b18e52;
    --ct-bg-color: #faf6f0;
    --ct-header-bg-color: #f3ecdf;
    --ct-header-text-color: #604921;
    --ct-text-color: #604921;
    --ct-row-hover: #f9f2e6;
    --ct-row-even-bg-color: #faf6f0;
    --ct-box-shadow: rgb(120 83 30 / 20%) 2px 5px 5px;
    --ct-arrow: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.70711 9.71069C5.31658 10.1012 5.31658 10.7344 5.70711 11.1249L10.5993 16.0123C11.3805 16.7927 12.6463 16.7924 13.4271 16.0117L18.3174 11.1213C18.708 10.7308 18.708 10.0976 18.3174 9.70708C17.9269 9.31655 17.2937 9.31655 16.9032 9.70708L12.7176 13.8927C12.3271 14.2833 11.6939 14.2832 11.3034 13.8927L7.12132 9.71069C6.7308 9.32016 6.09763 9.32016 5.70711 9.71069Z' fill='%23896e44'/%3E%3C/svg%3E");
}

.cloudtable-container {
    font-size: initial;
    margin-bottom: 1em;
    border-radius: var(--ct-border-radius);
    box-shadow: var(--ct-box-shadow);
}

.cloudtable {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

.cloudtable::-webkit-scrollbar {
    width: .55em;
    height: .55em;
}

.cloudtable::-webkit-scrollbar-corner {
    background: var(--ct-bg-color);
}

.cloudtable::-webkit-scrollbar-track {
    background: var(--ct-bg-color);
}

.cloudtable::-webkit-scrollbar-thumb {
    background-color: var(--ct-active-color);
    border-radius: 0;
}

.static-table .cloudtable {
    border-radius: inherit;
}

.cloudtable-header {
    display: flex;
    justify-content: space-between;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

.cloudtable-header>input.cloudtable-search {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    color: var(--ct-header-text-color);
    background-color: var(--ct-bg-color);
    border: none;
    width: 100%;
    padding: .65rem .9rem;
    line-height: 1.5;
    font-size: 1em;
    margin: 0;
}

.cloudtable-header>input.cloudtable-search::placeholder {
    color: var(--ct-text-color);
}

.cloudtable-header>input.cloudtable-search:focus {
    color: var(--ct-header-text-color);
    background-color: var(--ct-bg-color);
    outline: none;
    box-shadow: none;
}

.cloudtable>table {
    width: 100%;
    border-width: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    margin-bottom: 0 !important;
}

.cloudtable>table>thead {
    color: var(--ct-header-text-color);
    background-color: var(--ct-header-bg-color);
}

.cloudtable>table td,
.cloudtable>table th {
    border-color: var(--ct-border-color);
    border-width: 0 0 1px 0;
    border-style: solid;
    padding: .5em .75em;
    font-size: inherit;
    text-align: left;
}

.cloudtable>table>tbody>tr:nth-child(even) {
    background-color: var(--ct-row-even-bg-color);
}

.cloudtable>table>tbody>tr:hover {
    background-color: var(--ct-row-hover);
}

.cloudtable>table th {
    font-weight: 600;
}

.cloudtable>table td {
    color: var(--ct-text-color);
}

.cloudtable-footer {
    display: flex;
    justify-content: end;
    align-items: center;
    background-color: var(--ct-bg-color);
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}

.cloudtable-footer>select.cloudtable-perpage {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: var(--ct-text-color);
    background-color: var(--ct-bg-color);
    border-width: 0 1px 0 0;
    border-color: var(--ct-border-color);
    background-image: var(--ct-arrow);
    background-repeat: no-repeat;
    background-position: right 5px center;
    background-size: 15px;
    padding: .65rem .9rem;
    font-size: 1em;
    width: initial;
    box-shadow: none;
    height: 100%;
    border-radius: 0;
    outline: none;
}

.cloudtable-pagination {
    text-align: right;
    background-color: var(--ct-bg-color);
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}

.cloudtable-pagination>.dots {
    color: var(--ct-text-color);
}

.cloudtable-pagination>button {
    color: var(--ct-text-color);
    background-color: var(--ct-bg-color);
    border-top: 0;
    border-right: 0;
    border-bottom: 2px solid var(--ct-bg-color);
    border-left: 0;
    cursor: pointer;
    padding: .65rem .9rem;
    line-height: 1.5em;
    transition: none;
    font-size: 1em;
    outline: none;
    box-shadow: none;
    border-radius: 0;
}

.cloudtable-pagination>button.active,
.cloudtable-pagination>button:hover,
.cloudtable-pagination>button:focus {
    color: var(--ct-text-color);
    background-color: var(--ct-border-color);
    border-bottom: 2px solid var(--ct-active-color);
}

.cloudtable-pagination>button:last-child {
    border-bottom-right-radius: inherit;
}

.cloudtable>#cloudtable-error {
    padding: 1em 1em 0;
    margin-bottom: 0;
    text-align: center;
    color: var(--ct-text-color);
}