:root {

    --dark-aio-bg-color:            #1A1A1A;
    --dark-aio-bg-color-light:      #262626;

    --dark-aio-bg-primary-color:    hsl(0, 0%, 10%);

    --dark-aio-color-primary:       #D56400; /** ED8300 */
    --dark-aio-color-green:         #5C9D11; /** #778625 */
    --dark-aio-color-green-hover:   #68B312; /** #829522 */
    --dark-aio-color-red:           #CE3C3C;
    --dark-aio-color-red-hover:     #E14E4E;
    --dark-aio-color-light-red:     #F50024;
    --dark-aio-color-orange:        #FFAE0B;
    --dark-aio-color-blue:          #4E62E1;
    --dark-aio-color-blue-hover:    #7789ff;
    --dark-aio-color-navy:          #14495D;
    --dark-aio-color-navy-hover:    #1A5F79;
    --dark-aio-color-white:         #FFFFFF;

    --dark-theme-text-color:        #F2F2F2;

    --dark-aio-border-color:        var(--dark-aio-input-bg);    /** Cor #404040 */
    --dark-aio-border-color-active: #9D9D9D;

    --dark-aio-input-bg:                    #181818;
    --dark-aio-input-bg-darker:             #121212;
    --dark-aio-input-disabled-bg:           #202020;
    --dark-aio-input-disabled-text-color:   #6D6D6D;

    --dark-aio-btn-hover:                   #313131;
    --dark-aio-btn-disabled-text-color:     #5A5A5A;
    --dark-aio-btn-disabled-bg:             #0A0A0A;
    --dark-aio-btn-secondary-bg:            #393939;
    --dark-aio-btn-secondary-bg-hover:      #4D4D4D;
    --dark-aio-btn-light-primary-bg:        #4C341E;
    --dark-aio-btn-light-primary-bg-hover:  #5E4936;

    --dark-aio-pagination-button-bg:        #464646;
    --dark-aio-pagination-disabled-bg:      #202020;
    --dark-aio-pagination-disabled-text:    #585858;

    --dark-aio-text-secondary-color:        #A3A3A3;

    --dark-aio-chat-bg-active:              #474747;
    --dark-aio-chat-bg-primary:             #1A1A1A;
    --dark-aio-chat-border-color:           #2B2B2B;
    --dark-aio-chat-transfered:             #90530C;    /** Anterior #2C74AF */
    --dark-aio-chat-transfered-hover:       #C47315;    /** Anterior #4A8CC3 */
    --dark-aio-chat-transfered-bg-avatar:   #2C74AF;
    --dark-aio-chat-transfered-bg-avatar-act:   #3897E5;
    --dark-aio-chat-holded:                 #073a51;    /** Anterior #4E5A83 */
    --dark-aio-chat-holded-hover:           #007495;
    --dark-aio-chat-holded-bg-avatar:       #323953;
    --dark-aio-chat-indicator-web:          #2172FF;
    --dark-aio-chat-ballon-agent:           var(--dark-aio-color-primary);
    --dark-aio-chat-avatar-bg-cliente:      #1B79A3;
    --dark-aio-chat-balloon-bg-cliente:     #292929;
    --dark-aio-chat-modal-input-bg-color:   var(--dark-aio-input-bg-darker);

    --dark-aio-scrollbar-thumb-color:       #515151;
    --dark-aio-scrollbar-thumb-color-hover: #6F6F6F;
    --dark-aio-scrollbar-track-color:       #0C0C0C;
    --dark-aio-scrollbar-track-color-hover: #1A1A1A;

    --dark-aio-modal-header:                #121212;

    --dark-aio-table-alt-row:               rgb(255 255 255 / 5%);

    --dark-aio-calendar-table-hover:        rgb(0 0 0 / 50%);

    --dark-aio-kanban-box-bg-color:         #363636;
    --dark-aio-kanban-item-bg-color:        #424242;

}

body.hsna-dark::-webkit-scrollbar,
body.hsna-dark *::-webkit-scrollbar,
body.hsna-dark::-webkit-scrollbar-track,
body.hsna-dark *::-webkit-scrollbar-track,
html body.hsna-dark .table-responsive::-webkit-scrollbar-track,
html body.hsna-dark .dataTables_scroll .dataTables_scrollBody::-webkit-scrollbar-track,
html body.hsna-dark .select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-track {
    background-color: var(--dark-aio-scrollbar-track-color);
}

    body.hsna-dark::-webkit-scrollbar-track,
    body.hsna-dark *::-webkit-scrollbar-track {
        background-color: var(--dark-aio-scrollbar-track-color)!important;
    }

        body.hsna-dark::-webkit-scrollbar-track:hover,
        body.hsna-dark *::-webkit-scrollbar-track:hover {
            background-color: var(--dark-aio-scrollbar-track-color-hover)!important;
        }

    html body.hsna-dark textarea::-webkit-scrollbar-track {
        background-color: var(--dark-aio-scrollbar-track-color)!important;
    }

        html body.hsna-dark textarea::-webkit-scrollbar-track:hover {
            background-color: var(--dark-aio-scrollbar-track-color-hover)!important;
        }

body.hsna-dark::-webkit-scrollbar-thumb,
body.hsna-dark *::-webkit-scrollbar-thumb,
html body.hsna-dark textarea::-webkit-scrollbar-thumb,
html body.hsna-dark .table-responsive::-webkit-scrollbar-thumb,
html body.hsna-dark .dataTables_scroll .dataTables_scrollBody::-webkit-scrollbar-thumb,
html body.hsna-dark .select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-thumb {
    background-color: var(--dark-aio-scrollbar-thumb-color);
}

    body.hsna-dark::-webkit-scrollbar-thumb:hover,
    body.hsna-dark *::-webkit-scrollbar-thumb:hover {
        background-color: var(--dark-aio-scrollbar-thumb-color-hover);
    }

