@font-face {
    font-family: 'adelle-sans';
    font-weight: 600;
    src: url('../fonts/adellesans-semibold.ttf') format('truetype');
}
@font-face {
    font-family: 'adelle-sans';
    font-weight: 700;
    src: url('../fonts/adellesans-bold.ttf') format('truetype');
}
@font-face {
    font-family: 'adelle-sans';
    font-weight: 400;
    src: url('../fonts/adellesans-regular.ttf') format('truetype');
}
@font-face {
    font-family: 'gelion';
    font-weight: 700;
    src: url('../fonts/gelion-bold.woff') format('woff'), url('fonts/gelion-bold.woff2') format('woff2');
}
body {
    font-family: 'adelle-sans', sans-serif;
}
:root {
    --body-bg: #1E2129;
    --text-color-dark: #4C5367;
    --font-size-xl: 26px;
    --table-footer-bg: transparent;
    --table-header-bg: transparent;
    --color-primary: var(--primary-color);
    --text-on-primary: var(--text-on-primary-color);
    --link-color: #828795;
    --link-hover-color: #DE716B;
    --content-panel-bg: #ffffff;
    --body-max-width: 100%;
    --user-menu-bg: #35383F;
    --body-bg: var(--sidebar-color);
    --user-menu-bg: var(--user-menu-color);
}

.page-item.active .page-link {
    background: #fff;
    color: var(--link-color);
    border-color: var(--link-color);
}
.btn {
    padding: 7.5px 15px;
    font-size: 14px;
}
.btn.btn-primary {
    font-weight: bold;
    font-family: 'gelion';
}
.collection-table thead th {
    white-space: nowrap;
}
#main-menu {
    font-weight: 600;
    font-size: 12px;
    margin-top: 35px;
    margin-left: 20px;
    padding-bottom: 35px;
}
#main-menu .menu .menu-item {
    margin-bottom: 5px;
    padding: 0;
    display: flex;
    align-items: stretch;
}
#main-menu .menu a {
    display: flex;
    flex: 1 1 auto;
    color: var(--text-on-sidebar-color);
    transition: 0.2s ease all;
}
#main-menu .menu .menu-icon {
    margin-right: 15px;
    color: var(--menu-icon-color);
    transition: 0.2s ease all;
}
#main-menu .menu .menu-item.active:not(.expanded) .menu-icon,
#main-menu .menu .menu-item.active:not(.expanded) a,
#main-menu .menu .menu-item:hover .menu-icon,
#main-menu .menu .menu-item:hover a {
    color: var(--highlighted-text-on-sidebar-color);
}
#main-menu .menu .menu-item::after {
    content: '';
    opacity: 0;
    border-radius: 3px 0 0 3px;
    width: 3px;
    height: 27px;
    background: #fff;
    transition: 0.5s opacity ease;
}
#main-menu .menu .menu-item:hover::after,
#main-menu .menu .menu-item.active::after {
    opacity: 1;
}
#main-menu .menu .menu-header {
    color: var(--text-on-sidebar-color);
    font-size: 10px;
    letter-spacing: 1px;
    font-weight: bold;
}
#navigation-toggler {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9999;
    padding: 10px;
    border-bottom-left-radius: 10px;
    background: var(--body-bg);
    width: auto;
    margin-right: 0;
    filter: none;
    color: #A0A3A7;
}
@media screen and (max-width: 1023px) {
    .wrapper {
        display: block;
    }
    .datagrid {
        overflow-x: auto;
    }
}
@media screen and (max-width: 600px) {
    .main-header {
        display: block;
    }
    .list-pagination-counter {
        font-size: 0;
    }
    .list-pagination-counter strong {
        font-size: 14px;
    }
    .pagination .page-link i + span {
        display: none;
    }
    .pagination .page-link span:first-child:not(:last-child) {
        display: none;
    }
}
.content {
    max-width: 100vw;
}
.page-section-type,
.content-panel-header,
.upload-selector-title,
.content-header .title {
    font-weight: bold;
    font-family: 'gelion';
}
.upload-selector-title,
.content-header .title {
    font-size: var(--font-size-xl);
}
.upload-selector-title,
.content-panel-header  {
    font-size: 18px;
    color: var(--heading-color);
}
.content-panel-header-help {
    font-family: 'adelle-sans';
    font-weight: 400;
    color: var(--gray-600);
}
.content-panel-header.collapsible .collapse-icon {
    color: #CE0E02;
}
.page-section-type {
    font-size: 16px;
}
.page-actions,
.global-actions,
.main-header-extra {
    display: flex;
    align-items: center;
}