body.hsna-dark::-webkit-resizer { background-color: #3D3D3D; }

html .hsna-dark .pace .pace-progress {
    background: var(--dark-aio-color-primary);
    border-bottom-color: var(--dark-aio-color-primary);
}

.hsna-dark .sip-indicator.success .stats-indicator,
.hsna-dark .line-status-block li.disponivel .line-status-icon {
    background-color: var(--dark-aio-color-green);
}

.hsna-dark .main-header a.btnModules:hover,
body.hsna-dark .main-top-menu .list-unstyled a:hover,
.hsna-dark .main-header .nav.nav-tabs .nav-item .nav-link:hover,
body.hsna-dark .main-top-menu .list-unstyled .dropdown.show a#btnCallXferBlind,
body.hsna-dark .main-top-menu .list-unstyled .dropdown.show a#btnCallXferAtted,
body.hsna-dark .main-top-menu .list-unstyled #btnCallVolControl.dropdown.show a {
    background-color: var(--dark-aio-btn-hover);
}

body.hsna-dark .main-top-menu .list-unstyled.list-main-buttom .form-group .input-group .input-group-append #btnCallStart.btn.btn-outline-input-color:hover i { color: #2FD159!important; }

.hsna-dark .bg-primary { background-color: var(--dark-aio-bg-primary-color)!important; }

body.hsna-dark .bg-danger { background-color: var(--dark-aio-color-red)!important; }

body.hsna-dark .chat-origin-indicator.chat-origin-whatsapp { background-color: #09933d; }

body.hsna-dark .main-header div[class^="col-"].bg-danger:nth-child(2) {
    border-left-color: var(--dark-aio-color-red);
    border-right-color: var(--dark-aio-color-red);
}

.hsna-dark .btn-info,
.hsna-dark .btn-dialup {
    background-color: #33649b;
}

.hsna-dark .btn-whatsapp { background-color: #27914F; }

.hsna-dark .input-error,
body.hsna-dark #frmCallCtrlCodExt {
    color: var(--dark-aio-color-light-red);
}

.hsna-dark .clock,
.hsna-dark .clock:after,
.hsna-dark .clock:before {
    border-color: var(--dark-aio-color-white);
}

body.hsna-dark .pagination .page-item { background-color: transparent; }

    body.hsna-dark .pagination .page-item .page-link { background-color: var(--dark-aio-pagination-button-bg); }

body.hsna-dark .pagination .page-item .page-link,
body.hsna-dark .pagination .page-item.previous~.page-item:nth-child(2) .page-link,
body.hsna-dark .pagination .page-item.previous~.page-item:nth-last-child(-n+2) .page-link {
    border: 1px solid var(--dark-aio-pagination-button-bg);
}

body.hsna-dark .pagination .page-item.last.disabled .page-link,
body.hsna-dark .pagination .page-item.next.disabled .page-link,
body.hsna-dark .pagination .page-item.first.disabled .page-link,
body.hsna-dark .pagination .page-item.previous.disabled .page-link {
    background-color: var(--dark-aio-pagination-disabled-bg);
    border-color: var(--dark-aio-pagination-disabled-bg)!important;
}

    body.hsna-dark .pagination .page-item.last.disabled .page-link,
    body.hsna-dark .pagination .page-item.next.disabled .page-link,
    body.hsna-dark .pagination .page-item.first.disabled .page-link,
    body.hsna-dark .pagination .page-item.previous.disabled .page-link {
        color: var(--dark-aio-pagination-disabled-text)!important;
    }

body.hsna-dark .radio-inputs { background-color: var(--dark-aio-bg-color); }
body.hsna-dark .radio-inputs .radio input:checked + .name { background-color: var(--dark-aio-input-bg); }
body.hsna-dark .text-muted { color: var(--dark-aio-color-white) !important; }



/**
 * Buttons
 */
body.hsna-dark .btn-light-secondary {
    background-color: var(--dark-aio-btn-secondary-bg);
    color: var(--dark-aio-text-secondary-color)
}

    body.hsna-dark .btn-light-secondary:hover {
        background-color: var(--dark-aio-btn-secondary-bg-hover)!important;
        color: var(--dark-aio-color-white)!important;
    }

body.hsna-dark .login-card {
    min-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    background: url(../img/login_bg-black.jpg);
    background-position: center;
    padding: 30px 12px;
}

body.hsna-dark .login-card .login-main { background-color: var(--dark-aio-bg-color-light); }

body.hsna-dark .login-card .login-main .theme-form input {
    background-color: var(--dark-aio-input-bg);
    color: var(--dark-theme-text-color);
}


body.hsna-dark .btn-toolbar.active,
body.hsna-dark .chat-header-icons .btn-toolbar:hover,
body.hsna-dark .chatbox-content-area .chat-content .chat .avatar,
body.hsna-dark .chat-header-icons .nav.nav-tabs .nav-item .nav-link,
body.hsna-dark .sidebar-left .nav.nav-tabs#tabsAtendimento .nav-item .nav-link {
    background-color: transparent;
}

    .hsna-dark .custom-tab-agent .btn-toolbar i { color: inherit; }

.hsna-dark .webchat-error { color: var(--dark-aio-color-red); }

body.hsna-dark .chatDivisor,
body.hsna-dark .accordion .card.open,
body.hsna-dark .collapsible .card.open,
body.hsna-dark .accordion .card .card-header,
body.hsna-dark .btn-group:not(.dropdown)>.btn,
body.hsna-dark .collapsible .card .card-header,
body.hsna-dark .calendar-wrapper .calendar-view .calendar-action .btn-action {
    border-color: var(--dark-aio-border-color);
}

    body.hsna-dark .border,
    body.hsna-dark .btn-group {
        border-color: var(--dark-aio-border-color)!important;
    }

body.hsna-dark .checkbox input:checked~label:before { background-color: var(--dark-aio-color-primary)!important; }

    body.hsna-dark .checkbox>label>label:after { border-color: var(--dark-aio-color-primary); }

.hsna-dark .btn-warning {
    border-color: var(--dark-aio-color-primary)!important;
    background-color: var(--dark-aio-color-primary)!important;
}

.hsna-dark .form-control:focus,
.hsna-dark .input-group:has(.form-control:focus) {
    box-shadow: 0px 0px 10px -1px rgb(181 86 0 / 32%), inset 0 0 1px 1px rgb(252 122 3 / 54%);
}

    .hsna-dark .input-group .form-control:focus,
    .hsna-dark .main-top-menu .input-group:has(.form-control:focus) {
        box-shadow: none;
    }

body.hsna-dark hr,
body.hsna-dark .modal-footer,
body.hsna-dark .modal-header,
body.hsna-dark .UiTextHeading,
body.hsna-dark .radio label::before,
body.hsna-dark .main-menu.menu-light,
body.hsna-dark #actionArea #ButtonBar,
body.hsna-dark .btn-outline-input-color,
body.hsna-dark .modal-body [id*="_Html"],
body.hsna-dark .main-menu.menu-light .navigation>li>ul>li:first-child>a,
body.hsna-dark .main-menu.menu-light .navigation>li.nav-item.open.has-sub.open,
body.hsna-dark .main-menu.menu-light .navigation > li ul li[data-menu="dropdown-submenu"] > ul {
    border-color: var(--dark-aio-border-color);
}

body.hsna-dark h1,
body.hsna-dark h2,
body.hsna-dark h3,
body.hsna-dark h4,
body.hsna-dark h5,
body.hsna-dark h6,
body.hsna-dark .h1,
body.hsna-dark .h2,
body.hsna-dark .h3,
body.hsna-dark .h4,
body.hsna-dark .h5,
body.hsna-dark .h6,
html body.hsna-dark,
body.hsna-dark .btn,
body.hsna-dark label,
body.hsna-dark .table,
body.hsna-dark .on_white,
body.hsna-dark .breadcrumb,
body.hsna-dark input.gauge,
body.hsna-dark .form-control,
body.hsna-dark .dropdown-item,
body.hsna-dark .ui-state-hover,
body.hsna-dark .table thead th,
body.hsna-dark .tui-calendar th,
body.hsna-dark .tui-calendar td,
body.hsna-dark .dropdown-menu i,
body.hsna-dark .ui-state-default,
body.hsna-dark .input-group-text,
body.hsna-dark .ui-widget-header,
body.hsna-dark .ui-widget-content,
body.hsna-dark .card .card-footer,
body.hsna-dark .nav-tabs .nav-link,
body.hsna-dark .form-control:focus,
body.hsna-dark .btn-toolbar:hover i,
body.hsna-dark .nav-pills .nav-link,
body.hsna-dark .btn-toolbar.active i,
body.hsna-dark .xdsoft_datetimepicker,
body.hsna-dark .tui-timepicker-select,
body.hsna-dark .form-control-position,
body.hsna-dark .webfaq-list-group li a,
body.hsna-dark .breadcrumb-item.active,
body.hsna-dark .chat-interactive-content,
body.hsna-dark .tui-full-calendar-button,
.hsna-dark .custom-tab-agent .btn-toolbar,
body.hsna-dark .elfinder .elfinder-navbar,
body.hsna-dark .nav.nav-tabs~.tab-content,
body.hsna-dark .picker__day--infocus:hover,
body.hsna-dark .avatar span#chatContactAbrv,
body.hsna-dark .picker__day--outfocus:hover,
body.hsna-dark #actionArea .form-group label,
body.hsna-dark a:not([href]):not([tabindex]),
body.hsna-dark .elfinder .elfinder-statusbar,
body.hsna-dark .badge-circle-light-secondary,
body.hsna-dark #frmChatContent .btn-no-border,
body.hsna-dark .main-top-menu .list-unstyled i,
body.hsna-dark .tui-calendar .tui-calendar-title,
body.hsna-dark .pagination .page-item .page-link,
body.hsna-dark .widget-timeline li .timeline-time,
body.hsna-dark .ui-widget-content .ui-state-hover,
body.hsna-dark .modal-body [id*="AdioStats"] legend,
body.hsna-dark .main-menu.menu-light .navigation li a,
body.hsna-dark .tui-calendar .tui-calendar-title-today,
body.hsna-dark .nav.nav-tabs .nav-item .nav-link:hover,
body.hsna-dark .nav.nav-pills .nav-item .nav-link:hover,
body.hsna-dark .xdsoft_datetimepicker .xdsoft_calendar th,
body.hsna-dark .xdsoft_datetimepicker .xdsoft_calendar td,
body.hsna-dark #frmChatContent .d-flex .btn-group-webchat i,
body.hsna-dark .form-control.pickadate.picker__input[readonly],
body.hsna-dark .dashboard-server a:not([href]):not([tabindex]),
body.hsna-dark #aioTabAutoID .content-area-auto-gestao .avatar,
body.hsna-dark .chatbox-content-area .avatar .chat-first-letter,
body.hsna-dark .has-icon-left [readonly]~.form-control-position i,
body.hsna-dark .custom-system-right-bar .nav-tabs .nav-link.active,
body.hsna-dark .main-menu .navbar-header .navbar-brand .brand-text,
body.hsna-dark .kanban-container .kanban-board .kanban-board-header,
html body.hsna-dark .content .content-wrapper .content-header-title,
body.hsna-dark .table.datatables-view > thead > tr:nth-child(2) > th,
body.hsna-dark.chat-application .chat-content .chat-left .chat-message,
body.hsna-dark .table.table-hsna-custom > thead > tr:nth-child(2) > th,
body.hsna-dark .dataTables_wrapper.no-footer .btn-group .btn-secondary,
body.hsna-dark .header-navbar .navbar-container ul.nav li > a.nav-link,
body.hsna-dark div[id^="report-main"] .table tbody tr:last-child td h4 a,
body.hsna-dark .chatbox-content-area tr.active .avatar .chat-first-letter,
body.hsna-dark .dropdown-menu a:not([href]):not([tabindex]).dropdown-item,
body.hsna-dark .card-header .heading-elements a:not([href]):not([tabindex]),
body.hsna-dark .dataTables_wrapper.no-footer .btn-group .btn-secondary:active,
body.hsna-dark #aioTabVCrmID .content-area-auto-gestao .avatar .avatar-content,
body.hsna-dark #aioTabAutoID .content-area-auto-gestao .avatar .avatar-content,
body.hsna-dark #aioTabAutoID .content-area-auto-gestao .avatar .avatar-content,
body.hsna-dark .tui-full-calendar-popup-section-item .tui-full-calendar-content,
body.hsna-dark .content-area-auto-gestao .custom-tab-pill.custom-tab-pill-color,
body.hsna-dark .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box>div>div,
body.hsna-dark .table.datatables-view.table-dash-chats > thead > tr:nth-child(2) > th,
body.hsna-dark .custom-system-right-bar .nav.nav-tabs .nav-item .nav-link.active:hover,
body.hsna-dark .datatables-viewlist .dataTables_wrapper .top .btn-group .btn-secondary,
body.hsna-dark .custom-system-right-bar .nav.nav-pills .nav-item .nav-link.active:hover,
body.hsna-dark.chat-application .chat-content .chat.chat-left .chat-body .chat-message p,
body.hsna-dark .webfaq-area .webfaq-content .webfaq-wrapper .card-footer .webchat-tags a,
body.hsna-dark .chat-application .chat-content .chat-box-system .chat-body .chat-message p,
body.hsna-dark .select2-container--default .select2-search--dropdown .select2-search__field,
body.hsna-dark .content .content-wrapper .breadcrumb-wrapper .breadcrumb .breadcrumb-item a,
body.hsna-dark .content .content-wrapper .breadcrumb-wrapper .breadcrumb .breadcrumb-item a i,
body.hsna-dark.horizontal-menu .navbar-expand-sm .navbar-nav .dropdown .dropdown-toggle:after,
body.hsna-dark .horizontal-menu .navbar-expand-sm .navbar-nav .dropdown .dropdown-toggle:after,
body.hsna-dark.vertical-overlay-menu .main-menu .navigation li.has-sub > a:not(.mm-next):after,
body.hsna-dark .content .content-wrapper .breadcrumb-wrapper .breadcrumb .breadcrumb-item.active,
body.hsna-dark .select2-container--default .select2-selection--single .select2-selection__rendered,
body.hsna-dark .content .content-wrapper .breadcrumb-wrapper .breadcrumb .breadcrumb-item:not(.active),
body.hsna-dark .elfinder-cwd-wrapper .elfinder-cwd-view-icons .elfinder-cwd-file .elfinder-cwd-filename,
body.hsna-dark .email-application .content-right .email-app-details .email-detail-header .email-detail-title,
body.hsna-dark .content .content-wrapper .breadcrumb-wrapper .breadcrumb .breadcrumb-item+.breadcrumb-item:before,
body.hsna-dark .calendar-wrapper .calendar-view .calendar-content .tui-full-calendar-popup-detail .tui-full-calendar-content,
body.hsna-dark.horizontal-menu .navbar-expand-sm .navbar-nav .dropdown .dropdown-menu .dropdown-submenu .dropdown-toggle:after,
body.hsna-dark .select2-container--default .select2-selection--multiple .select2-selection__rendered li .select2-search__field,
body.hsna-dark .email-application .content-right .email-app-list-wrapper .email-app-list .email-user-list .users-list-wrapper li .mail-date,
body.hsna-dark .email-application .content-right .email-app-list-wrapper .email-app-list .email-user-list .users-list-wrapper li .mail-message p,
body.hsna-dark .ui-front.ui-widget.ui-widget-content.elfinder-button-menu.elfinder-button-search-menu .buttonset.ui-controlgroup .ui-button:hover,
body.hsna-dark .ui-front.ui-widget.ui-widget-content.elfinder-button-menu.elfinder-button-search-menu .buttonset.ui-controlgroup .ui-checkboxradio-checked.ui-state-active {
    color: var(--dark-aio-color-white);
}