.page-actions * + *,
.global-actions * + *,
.main-header-extra * + * {
    margin-left: 20px;
}

.wrapper {
    grid-template-areas: "sidebar content-wrapper";
    margin: 0;
    width: 100%;
    height: 100vh;
    gap: 0;
}

.content-wrapper {
    border-top-left-radius: 20px;
    max-height: 100vh;
    overflow: auto;
}
.main-sidebar {
    padding: 20px 0 0 0;
    width: 200px;
    max-height: 100vh;
}
@media screen and (min-width: 1024px) {
    .main-sidebar {
        padding-bottom: 20px;
    }
}
.content-wrapper {
    background: #F7FAFC;
    padding: 0 0 15px 0;
    margin-top: 0;
    display: block;
    border-top-left-radius: 20px;
}
.content-header {
    background: none;
    padding: 0;
}
.content-header-title {
    display: none;
}
.main-header {
    padding: 15px 35px;
    border-top-left-radius: 20px;
    position: sticky;
    top: 0;
    background: #fff;
    align-items: center;
    z-index: 1000;
    box-shadow: 0 -20px 0 0 var(--body-bg), 0 0 7px 0 rgba(0,0,0,0.07);
}
.content-header .title {
    margin-top: 3px;
    margin-bottom: 0;
}
#main {
    margin-top: 35px;
    padding: 0 35px 15px 35px
}
.content-header::after, .content-header::before {
    content: none;
}
.ts-dropdown [data-selectable].option {
    background: var(--white);
}

#header-logo {
    margin: 0 20px;
}

.logo {
    background: var(--logo-url) center top / contain no-repeat;
    width: 140px;
    height: 50px;
    display: block;
}

.navbar {
    padding: 0;
}
.navbar-custom-menu {
    display: flex;
    gap: 20px;
    align-items: center;
}
.locale-switcher {
    display: flex;
    align-items: center;
}
.locale-switcher img {
    width: 20px;
    margin-right: 5px;
}
.locale-switcher select {
    margin: 0;
    background: #fff;
    padding: 0;
    border: none;

}
trix-toolbar .trix-button-group--file-tools {
    display: flex !important;
}
/* .content-panel {
    background: transparent;
    box-shadow: none;
}
.table.datagrid,
.content-panel-body {
    background: transparent;
} */
.datagrid-header-tools {
    padding-bottom: 40px;
}
.btn-translate .btn-label {
    display: none;
}
.field-translation {
    width: 20px;
    text-align: center;
    position: relative;
}
.missing-translations-flags {
    display: flex;
}
.missing-translations-flag {
    position: relative;
    margin-right: 10px;
}
.missing-translations-flag .create-translation {
    top: 30px;
}
.datagrid thead a, .datagrid thead span {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 10px;
    line-height: 16px;
    color: #B7BAC2
}
.table thead tr th img {
    display: block;
}

/* Create translation */
.create-translation {
    display: none;
    position: absolute;
    box-shadow: 0 0 3px 0 rgba(0,0,0,0.15);
    padding: 15px;
    z-index: 1000;
    top: 45px;
    width: 130px;
    background: #fff;
    border-radius: 3px;
    text-align: left;
}
.create-translation-open {
    display: block;
}
.form-control {
    padding: 7.5px 15px;
}
.ts-input, .form-widget .form-select, .form-widget input.form-control, .form-widget textarea.form-control {
    height: 36px;
    padding: 7.5px 15px;
}
.form-widget .form-select {
    max-width: 450px;
}
.form-widget textarea.form-control {
    height: auto;
}
.form-group label, .form-group legend.col-form-label {
    margin: 8px 5px 0 0;
}
.ts-input,
.form-widget .form-select {
    padding: 7.5px 30px 7.5px 15px;
    background-position: right 10px center;
}
.form-group > .form-widget > .form-check {
    margin-left: 46%;
}