body.hsna-dark .form-control,
body.hsna-dark .input-group-text,
body.hsna-dark .select2-dropdown,
body.hsna-dark .form-group .input-group .form-control,
body.hsna-dark .select2-container--classic .select2-selection--single,
body.hsna-dark .select2-container--default .select2-selection--single,
body.hsna-dark .form-group .input-group .input-group-prepend .input-group-text,
body.hsna-dark #agent-info .input-group-append.input-phone-dial .btn-outline-light,
body.hsna-dark .main-top-menu .list-unstyled.list-main-buttom .form-group .input-group .input-group-append .btn.btn-icon,
body.hsna-dark .select2-container--default .select2-selection--multiple, body.hsna-dark .form-control.pickadate.picker__input[readonly].form-control {
    background-color: var(--dark-aio-input-bg);
}

    body.hsna-dark .main-top-menu .list-unstyled.list-main-buttom .form-group .input-group .input-group-append .btn.btn-outline-input-color:hover { background-color: var(--dark-aio-input-bg)!important; }

    body.hsna-dark .main-top-menu .list-unstyled.list-main-buttom .form-group .input-group .input-group-append .btn.btn-icon { border-color: var(--dark-aio-input-bg); }

    body.hsna-dark .modal-body .form-control,
    body.hsna-dark form#frmChatContent .form-control,
    body.hsna-dark .select2-container--default .select2-selection--single {
        background-color: var(--dark-aio-chat-modal-input-bg-color);
    }

    body.hsna-dark .select2-container--default .select2-selection--single { border-color: var(--dark-aio-chat-modal-input-bg-color)!important; }

body.hsna-dark .form-control:disabled,
body.hsna-dark .form-control[readonly],
body.hsna-dark .form-control:not(.pickadate)[readonly],
body.hsna-dark .form-control:not(.pickadate-months-year)[readonly],
body.hsna-dark div[id*="Calendar"] .modal-content .form-control.pickadate.picker__input[readonly].form-control,
body.hsna-dark .select2[readonly]~.select2.select2-container.select2-container--default .select2-selection--single,
body.hsna-dark .select2[readonly]~.select2.select2-container.select2-container--default .select2-selection.select2-selection--multiple {
    background-color: var(--dark-aio-input-disabled-bg)!important;
    color: var(--dark-aio-input-disabled-text-color)!important;
    border-color: var(--dark-aio-input-disabled-bg)!important;
}

body.hsna-dark .form-control[disabled],
body.hsna-dark textarea.form-control[disabled] {
    border-color: var(--dark-aio-input-disabled-bg)!important;
}

body.hsna-dark .main-header a.btnModules:active,
body.hsna-dark .main-header a.btnModules.active,
body.hsna-dark .btn-group:not(.dropdown)>.btn:focus,
body.hsna-dark .btn-group:not(.dropdown)>.btn:hover,
body.hsna-dark .btn-group:not(.dropdown)>.btn.active,
body.hsna-dark .btn-group:not(.dropdown)>.btn:active,
body.hsna-dark .radio.radio-primary input:checked~label::before,
body.hsna-dark .checkbox.radio-primary input:checked~label::before,
body.hsna-dark .radio.checkbox-primary input:checked~label::before,
body.hsna-dark .main-header .nav.nav-tabs .nav-item .nav-link.active,
body.hsna-dark .checkbox.checkbox-primary input:checked~label::before {
    background-color: var(--dark-aio-color-primary);
}

body.hsna-dark footer.footer,
body.hsna-dark .custom-tab-pill.custom-tab-pill-color {
    background: var(--black-bg-body-color);
}

.hsna-dark .main-header div[class^="col-"]:nth-child(2) {
    border-left-color: var(--dark-aio-border-color);
    border-right-color: var(--dark-aio-border-color);
}

.hsna-dark .custom-system-right-bar {
    background-color: #282828;
    box-shadow: 1px 10px 40px 0px rgba(0 0 0 / 100%);
}

body.hsna-dark .card,
body.hsna-dark .chat-wrapper form,
body.hsna-dark #template-customizer,
body.hsna-dark .dataTables_scrollHead,
body.hsna-dark.horizontal-menu .header-navbar,
body.hsna-dark .datatables-viewlist .dataTables_wrapper .top,
body.hsna-dark .email-application .content-right .email-app-details .email-scroll-area .email-detail-head .collapse-header {
    background-color: var(--dark-aio-bg-color-light);
}

    body.hsna-dark .email-application .content-right .webmsg-content .email-app-details .email-scroll-area .email-detail-head .collapse-header.open { box-shadow: -8px 12px 18px 0 rgb(0 0 0 / 13%) !important; }

    body.hsna-dark .email-application .content-right .email-app-details .email-scroll-area .email-detail-head .collapse-header.open { background-color: var(--dark-aio-bg-color-light)!important; }

    body.hsna-dark .card.chat-wrapper,
    body.hsna-dark .chatbox-content-area .sidebar-left,
    body.hsna-dark .chatbox-content-area .chat-header header,
    body.hsna-dark .chatbox-content-area .chat-sidebar-search {
        background-color: var(--dark-aio-chat-bg-primary);
    }

        body.hsna-dark .card.chat-wrapper form { background-color: transparent; }

body.hsna-dark.horizontal-menu .header-navbar { border-bottom-color: var(--dark-aio-border-color); }

    body.hsna-dark .webmsg-content .email-app-details .email-scroll-area .collapsible.email-detail-head .card.open .card-header { border-bottom-color: var(--dark-aio-border-color)!important; }

html body.hsna-dark,
body.hsna-dark .webmsg-content .email-app-list,
body.hsna-dark .boxChatContacts_team.card-title,
body.hsna-dark .webmsg-content .email-app-details,
body.hsna-dark .table.table-hsna-resume > thead > tr:first-child th,
body.hsna-dark .webmsg-content .email-app-details .email-detail-header,
body.hsna-dark .email-application .content-right .webmsg-content .email-app-details,
body.hsna-dark .webmsg-content .email-app-list .email-user-list .users-list-wrapper li.mail-read {
    background-color: var(--dark-aio-bg-color);
}

.hsna-dark .custom-system-right-bar form .btn-danger {
    background-color: #1E1E1E!important;
    border-color: #1E1E1E!important;
}

.hsna-dark .custom-system-right-bar form .FmkCalendarBtn.FmkCalendarBtnHover.btn-danger {
    background-color: var(--dark-aio-color-primary)!important;
    border-color: var(--dark-aio-color-primary)!important;
}

body.hsna-dark .sidebar-left .nav-tabs,
body.hsna-dark .chatbox-content-area .chat-sidebar-search,
body.horizontal-menu.chat-application.hsna-dark #aioTabChatID .chat-sidebar {
    border-right: 1px solid var(--theme-dark-chat-border-color)!important;
}

body.hsna-dark .chatbox-content-area .sidebar-left,
body.hsna-dark .webfaq-area .webfaq-content header,
body.hsna-dark .webmsg-area .webmsg-content header,
body.hsna-dark .chatbox-content-area .chat-sidebar-search,
body.hsna-dark .chatbox-content-area .chat-header .border-bottom {
    border-color: var(--theme-dark-chat-border-color)!important;
}

    body.hsna-dark #boxChatContacts_header,
    body.hsna-dark .nav.nav-tabs#tabsAtendimento,
    body.hsna-dark .chatbox-content-area .chat-sidebar-search,
    body.hsna-dark .chat-application .chat-sidebar .chat-sidebar-search {
        background-color: #272727!important;
    }

body.hsna-dark .nav-tabs,
body.hsna-dark #boxChatContacts_header {
    border-color: var(--dark-aio-chat-border-color);
}

body.hsna-dark .sidebar-left .nav.nav-tabs#tabsAtendimento .nav-item .nav-link { color: inherit; }

    body.hsna-dark .sidebar-left .nav.nav-tabs#tabsAtendimento .nav-item .nav-link div.flex-fill { filter: opacity(0.5); }
    body.hsna-dark .sidebar-left .nav.nav-tabs#tabsAtendimento .nav-item .nav-link.active div.flex-fill { filter: opacity(1.0); }