.field-select .form-widget .form-check,
.field-boolean .form-widget .form-check {
    margin-left: 0;
}
.form-check-input {
    width: 1.3em;
    height: 1.3em;
    margin-right: 2px;
}
.form-group label.form-check-label {
    margin: 0 0 0 12px;
    text-align: left;
}
/* .content-panel-body > .form-group > .form-widget > .form-check {
    padding-left: 50%;
} */
.field-collection-table-item .form-check {
    padding-left: 0;
    margin: 0;
}
.field-collection-table-item .form-check-input {
    margin-left: 0;
    margin-right: 0;
}
.field-collection[data-prototype*="field-collection-table-item"] > .form-widget {
    flex-basis: 100%;
}
.field-collection[data-prototype*="field-collection-table-item"] > .col-form-label:not(:empty) + .form-widget {
    flex-basis: 55%;
}

/* CollecionType entries */
[data-polymorphic-class] {
    position: relative;
    padding: 15px 20px;
    border-radius: var(--border-radius);
    background: #fff;
    box-shadow: 0 0 0 1px rgba(43,45,80,.16),0 0 0 1px rgba(6,122,184,0),0 0 0 2px rgba(6,122,184,0),0 1px 1px rgba(0,0,0,.08);
    margin-bottom: 20px;
}

.datagrid-header-tools .datagrid-search input[type="search"].form-control {
    background-position: 10px 11px;
}
.form-widget .form-select[data-ea-widget="ea-autocomplete"], .plugin-dropdown_input .dropdown-input .ts-dropdown.form-select, .ts-control.form-select {
    padding: 0;
    box-shadow: none;
}

.input-group-text {
    padding: 17px 10px 19px;
}
.field-collection > .form-widget > .form-widget-compound > div > .form-group > .form-widget,
.field-collection-item > .form-widget,
.field-collection-item > .form-widget-compound {
    flex: 1;
}

.table > :not(:last-child) > :last-child > * {
    border-bottom-color: inherit;
}

.ordered-collection-entry {

}
.ordered-collection-entry-position {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 1px rgba(43,45,80,.16),0 0 0 1px rgba(6,122,184,0),0 0 0 2px rgba(6,122,184,0),0 1px 1px rgba(0,0,0,.08);
    border-radius: 0.25em;
}
.form-widget .ordered-collection-entry-position input.form-control,
.ordered-collection-entry-position .btn {
    padding: 5px;
    text-align: center;
    width: 30px;
    box-shadow: none;
}
.ordered-collection-entry-position .btn-up {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.ordered-collection-entry-position .btn-down {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.form-widget .ordered-collection-entry-position input.form-control[readonly],
.form-widget .ordered-collection-entry-position input.form-control {
    border-radius: 0;
    height: 25px;
    background: var(--white);
}

.btn-section-type {
    margin-right: 15px;
    margin-bottom: 15px;
    display: inline-block;
    min-width: 100px;
    height: 77px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* text-align: center; */
}
.btn-section-type > i {
    font-size: 25px;
}
.btn-section-type > span {
    display: block;
}
.btn-section-type > i + span {
    margin-top: 10px;
}

.polymorphic-cancel {
    float: right;
}
[data-polymorphic-object] > div:first-child {
    padding: 0;
}

.ordered-collection {
    display: flex;
    align-items: flex-start;
}
.ordered-collection-collection {
    flex: 1 1 auto;
}
.ordered-collection-sortable {
    flex: 0 0 200px;
    margin-left: 20px;
    box-shadow: 0 0 0 1px rgba(43,45,80,.16),0 0 0 1px rgba(6,122,184,0),0 0 0 2px rgba(6,122,184,0),0 1px 1px rgba(0,0,0,.08);
    border-radius: 5px;
    padding: 10px;
    position: sticky;
    top: 100px;
}
.ordered-collection-sortable a {
    display: flex;
}
.ordered-collection-sortable a + a {
    margin-top: 10px;
}
.ordered-collection-sortable i {
    margin-top: 5px;
    margin-right: 10px;
}
.ordered-collection-sortable .sortable-ghost {
    background: #f1f1f1;
}
.ordered-collection-sortable-header {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
    font-family: 'gelion';
    font-size: 16px;
}

tr[data-id] {
    cursor: pointer;
}

.form-row-hidden {
    display: none !important;
}

.row-full-width > label {
    display: none;
}

.row-full-width > .form-widget {
    flex: 1 1 auto;
}

.field-collection-item > .form-widget-compound > div > .form-group > .form-widget {
    flex: 1 1 0;
}

/* Uploader */
#upload-uploader-area {
    margin-bottom: 30px;
    background: #fff;
    border-radius: var(--border-radius);
    padding: 15px 20px;
    color: #000;
    box-shadow: var(--box-shadow-lg);
    display: none;
}
#upload-uploader-area.visible {
    display: block;
}
#upload-uploader-area.hover {
    background: #BCEFFF;
}
#upload-uploader-area.uploading {
    background: #E0EABE;
}