body.hsna-dark .chat-sidebar>.table-responsive>table>tbody#boxChatContacts_Waiting tr:first-child>td { background-color: initial!important; }

body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr:hover,
body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr.active:hover,
body.hsna-dark .chat-sidebar .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr:hover {
    background-color: transparent;
}

body.hsna-dark #boxChatContacts_tabs tr.active td,
body.hsna-dark #boxChatContacts_Waiting tr.active td,
body.hsna-dark #boxChatContacts_tabs tr.active.chat_box_holded>td {
    background-color: #474747!important;
}

    body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad) tr:hover td { background-color: #313131; }

body.hsna-dark .inhold.chat_box_holded>td .avatar,
body.hsna-dark .chatbox-content-area .inhold.chat_box_holded>td .avatar {
    background-color: var(--dark-aio-chat-holded-bg-avatar)!important;
}

body.hsna-dark .avatar,
body.hsna-dark .chatbox-content-area .avatar,
body.hsna-dark .chatbox-content-area tr.active .avatar {
    background-color: #4B4B4B;
}

body.hsna-dark .chat_holded.badge { background-color: #0B9392; }

body.hsna-dark .chat_box_transferred>td,
body.hsna-dark .chat_box_transferred.chat_box_holded>td {
    background-color: #7F4400!important;
}

body.hsna-dark .chat_box_transferred.chat_box_holded>td { border-color: transparent; }

    body.hsna-dark .chat_box_transferred.active>td { border-color: #DFC288; }

body.hsna-dark.chat-application .chat-content .chat-box-system .chat-body .chat-message { background-color: transparent; }

body.hsna-dark .nav.nav-tabs#tabsAtendimento .nav-item .nav-link { border-bottom-color: #494949; }

    body.hsna-dark .nav.nav-tabs#tabsAtendimento .nav-item .nav-link.active { border-bottom-color: var(--primary-color); }

body.hsna-dark.chat-application .chat-window-wrapper .chat-start,
body.hsna-dark.chat-application .chat-window-wrapper .chat-container,
body.hsna-dark #chat-conversa>.card.chat-wrapper.shadow-none>.card-content>.card-body.chat-container.ps {
    background-color: #101010!important;
}

body.hsna-dark.chat-application .chat-window-wrapper .chat-start .chat-start-icon { background-color: #313131; }

body.hsna-dark .chatbox-content-area tr.active td,
body.hsna-dark .cursor-pointer.d-flex.boxChatContacts_agent.chat-box-status:hover,
body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr:hover td,
body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr.active:hover td {
    background-color: var(--theme-dark-v2-bg-hover)!important;
}

    body.hsna-dark .chat_box_transferred>td,
    body.hsna-dark .chat-sidebar>.table-responsive table tbody tr td,
    body.hsna-dark .chat-sidebar .table tbody#boxChatContacts_vcrm tr:has(.card-title):hover td,
    body.hsna-dark .table.table-webchat-info-hist:not(.table-gestao-pausa):not(.table-dialer-pad) tr:hover td {
        background-color: transparent;
    }

    body.hsna-dark .chatbox-content-area .avatar .chat-first-letter { background-color: #3B3B3B; }

    body.hsna-dark .chatbox-content-area .chat_box_transferred.chat_box_holded .avatar .chat-first-letter { background-color: #331B00; }

        body.hsna-dark .chatbox-content-area .chat_box_transferred.chat_box_holded:hover .avatar .chat-first-letter { background-color: #955002; }

        body.hsna-dark #boxChatContacts_tabs .chat_box_transferred>td { background-color: #BD6908!important; }

        body.hsna-dark #boxChatContacts_tabs .chat_box_transferred:hover>td,
        body.hsna-dark #boxChatContacts_tabs .chat_box_transferred.active>td,
        body.hsna-dark #boxChatContacts_Waiting tr.chat_box_transferred.chat_box_holded:hover td,
        body.hsna-dark #boxChatContacts_Waiting tr.chat_box_transferred.chat_box_holded.active td,
        body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr.chat_box_transferred.chat_box_holded:hover td,
        body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr.chat_box_transferred.chat_box_holded.active td {
            background-color: #EE7F00!important;
        }

        body.hsna-dark #boxChatContacts_tabs tr.chat_box_transferred td .avatar .chat-first-letter,
        body.hsna-dark #boxChatContacts_Waiting tr.chat_box_transferred.chat_box_holded.active td .avatar .chat-first-letter,
        body.hsna-dark .table:not(.table-gestao-pausa):not(.table-dialer-pad):not(.table-webchat-info-hist) tr.chat_box_transferred.chat_box_holded:hover td .avatar {
            background-color: #8f4c00!important;
        }

        body.hsna-dark .chatbox-content-area .chat_box_holded.waitingChat_NewMessage .avatar .chat-first-letter,
        body.hsna-dark .chatbox-content-area .chat_box_transferred.chat_box_holded.waitingChat_NewMessage .avatar .chat-first-letter {
            background-color: #006310;
        }

body.hsna-dark .chat-origin-indicator.chat-origin-web { background-color: var(--dark-aio-chat-indicator-web); }

body.hsna-dark #boxChatContacts_list .d-loading-chat-content { background-color: var(--dark-aio-chat-bg-primary); }

body.hsna-dark .chatHistoryLoad .badge { background-color: var(--dark-aio-color-primary)!important; }

    body.hsna-dark .chatHistoryLoad .badge:hover { background-color: #e78229!important; }

/**
 * Modal
 * */
 body.hsna-dark .modal-header.bg-dark {
    background-color: var(--dark-aio-modal-header)!important;
}

body.hsna-dark .main-menu.menu-light,
body.hsna-dark .main-menu.menu-light .navigation,
body.hsna-dark .modal.modal-hsna-custom .modal-content {
    background: var(--dark-aio-chat-bg-primary);
}

body.hsna-dark #actionArea #devices,
body.hsna-dark #actionArea #account,
body.hsna-dark .modal-body .UiSideField .UiTextHeading {
    border-color: var(--dark-aio-border-color);
    background: var(--dark-aio-bg-color-light);
}


/**
 * Dropdown - Dialpad
 */
body.hsna-dark .dropdown-menu { box-shadow: -7px 8px 16px 0 rgb(18 18 18 / 48%); }

body.hsna-dark .dropdown-menu,
body.hsna-dark .dropdown-divider,
body.hsna-dark.horizontal-menu .navbar-expand-sm .navbar-nav .dropdown .dropdown-menu {
    background-color: var(--dark-aio-chat-bg-primary);
}

    body.hsna-dark .table td,
    body.hsna-dark .dropdown-menu,
    body.hsna-dark .dropdown-divider,
    body.hsna-dark.horizontal-menu .navbar-expand-sm .navbar-nav .dropdown .dropdown-menu {
        border-color: var(--dark-aio-chat-border-color);
    }

/**
 * Chat
 */
body.hsna-dark div#chatSpeechStart:hover,
body.hsna-dark #frmChatContent .d-flex .btn-group-webchat i:hover,
body.hsna-dark #frmChatContent .d-flex .btn-group-webchat .btn-webchat-svg-icon:hover {
    background-color: #2B2B2B;
}

    body.hsna-dark div#chatSpeechStart path { fill: #C1C1C1; }
    body.hsna-dark div#chatSpeechStart:hover path { fill: var(--dark-aio-color-white); }

body.hsna-dark .chatbox-content-area .sidebar-left,
body.hsna-dark.chat-application .chat-sidebar.card,
body.hsna-dark .content-layout-sidebar .sidebar-left,
body.hsna-dark .chat-sidebar>.table-responsive>table>tbody tr::after {
    background-color: var(--black-bg-sidebar-left-color)!important;
    background-color: transparent!important;
}

body.hsna-dark .chat-history-container,
body.hsna-dark .box-chat-header-dialog,
body.hsna-dark .chat-window-wrapper .chat-area .card-body.content-full {
    background-color: var(--dark-aio-bg-color-light);
}

    body.hsna-dark .box-chat-header-dialog .table td { border-color: #373737; }

.hsna-dark.chat-application .chat-content .chat-body .chat-message {
    background: var(--dark-aio-chat-ballon-agent)!important;
    background: #1772b5 !important;

}

body.hsna-dark.chat-application .chat-content .chat.chat-box-system .chat-body .chat-message.bg-transparent .chat-message-wrapper {
    background-color: transparent!important;
    box-shadow: none!important;
}

body.hsna-dark .chatbox-content-area .chat-content .chat .avatar { background-color: #494949; }
body.hsna-dark.chat-application .chat-content .chat.chat-left .chat-body .chat-message { background-color: #3b3b3b!important; }

.hsna-dark .chatDivisor { color: rgb(255 255 255 / 70%); }

    .hsna-dark .chatDivisor::after,
    .hsna-dark .chatDivisor::before {
        background-color: rgb(255 255 255 / 0%);
    }


/**
 * Mensageria
 */
body.hsna-dark.chat-application .chat-sidebar,
body.hsna-dark.chat-application .card.chat-sidebar.webmsg-content {
    border-right-color: var(--dark-aio-border-color)!important;
}

body.hsna-dark .email-application .content-right .email-app-details .email-scroll-area .email-detail-head .collapse-header .card-header { border-color: var(--dark-aio-border-color); }

body.hsna-dark .dropdown-item:focus,
body.hsna-dark .dropdown-item:hover {
    background-color: var(--dark-aio-table-alt-row);
}

    body.hsna-dark .email-application .content-right .email-app-list-wrapper .email-app-list .email-user-list .users-list-wrapper li.mail-read { background-color: var(--dark-aio-bg-color); }
    body.hsna-dark .email-application .content-right .selected-row-bg { background-color: #292929 !important; }

body.hsna-dark .menuToolbarDivider,
body.hsna-dark .chat-header-icons .divider  {
    background-color: rgb(229 229 229 / 10%);
}

body.hsna-dark .sidebar-left .nav.nav-tabs#tabsAtendimento .nav-item .nav-link.active,
.hsna-dark.chat-application .chat-header-icons .nav.nav-tabs .nav-item .nav-link.active,
.hsna-dark .custom-tab-pill.custom-tab-pill-color.custom-tab-agent .nav.nav-tabs .nav-item .nav-link.active {
    background-color: var(--dark-aio-color-primary);
}

.hsna-dark .btn-toolbar:hover i,
.hsna-dark .btn-toolbar.active i,
.hsna-dark .main-top-menu .list-unstyled .btn-toolbar.active i,
.hsna-dark .main-top-menu .list-unstyled .btn-toolbar.active svg,
body.hsna-dark.chat-application .chat-header-icons .nav.nav-tabs .nav-item .nav-link.active:hover i {
    color: var(--dark-aio-color-white);
}

.hsna-dark .main-top-menu .list-unstyled svg { color: inherit; }

body.hsna-dark .main-top-menu .list-unstyled a:hover i,
body.hsna-dark .main-top-menu .list-unstyled a.btn-toolbar:hover i,
.hsna-dark .header-navbar .navbar-container ul.nav li > a.nav-link:hover {
    color: var(--dark-aio-color-white)!important;
}

.hsna-dark .email-detail-head .card-content .card-body * { color: var(--dark-aio-color-white)!important; }


/**
 * Mensageria - E-mail Sidebar
 */
body.hsna-dark .webmsg-content .email-app-details.show,
.hsna-dark .email-application .content-right .email-app-list-wrapper .email-app-list .email-user-list .users-list-wrapper li .avatar img {
    border: 0;
}


/**
 * Popover
 */
body.hsna-dark .popover {
    box-shadow: 0 0 10px 0 rgb(0 0 0);
}

    body.hsna-dark .popover,
    .hsna-dark .popover .popover-body {
        color: var(--dark-aio-color-white);
    }

body.hsna-dark .popover,
body.hsna-dark .popover .popover-header {
    background-color: var(--dark-aio-bg-color-light);
}

.hsna-dark .email-contacts-popover-line,
.hsna-dark .bs-popover-bottom>.arrow::after,
.hsna-dark .bs-popover-bottom>.arrow::before {
    border-bottom-color: var(--dark-aio-border-color);
}

.hsna-dark .email-contacts-popover-col { color: var(--dark-aio-color-white); }


/**
 * Compromissos
 */
body.hsna-dark #agenda-timeline,
body.hsna-dark table.aio-calendar-table thead,
body.hsna-dark table.aio-calendar-table tbody td,
body.hsna-dark table.aio-calendar-table tbody td.hoje {
    background-color: var(--dark-aio-bg-color-light)!important;
}

body.hsna-dark .hour-marker,
body.hsna-dark table.aio-calendar-table thead th,
body.hsna-dark table.aio-calendar-table tbody td,
.hsna-dark .main-top-menu .list-unstyled li.buttonToolbarRefresh {
    border-color: var(--dark-aio-border-color);
}


body.hsna-dark table.aio-calendar-table tbody tr:hover td {
    background-color: var(--dark-aio-bg-color-light)!important;
}

body.hsna-dark table.aio-calendar-table tbody tr:hover td:hover {
    background-color: var(--dark-aio-calendar-table-hover)!important;
}


body.hsna-dark table.aio-calendar-table tbody td:hover { background-color: var(--dark-aio-calendar-table-hover); }


/**
 * Webfaq
 */
body.hsna-dark .webfaq-area .webfaq-content .webfaq-wrapper .card-body { background-color: var(--dark-aio-bg-color-light); }

body.hsna-dark .sidebar-left .card,
body.hsna-dark .webfaq-area .webfaq-content header,
body.hsna-dark .chatbox-content-area .sidebar-left,
body.hsna-dark .content-layout-sidebar .sidebar-left {
    background-color: var(--black-bg-sidebar-left-color);
}

body.hsna-dark .webfaq-list-group li a,
body.hsna-dark .popover-header i:hover,
body.hsna-dark .webfaq-list-group li a:hover {
    color: var(--dark-aio-color-white);
}

    body.hsna-dark .webfaq-list-group li a { filter: opacity(0.5); }

    body.hsna-dark .popover-header i:hover,
    body.hsna-dark .webfaq-list-group li a:hover,
    .hsna-dark .webfaq-list-group li a.wfaq-list-topic-selected {
        filter: opacity(1.0);
    }

    .hsna-dark .webfaq-list-group li a.wfaq-list-topic-selected { color: var(--dark-aio-color-white)!important; }

body.hsna-dark .webfaq-area .webfaq-content .webfaq-wrapper .card-footer { border-top-color: var(--dark-aio-border-color)!important; }
body.hsna-dark #modalChatContactBody .chat-message-contact-detail:not(:first-child) { border-top-color: var(--dark-aio-border-color); }
body.hsna-dark .webfaq-area .webfaq-content header { border-color: var(--dark-aio-border-color)!important; }
.hsna-dark .faq-search-tags-header::after { background-color: rgba(255 255 255 / 15%); }

/**
 * Auto Gestão
 */
body.hsna-dark .content-area-auto-gestao .sidebar-left {
    background-color: var(--dark-aio-bg-color);
}

body.hsna-dark .content-area-auto-gestao .nav-pills .nav-link.active,
body.hsna-dark .content-area-auto-gestao .content-right .content-body {
    background-color: var(--dark-aio-bg-color-light);
}

    body.hsna-dark .content-area-auto-gestao .bg-light { background-color: var(--dark-aio-bg-color)!important; }

body.hsna-dark .content-area-auto-gestao .nav-pills.rounded-nav .nav-link.active,
body.hsna-dark .custom-tab-pill.custom-tab-pill-color .nav.nav-tabs.rounded-nav .nav-item .nav-link.active {
    background-color: var(--dark-aio-btn-secondary-bg);
}


/**
 * CRM - Kanban
 */
body.hsna-dark .vcrm-categoria-box,
body.hsna-dark div#vcrm-categorias-box>.vcrm-categoria-box {
    background-color: var(--dark-aio-kanban-box-bg-color);
}

body.hsna-dark .vcrm-cliente-box {
    background-color: var(--dark-aio-kanban-item-bg-color);
    box-shadow: 1px 2px 6px 0 rgb(42 42 42);
}

    body.hsna-dark .vcrm-cliente-box:before { background-color: #585858; }

body.hsna-dark .sidebar-body .nav.tabs-line { border-bottom-color: #525252; }

@keyframes changeColorsRedThemeBlack {
    0% { background-color: #ff292b; color: white; }
    50% { background-color: #2d2d2d; color: white; }
    100% { background-color: #ff292b; color: white;}
}

body.hsna-dark .chatMidiaStop {
    animation-name: changeColorsRedThemeBlack;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    border-radius: 6px;
}

body.hsna-dark #boxChatContacts_Waiting .chat_box_transferred.chat_box_holded.waitingChat_NewMessage .chat_line {
    background-color: rgb(0 213 34 / 55%) !important;
    animation: pulse-black-theme 3.5s infinite;
}

/* body.hsna-dark #boxChatContacts_Waiting .chat_box_transferred.chat_box_holded.waitingChat_NewMessage .chat_line,
body.hsna-dark .chat-sidebar>.table-responsive table tbody#boxChatContacts_tabs tr td:has(.webchat-notifications) {
    background-color: rgb(0 213 34 / 55%) !important;
    animation: pulse-black-theme 3.5s infinite;
} */

@keyframes pulse-black-theme {

    0% {
        box-shadow: 0 0 0 0 rgb(0 213 34 / 55%);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(46 190 255 / 0%);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(46 190 255 / 0%);
    }

}