#upload-uploader-text-drop,
#upload-uploader-area.hover #upload-uploader-text-drag {
    display: none;
}
#upload-uploader-text-drag,
#upload-uploader-area.hover #upload-uploader-text-drop {
    display: block;
}

#upload-uploader-text-drop i,
#upload-uploader-text-drag i {
    margin-right: 10px;
}

#upload-uploader-choose {
    margin-top: 30px;
    display: flex;
    align-items: center;
}
#upload-uploader-or {
    margin-right: 10px;
}
#upload-uploader-choose-files { display: none; }

.upload-uploader-file {
    padding-top: 10px;
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.upload-uploader-file + .upload-uploader-file {
    border-top: 1px solid #ccc;
    display: flex;
}

.upload-uploader-file-status {
    flex: 0 0 30px;
}

.upload-uploader-file-name {
    flex: 1 1 auto;
}

.upload-uploader-progress {
    position: relative;
    width: 250px;
    height: 30px;
    border-radius: var(--border-radius);
    box-shadow: 0 0 0 1px rgba(43,45,80,.16),0 0 0 1px rgba(6,122,184,0),0 0 0 2px rgba(6,122,184,0),0 1px 1px rgba(0,0,0,.08);
    background: #eee;
}

.upload-uploader-progress-percentage {
    position: absolute;
    right: 7px;
    top: 0;
    line-height: 26px;
}

.upload-uploader-progress-bar {
    width: 0;
    height: 100%;
    border-radius: var(--border-radius);
    background: #c9d5a0;
}

.ea-lightbox-thumbnail {
    display: inline-block;
}

/* Media library checker background */
img.upload-selector-widget-image,
img.upload-selector-upload-image,
img#upload-selector-preview-image,
.ea-lightbox-thumbnail img,
.basicLightbox img {
    background-position: 0px 0px, 6px 6px !important;
    background-size: 12px 12px !important;
    background-image: linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa 100%),linear-gradient(45deg, #aaa 25%, #ccc 25%, #ccc 75%, #aaa 75%, #aaa 100%) !important;
    border: none !important;
    padding: 0 !important;
    object-fit: contain;
}

[data-empty-collection] > .form-group > .form-widget {
    flex: 1 1 auto;
}

.dashboard-widget-period-selector {
    display: flex;
    border-bottom: var(--border-width) var(--border-style) var(--border-color);
}
.dashboard-widget-period-selector a,
.dashboard-widget-period-selector span {
    flex: 1 1 auto;
    text-align: center;
    padding: 10px 20px;
}

.dashboard-widget-period-selector span {
    background: var(--fieldset-bg);
}

.datetime-widget-time .input-group {
    width: 200px;
}

.form-widget-compound label:empty {
    display: none;
}

.form-widget-compound label:empty + .form-widget {
    padding-left: 0;
    flex: 0 0 100%;
}

.dashboard-widgets {
    display: flex;
    flex-wrap: wrap;
}

.dashboard-widgets:not(.saving) .dashboard-widget-move-saving-icon,
.dashboard-widgets.saving .dashboard-widget-move-handle-icon {
    display: none;
}

.dashboard-widgets-column {
    flex: 0 0 auto;
    min-width: 200px;
    width: 100%;
    margin-right: 50px;
}

.dashboard-widgets-column:last-child,
.dashboard-widgets-column:nth-last-child(2) {
    margin-right: 0;
}

@media screen and (min-width: 760px) {
    .dashboard-widgets {
        margin-right: -50px;
        overflow-x: hidden;
    }

    .dashboard-widgets-column {
        max-width: calc(calc(100% - 100px) / 2);
    }
}

@media screen and (min-width: 1350px) {
    .dashboard-widgets-column {
        max-width: calc(calc(100% - 100px) / 3);
    }
    .dashboard-widgets {
        margin-right: 0;
    }
}

.dashboard-widget {
    position: relative;
    margin-bottom: 20px;
}

.dashboard-widget-controls {
    position: absolute;
    top: 7px;
    right: 7px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #eee;
    display: none;
}

.dashboard-widget:hover .dashboard-widget-controls {
    display: flex;
}

.dashboard-widget-control {
    padding: 10px;
    font-size: 12px;
}

.dashboard-widget-move {
    cursor: move;
}

.dashboard-widget-control + .dashboard-widget-control {
    border-left: 1px solid #eee;
}
.upload-preview-video {
    width: 50px;
    height: 50px;
    border-radius: var(--border-radius);
    border: 1px solid #ccc;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.user-menu-wrapper {
    color: var(--text-on-user-menu-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--user-menu-color);
    padding: 10px 10px 10px 20px;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .user-menu-wrapper {
        width: 190px;
        position: fixed;
        bottom: 0;
        left: 0;
    }
}

.user-menu {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

.user-menu a {
    border-radius: 3px;
}

.user-menu .user-action i {
    color: var(--text-on-user-menu-color);
    margin-right: 0;
}
.user-menu .user-action:hover {
    background-color: var(--text-on-user-menu-color);
    color: var(--user-menu-color);
}
.user-menu .user-action:hover i {
    color: inherit;
}
.collection-table {
    width: 100%;
}
.collection-table .field-collection-table-item:first-child .sortable-up,
.collection-table .field-collection-table-item:last-child .sortable-down {
    opacity: 0.5;
    cursor: not-allowed;
}

.collection-table .sortable-item {
    display: inline;
    vertical-align: bottom;
}
.collection-table .sortable-down {
    margin-left: 5px;
}

.collection-table .sort-order {
    display: none;
}
.collection-table .field-collection-delete-button {
    padding: 0;
}

.form-widget .form-widget .form-widget .form-widget [data-polymorphic-class],
.tox {
    max-width: 800px;
}

.form-widget .form-widget {
    flex: 1 1 0;
}

.form-widget .form-widget > .form-check {
    margin-left: 25%;
    padding-left: 30px;
}
@media screen and (max-width: 1024px) {
    .form-widget .form-widget > .form-check {
        margin-left: 0;
        padding-left: 0;
    }
}

.tox-collection__group {
    min-width: max-content;
}

.uploads-sub-folders {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}
.uploads-sub-folders a {
    padding: 10px 20px;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 0 2px rgba(0,0,0,0.1);
    margin-right: 10px;
    margin-bottom: 10px;
    flex: 0 0 auto;
    color: #444;
    border: var(--border-color) var(--border-style) var(--border-width);
}
.uploads-sub-folders a .fa-folder-o,
.uploads-sub-folders a .fa-arrow-left {
    margin-right: 10px;
}

.uploads-view-selector {
    margin-left: auto;
    box-shadow: 0 0 0 1px rgba(43,45,80,.1),0 2px 5px 0 rgba(43,45,80,.1),0 3px 9px 0 rgba(43,45,80,.08),0 1px 1.5px 0 rgba(0,0,0,.08),0 1px 2px 0 rgba(0,0,0,.08);
    background-color: var(--white);
    color: var(--text-color-dark);
    padding: 7.5px 15px;
    font-size: 14px;
    border-radius: var(--border-radius);
}

.uploads-view-selector a + a {
    margin-left: 10px;
}

.uploads-view-selector .selected {
    color: var(--color-primary);
}

.uploads-grid {
    display: flex;
    flex-wrap: wrap;
    margin-right: -20px;
}

.uploads-grid-upload {
    flex: 0 0 200px;
    width: 200px;
    height: 200px;
    position: relative;
    margin-bottom: 20px;
    margin-right: 20px;
}

.uploads-grid-upload:hover {
    box-shadow: var(--box-shadow-lg);
}

.uploads-grid-upload img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uploads-grid-upload .form-batch-checkbox {
    position: absolute;
    top: 10px;
    left: 10px;
    display: none;
}

.uploads-grid-upload:hover .form-batch-checkbox,
.uploads-grid-upload .form-batch-checkbox:checked {
    display: inline-block;
}

.uploads-grid-upload-name {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 10px;
    display: none;
    background: #fff;
    color: var(--text-color-dark);
    overflow-wrap: break-word;
}

.uploads-grid-upload-video {
    font-size: 30px;
    text-align: center;
    height: 100%;
    line-height: 200px;
    background: #fff;
}

.uploads-grid-upload:hover .uploads-grid-upload-name {
    display: block;
}

.uploads-add-to-folder {
    display: inline-block;
    position: relative;
}

.uploads-add-to-folder-dropdown {
    position: absolute;
    display: none;
    box-shadow: 0 0 0 1px rgba(43,45,80,.1),0 2px 5px 0 rgba(43,45,80,.1),0 3px 9px 0 rgba(43,45,80,.08),0 1px 1.5px 0 rgba(0,0,0,.08),0 1px 2px 0 rgba(0,0,0,.08);
    border-radius: var(--border-radius);
    margin-top: 10px;
    right: 0;
    background: #fff;
    padding: 20px;
    width: 200px;
    max-height: 400px;
    overflow: auto;
}

.uploads-add-to-folder-dropdown.visible {
    display: block;
}

.uploads-add-to-folder-dropdown a {
    display: block;
    margin-left: 0;
}

.uploads-add-to-folder-dropdown-children {
    margin: 10px 0 10px 20px;
}

.uploads-add-to-folder-dropdown a + a {
    margin-top: 5px;
}

.color-picker {
    display: flex;
    width: 150px;
    border-radius: var(--border-radius);
    box-shadow: 0 0 0 1px rgba(43,45,80,.16),0 0 0 1px rgba(6,122,184,0),0 0 0 2px rgba(6,122,184,0),0 1px 1px rgba(0,0,0,.08)
    /* border: var(--border-color) var(--border-style) var(--border-color); */
}

.color-picker .form-control-color {
    display: none !important;
}

.color-picker-color {
    width: 36px;
    border-radius: var(--border-radius) 0 0 var(--border-radius);
}

.color-picker-hex {
    padding: 7.5px 30px 7.5px 15px;
}

body .popup.popup_right,
body .picker_wrapper.popup .picker_arrow,
body .picker_wrapper.popup .picker_arrow::after {
    top: auto;
    bottom: 0;
}

body .picker_wrapper.popup .picker_arrow::before {
    -webkit-transform: skew(-45deg);
    transform: skew(-45deg);
    -webkit-transform-origin: 0 0%;
    transform-origin: 0 0%;
}

.upload-edit-preview {
    margin: 0 auto;
    width: max-content;
    padding: 10px;
    border: 1px solid var(--border-color);
}

.upload-edit-preview img {
    display: block;
    max-width: 800px;
    max-height: 400px;
}

.js-filters-form {
    display: flex;
}

.js-filters-buttons {
    display: flex;
}

.js-filters-filter {
    position: relative;
}

.js-filters-button {
    display: flex;
    align-items: center;
    background: var(--grey-100);
}

.js-filters-button i {
    margin-left: 10px;
}

.js-filters-button .fa-chevron-down {
    display: flex;
    align-content: center;
    justify-content: center;
}

.js-filters-filter {
    margin-right: 15px;
}

.js-filters-filter-active .js-filters-button {
    background: #fff;
}

.js-filters-disable {
    --fa-display: none;
    background: var(--gray-500);
    color: #fff;
    font-size: 10px;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
}
.js-filters-filter-active .js-filters-disable {
    --fa-display: inline-flex;
}

.js-filters-dropdown {
    display: none;
    position: absolute;
    top: 50px;
    width: 200px;
    padding: 20px;
    border-radius: 5px;
    background: #fff;
    box-shadow: var(--box-shadow-lg);
}

.js-filters-buttons > form > .form > .form-group {
    padding: 0;
}

.js-filters-dropdown.visible {
    display: block;
}

.form-control.ts-control {
    height: auto;
}

.js-filters-dropdown .form-row  + .form-row {
    margin-top: 15px;
}

.js-filters-dropdown .form-widget {
    padding-left: 0;
    flex: 1 1 0;
}

.js-filters-dropdown .form-select,
.js-filters-dropdown .form-control {
    width: 160px;
}

td.field-text {
    max-width: 400px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}