/* .tox-tinymce-aux{
    position:fixed !important;
} */

.paisbtnNEWwebphone{
    left:10px;
    line-height:30px;
    position: absolute;
}
#paisnewwebphonediv{
    left:10px;
    line-height:30px;

}
.chat-content-body .template-buttons{
pointer-events: none;
}
#paisnewwebphonediv .choices__list{
    max-height: 200px;
}
#NO_HAY_NOTISV3 {
    padding-bottom:10px;
    padding-top:10px;
    line-height:25px;
    background: transparent;
}
.bg-yellow{
    background:#FFCA00 !important;
}
.notification-unread{
    background: var(--falcon-card-bg);
    box-shadow: var(--falcon-box-shadow-sm);
}
.iconheadertop{
    font-size: 23px;
}
.notification{
    background: var(--falcon-light);
}
#NO_HAY_NOTISV3 .fa-smile-wink{
    font-size: 40px;
}
/*
.select2-container:not(.sales-lead__content .select2-container){ */

/* .select2-dropdown{
    z-index:99997 !important;
}
.select2-container{
    z-index:99997 !important;

} */
/* .select2-dropdown{
    z-index:99997 !important;
}
.select2-container{
    z-index:99997 !important;

} */

.text-blanco{
    color: white !important;
}
#akititizquierda{
    max-width: calc(100% - 60px);
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    float:left;
}
.btn100workflows{
    width:100%;
    text-align:left;
}
.MENULISPROPIEDADES li{
    cursor:pointer;
    line-height:30px;
    padding-left:10px;
}
.MENULISPROPIEDADES li:hover{
    background: var(--fondoresaltado-color) !important;
}
.fixblockizdesc > .form-group{
    margin-bottom:0px !important;
}
.tour-outline{
    pointer-events: fill !important;
}
.grid-stack-item .apexcharts-menu-icon{
    margin-top:15px;
    margin-right: 25px;
}
.dataTables_filter > label > input{
    margin-top:20px;
    margin-right:20px;
}
.dataTables_paginate{
    margin-right:20px !important;
}
.dataTables_info{
    margin-left:20px !important;
}
.tox{
    z-index:100000 !important;
}
.btnsales-disabled{
    cursor:not-allowed !important;
}
.valignmid{
    vertical-align: middle !important;
}

.fechavencido_SOLOTEXT{
    color: var(--error-color) !important;
    font-weight:bold;
}
.fechavencido2_SOLOTEXT{
    color: var(--error-color) !important;
    font-weight:bold;
}

.fechavencido{
    background: var(--error-color) !important;
    color: var(--white-color);
    padding: 4px 8px;
    border-radius: 0.375rem;
    width:fit-content;
    font-size: var(--font-size-1);
}
.fechavencido2{
    background: var(--error-color) !important;
    color: var(--white-color);
    padding: 4px 8px;
    border-radius: 0.375rem;
    width:fit-content;
    font-size: var(--font-size-1);
}
.padding10px{
    padding:10px;
}
.is-activado{
    background: var(--hover-color) !important;
    cursor:default !important;
}
.is-activado:Hover{
    background: var(--hover-color) !important;
}

/*
 * === ini inbox soyreunion marc===
 */
.soyreunion{
    width:100%;
    padding:0px;
    display: flex;
    flex-flow: row nowrap;
    border:1px solid var(--border-color);
}
.soyreuniondia{
    width:100px;
    height:100%;
    background: var(--bg-secondary-color);
    padding:10px;
}
.soyreunioninfo{
    width: calc(100% - 100px);
    height:100%;
    padding:20px;
}


/*
 * === fin inbox soyreunion marc ===
 */

/*
 * === ini COL DERECHA2020 MARC ===
 */

.tengocolderecha{
    padding-bottom:20px;
    line-height: 32px;
    font-size:13px;
    width:100%;
}
tengocolderecha:last-child {

    padding-bottom:0px !important;
}
.tengocolderechatit{
    font-size: var(--font-size-2);
    font-weight:700;
    width:100%;
    margin-bottom:20px;
}
.tengocolderechatitLINK::before{
    margin-left:10px;
    content: "+ ";
    font-weight:100;
}
.tengocolderechatitLINK,.tengocolderechatitLINK2{
    font-size: var(--font-size-2);
    font-weight:600;
    float:right;
    margin-bottom:20px;
    color: var(--brand-color);
    cursor:pointer;
}
.tengocolderechatitLINK:Hover,.tengocolderechatitLINK2:Hover{
    text-decoration: underline;
}

.infoboxEmp,.tengoderechainfoboxEmp{
    margin-top:5px;
    padding:10px;
    background:var(--white-color);
    border: 1px solid var(--border-strong-color);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);
    margin-top:15px;
}

.infoboxEmp a,.tengoderechainfoboxEmp a{
    color: var(--brand-color);
}
.infoboxEmp a:Hover,.tengoderechainfoboxEmp a:Hover{
    text-decoration:underline;
}

.infoboxEmp:Hover > .btnINFOremove,
.tengoderechainfoboxEmp:Hover > .btnINFOremove{
    display:inline !important;
}
.btnINFOremove{
    float:right;
    margin-top:-3px !important;
    display:none;
    background: var(--input-color) !important;
    padding:5px !important;
    border: 1px solid rgba(0, 75, 236, 0.1) !important;
}

/*
 * === fin COL DERECHA2020 MARC ===
 */

.link{
    color: var(--brand-color) !important;
    cursor:pointer;
}
.link:Hover{
    text-decoration:underline !important;
}
.bold{
    font-weight:bold;
}
/*
 * === ini queues marc ===
 */
.queuesCOLADIVFLOT{
    background: var(--white-color);
    padding-left:20px;
    padding-right:20px;
    padding-top:10px;
    padding-bottom:10px;
    color: var(--text-color);
    position:fixed;
    bottom:0;
    min-height:30px;
    right:300px;
    z-index:1;
    border:1px solid var(--border-color);
    border-radius: 0.75rem 0.75rem 0 0;
    width:400px;
}
.queeetiittt{
    font-size:17px;
    line-height:30px;
}
.queeeuboxx{
    background: var(--hover-color);
    width:100px;
    text-align:right;
    font-size:12px;
    padding-right:5px;
    margin-right:5px;
    position:absolute;
    margin-left:-105px;
}
.queeeuboxxrow{
    font-size:12px;
    margin-bottom:3px;
    line-height:30px;
    overflow:hidden;
    width: calc(100% - 105px);
    height:30px;
    max-height:30px;
    margin-left:105px;
}
/*
 * === fin queues marc ===
 */
/*
 * === INI ANTIGUO INDEX MARC ===
 */

#floatasobretodonotifications > .sidebar-notifications__item{
    border:1px solid var(--white-color);
    border-radius: 0.75rem;
    background: var(--brand-color);
    color: var(--white-color);
    box-shadow: 5px 5px 2px 1px rgba(255, 255, 255, 0.2);
}

#floatasobretodonotifications button{
    background: var(--white-color) !important;
}
.js-sidebar-notifications-body::-webkit-scrollbar{
    width: 14px;
    height:14px;
}
.js-sidebar-notifications-body::-webkit-scrollbar-thumb{
    background: var(--scrolldark-color);
}
.sidebar-notifications__item-meta > button{
    background: var(--input-color) !important;
}
.sidebar-notifications__item-meta > button:Hover{
    opacity:0.9;
}
.error_reconectandoFLOTANTE{
    position:fixed;
    z-index:99999999999999;
    left:0;
    top:0;
    width:100%;
    height:100%;
    color: var(--falcon-input-color) !important;
    background-color: var(--datalyse-backgroud-color);
    opacity:0.7;
    user-select:none;
}
.error_reconectandoFLOTANTEDOS{
    position:fixed;
    z-index:var(--zIndex-5);
    left:0;
    top:0px;
    width:100%;
    height:100%;
    background-color: var(--datalyse-backgroud-color);
}
.error_reconectandoFLOTANTETRES{
    position:fixed;
    z-index:var(--zIndex-5);
    left:0;
    top:0px;
    width:100%;
    min-width:100%;
    height:100%;
    min-height:100%;
    background-color: var(--datalyse-backgroud-color);
    text-align:center;
}
.divflotante{
    left:210px;
    top:10px;
    position:fixed;
    z-index:999999999;

}

.overflowyhidden{
    overflow-y: hidden !important;
}

/*
* === FIN ANTIGUO INDEX MARC ===
*/
/*
* === INIDE MARC ===
*/

/*body{*/
/*    letter-spacing: 0.02em;*/
/*}*/
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--border-color);
    -webkit-transition: .4s;
    transition: .4s;
}
.slider.round{
    height:unset;
    width:unset;
    border-radius: 0.75rem;
}
.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: var(--white-color);
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: var(--brand-color);
}

input:focus + .slider {
    box-shadow: 0 0 1px var(--brand-color);
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}


.divdentrodestage{
    margin: auto;
    margin-top:10%;max-width:700px
}
.textdentrodestage{
    width: calc(100% - 220px);display:block;margin-top:40px;
}
.textdentrodestage h1{
    font-size: 1.4em;font-weight: 600;line-height:2em;margin-bottom:10px;
}
.textdentrodestage h2{
    font-size: 1.2em;font-weight: 400;line-height:1.2em;
}
.imagendentrodestage {
    width: 200px;display:block;padding-left:20px;
}
.imagendentrodestage img{
    max-width:200px;
}

.dropdown-menu-notification{
    min-width: 22rem !important;
    max-width: 22rem !important;
}
.navbar .dropdown-menu-notification.dropdown-menu-end:after{
    right: 3.55rem !important;
}
.navbar .dropdown-menu-notification.dropdown-menu-end{
    right: -3rem !important;
}

@media (max-width: 800px) {
.phone--opened{
    width:95% !important;
    margin-right:2% !important;
    margin-bottom:2% !important;
}
.phone, .phone__header{
    border-radius: 1rem 1rem 0 0 !important;
}
}
@media (max-width: 900px) {
    /* #send-email-modal-fullscreen{
        display:none !important;
    } */
    .textdentrodestage{
        width:100%;
    }
    .imagendentrodestage{
        width:100%;
        margin:auto;
        text-align:center;
    }
    .imagendentrodestage img{
        margin:auto;
        text-align:center;
        max-width:50%;
    }
}

/*
 * === FIN DE MARC ===
 */

/*
* === UTILITIES ===
*/
.module__nav::-webkit-scrollbar{
    width: 7px;
    height:7px;
}


.u-clearfix::after {
    clear: both;
    content: "";
    display: table;
}

/*
 * === LAYOUT ===
 */
/* *, *::after, *::before {
    box-sizing: border-box;
} */


a {
    color: inherit;
    text-decoration: none;
}

a svg {
    pointer-events: none;
}

input {
    font-family: inherit;
    background-color: transparent;
}

button {
    font-family: inherit;
}

button svg {
    pointer-events: none;
}

.control {
    display: block;
    position: relative;
    cursor: pointer;
}

.control input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.control__indicator {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background: var(--fondodestaca-color);
    border-radius: 0.75rem;
}

.control input:checked ~ .control__indicator {
    background: var(--brand-color);
}

.control__indicator:after {
    content: '';
    position: absolute;
    opacity: 0;
}

.control input:checked ~ .control__indicator:after {
    opacity: 1;
}
.cursor-grab{
    cursor: grab;
}
.cursor-grabbing{
    cursor: grabbing;
}
.control--checkbox {
    height: 20px;
    /* border: 1px solid #dee3e8; */
    width: 20px;
    border-radius: 0.375rem;
}

.control--checkbox .control__indicator:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: scale(0) rotate(45deg);
    transform-origin: center;
    transition: all 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
}

.control--checkbox input:checked ~ .control__indicator:after {
    transform: scale(1) rotate(45deg);
}

.control--radio {
    height: 20px;
    width: 20px;
}

.control--radio .control__indicator {
    background: var(--white-color);
    border: 2px solid var(--border-color);
    border-radius: 100%;
}

.control--radio:hover .control__indicator {
    background: rgba(0, 0, 0, 0.03);
}

.control--radio input:checked ~ .control__indicator {
    background: var(--white-color);
    border-color: var(--brand-color);
}

.control--radio .control__indicator:after {
    left: 3px;
    top: 3px;
    width: 10px;
    height: 10px;
    background: var(--brand-color);
    border-radius: 100%;
    transform: scale(0) rotate(45deg);
    transform-origin: center;
    transition: all 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
}

.control--radio input:checked ~ .control__indicator:after {
    transform: scale(1) rotate(45deg);
}



.btn__icon {
    position: relative;
    display: inline-block;
    width: 17px;
    height: 17px;
    vertical-align: middle;
}

.btn--disabled {
    cursor:not-allowed;
    box-shadow: none;
    opacity: .5;
    pointer-events: none;
}

.btn-plain {
    background: 0 0;
    margin: 0;
    padding: 0;
    border: none;
    cursor: pointer;
    box-shadow:none !important;
    border:none !important;
    color: var(--accent-color);
}

.btn-plain:Hover{
    background: 0 0 !important;
}
.btn-plain:focus {
    outline: 0;
}

.btn-plain svg {
    vertical-align: middle;
}


.btn-action.success::after {
    content: "";
    position:absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 20px;
    height: 20px;
    background-image: url("/images/success-tick.png");
    background-repeat: no-repeat;
}

@keyframes btn-action-busy {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.btn-action.is-success {
    position: relative;
    color: transparent;
    background: var(--success-color) !important;
    border-color: var(--success-color) !important;
    transition: background-color 0.2s ease;
    pointer-events: none;
    user-select: none;
}

.btn-action.is-success::after {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='#ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
}

.btn-action.is-errored {
    position: relative;
    color: transparent;
    background: var(--error-color) !important;
    border-color: var(--error-color) !important;
    transition: background-color 0.2s ease;
    pointer-events: none;
    user-select: none;
}

.btn-action.is-errored::after {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='#ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
}

.btn-group {
    display: flex;
    flex-flow: row nowrap;
}

.btn-group > .btn {
    margin: 0 !important;
}

.btn-group > .btn:first-child  {
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/*.btn-group > .btn:not(:last-child):not(:first-child) {*/
/*    border-radius: 0;*/
/*}*/

.btn-group > .btn:last-child  {
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/*
 * === FORM ===
 */
.input-container,.select-container,.textarea-container {
    position: relative;
    display: block;
    width: 100%;
    color: var(--text-color);
    background-color: transparent !important;
    border: none;
    border-radius: 0.75rem;
    margin-bottom: 20px;
}

.textarea-container{
    height:auto;
    padding-bottom:0px;
    background: none !important;
}
.textarea-container textarea {
    font-size: var(--font-size-2);
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    height: 160px;
    color: var(--text-color);
    padding: 10px 14px;
    background-color: var(--white-color);
    background-clip: padding-box;
    border: 1px solid var(--border-strong-color);
    border-radius: 0.75rem;
    box-shadow: none;
    outline: none;
    transition: border-color .15s ease-in-out;
}
.textarea-container textarea:focus {
    border-color: var(--brand-color);
}

.input {
    width: 100%;
    box-sizing: border-box;
    line-height: 1.5;
    font-size: var(--font-size-2);
    min-height: 38px;
    color: var(--text-color);
    background-color: var(--falcon-input-bg);
    margin: 0px;
    border: 1px solid var(--border-strong-color);
    border-radius: 0.75rem;
    padding: 7px 12px;
    text-overflow: ellipsis;
    box-shadow: none;
    transition: border-color .15s ease-in-out;
}
.input:focus {
    border-color: var(--brand-color);
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1);
    outline: none;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.textarea-container textarea,.input-container input,.select-container select, .modal .menu-wrapper.is-select{
    display: block;
    width: 100%;
    padding: 7px 12px;
    font-size: var(--font-size-2);
    font-weight: 400;
    line-height: 1.5;
    min-height: 38px;
    box-sizing: border-box;
    color: var(--text-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--falcon-input-bg);
    background-clip: padding-box;
    border: 1px solid var(--border-strong-color);
    border-radius: 0.75rem;
    box-shadow: none;
    transition: border-color .15s ease-in-out;
    outline: none;
}
.textarea-container textarea {
    min-height: 80px;
}
.input-container input:focus,
.select-container select:focus,
.modal .menu-wrapper.is-select:focus-within {
    border-color: var(--brand-color);
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1);
}

/* === Unified Bootstrap .form-control override === */
.modal .form-control input,
.modal .form-control select,
.modal .form-control textarea,
.modal input.form-control,
.modal select.form-control,
.modal textarea.form-control {
    padding: 7px 12px;
    font-size: var(--font-size-2);
    line-height: 1.5;
    min-height: 38px;
    box-sizing: border-box;
    color: var(--text-color);
    background-color: var(--falcon-input-bg);
    border: 1px solid var(--border-strong-color);
    border-radius: 0.75rem;
    box-shadow: none;
    transition: border-color 0.2s;
    outline: none;
}
.modal input.form-control:focus,
.modal select.form-control:focus,
.modal textarea.form-control:focus {
    border-color: var(--brand-color);
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1);
}
.modal .menu-wrapper.is-select, .modal .form-group {
    margin-bottom: 20px;
}
.menu-wrapper.is-select svg,.select2-selection__arrow {
    opacity: 0.5;
    filter: none;
}

.CHATADMnoatendida{
    background-color: var(--hover-color);
}
.hover-item-link div{
    color: var(--datalyse-text-title) !important;
    font-weight: bold !important;
    padding-left: 10px;
    animation: 1s padding;
}

@keyframes padding {
    0% {
        padding-left: 0px;
    }
    100% {
        padding-left: 10px;
    }
}

.choices__inner{
    margin:0px !important;
    padding: 4px 4px 4px 10px !important;
    border-radius: 0.75rem !important;
    box-shadow:none !important;
    min-height: 38px !important;
    box-sizing: border-box !important;
    color: var(--text-color) !important;
    background-color: var(--falcon-input-bg) !important;
    border: 1px solid var(--border-strong-color) !important;
    font-size: var(--font-size-2) !important;
    transition: border-color 0.2s;
}
.select-container select::-ms-expand {
    display: none;
}
.select2-container--default .select2-selection--single{
    box-shadow:none !important;
    border: 1px solid var(--border-strong-color) !important;
    border-radius: 0.75rem !important;
    background-color: var(--falcon-input-bg) !important;
    min-height: 38px !important;
    display: flex !important;
    align-items: center;
    padding: 0 12px !important;
    font-size: var(--font-size-2);
    transition: border-color 0.2s;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 0 !important;
    line-height: 1.5 !important;
    color: var(--text-color);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    top: 0 !important;
    right: 8px !important;
}
.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--brand-color) !important;
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1) !important;
}
.select2-container, .select2{
    width:100% !important;
}

/* Select2 dark theme support */
[data-bs-theme="dark"] .select2-container--default .select2-selection--multiple,
[data-bs-theme="dark"] .select2-container--default .select2-selection--single {
    background-color: var(--falcon-input-bg) !important;
    border-color: var(--border-strong-color) !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--bs-primary);
    color: #fff;
    border-color: var(--bs-primary);
}
[data-bs-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: rgba(255,255,255,0.7);
}
[data-bs-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #fff;
}
[data-bs-theme="dark"] .select2-dropdown {
    background-color: var(--falcon-input-bg);
    border-color: var(--border-strong-color);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-results__option {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--bs-primary);
    color: #fff;
}
[data-bs-theme="dark"] .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: rgba(var(--bs-primary-rgb), 0.2);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-results__option[aria-disabled="true"] {
    color: var(--bs-secondary-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--falcon-input-bg);
    border-color: var(--border-strong-color);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--bs-secondary-color);
}
[data-bs-theme="dark"] .select2-search__field {
    color: var(--bs-body-color) !important;
}
/* End Select2 dark theme support */

/* Choices.js dark theme support */
[data-bs-theme="dark"] .choices__inner {
    background-color: var(--falcon-input-bg) !important;
    border-color: var(--border-strong-color) !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .choices__list--dropdown,
[data-bs-theme="dark"] .choices__list[aria-expanded] {
    background-color: var(--falcon-input-bg) !important;
    border-color: var(--border-strong-color) !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .choices__list--dropdown .choices__item,
[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .choices__list--dropdown .choices__item--selectable.is-highlighted,
[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
}
[data-bs-theme="dark"] .choices__list--dropdown .choices__item--selectable:hover {
    background-color: rgba(var(--bs-primary-rgb), 0.15);
}
[data-bs-theme="dark"] .choices__input,
[data-bs-theme="dark"] .choices__input--cloned {
    background-color: transparent !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .choices__placeholder {
    color: var(--bs-secondary-color) !important;
    opacity: 1;
}
[data-bs-theme="dark"] .choices[data-type*="select-one"] .choices__inner {
    background-color: var(--falcon-input-bg) !important;
}
[data-bs-theme="dark"] .choices[data-type*="select-one"] .choices__input {
    background-color: var(--falcon-input-bg) !important;
    border-bottom-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .choices__list--multiple .choices__item {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    color: #fff !important;
}
[data-bs-theme="dark"] .choices__list--multiple .choices__button {
    border-left-color: rgba(255,255,255,0.3);
    filter: brightness(2);
}
[data-bs-theme="dark"] .choices.is-disabled .choices__inner {
    background-color: rgba(var(--bs-body-bg), 0.5) !important;
}
/* End Choices.js dark theme support */

/* Choices.js multi-select tags */
.choices__list--multiple .choices__item {
    background-color: var(--hover-color) !important;
    border-color: var(--border-strong-color) !important;
    color: var(--text-color) !important;
    border-radius: 0.5rem !important;
    padding: 2px 8px !important;
    font-size: 13px !important;
    margin: 2px !important;
}
.choices__list--multiple .choices__item .choices__button {
    border-left-color: var(--border-strong-color);
}

/* Choices.js dropdown modernization */
.choices__list--dropdown,
.choices__list[aria-expanded] {
    border: 1px solid var(--border-strong-color) !important;
    border-radius: 0.75rem !important;
    background-color: var(--white-color) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}
.choices__list--dropdown .choices__item,
.choices__list[aria-expanded] .choices__item {
    padding: 6px 10px;
    border-radius: 0.5rem;
    margin: 2px 4px;
    transition: background 0.15s;
}
.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background-color: var(--hover-color) !important;
    color: var(--text-color) !important;
}

.select-container select{
    outline:none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.select-container:after {
    content: '>';
    font: 15px "Consolas", monospace;
    color: var(--brand-color);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    top:6px;
    right: 15px;
    margin-top:2px;
    padding: 0 0 2px;
    position: absolute;
    pointer-events: none;
}


.checkbox-container input[type="checkbox"]{
    margin-right:5px;
}
.input-container input[disabled] {

    cursor:not-allowed;
    color: var(--text-muted-color);
    opacity: 0.6;
}

.input-container input ~ svg {
    position: absolute;
    top: 7px;
    right: 10px;
    width: 16px;
    height: 16px;
    opacity: 0;
    pointer-events: none;
    margin-top:3px;

}
.input-container input:not([disabled]):hover ~ svg {
    opacity: 0.5;
}


/*
 * === MENU ===
 */

.menu-wrapper {
    position: relative;
    display: inline-flex;
}

.menu-wrapper .menu {

    color: var(--accent-color);
    background-color: var(--white-color);
    border: 1px solid var(--border-strong-color);

    position: absolute;
    top: 40px;
    right: 0;
    padding: 6px;
    border-radius: 0.75rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    pointer-events: none;
    opacity: 0;
    transform: translateY(-10px);
    transform-origin: 100% 0;
    transition:
            transform 0.2s cubic-bezier(0.1, 0.82, 0.25, 1),
            opacity 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
    z-index: var(--zIndex-5);
}

.menu-wrapper .menu--left {
    left: 0;
    right: initial;
}

.menu-wrapper .menu.is-visible {
    pointer-events: auto;
    opacity: 1;
    transform: none;
}


.menu-wrapper.is-select > button {
    position: relative;
    color: var(--text-color);
    background-color: var(--falcon-input-bg) !important;
    padding: 7px 35px 7px 12px;
    text-align: left;
    width: 100%;
    min-height: 38px;
    box-sizing: border-box;
    font-size: var(--font-size-2);
    line-height: 1.5;
    border-radius: 0.75rem;
    border: 1px solid var(--border-strong-color);
    transition: border-color 0.2s;
}
.menu-wrapper.is-select > button:focus,
.menu-wrapper.is-select > button:focus-within {
    border-color: var(--brand-color);
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1);
}

.menu-wrapper.is-select > button span {
    position: relative;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.optioniluminado{
    background: var(--hover-color) !important;
}
.optionuhidden{
    opacity: 0 !important;
    max-height:0px !important;
    z-index:-10 !important;
}
.menusearchmarcc{
    position: -webkit-sticky !important;
    position: sticky !important;
top: -50px !important;
width: auto !important;
background-color: var(--input-color) !important;
height:50px !important;
margin-top: -50px !important;
z-index: 1;
}

.menusearchmarccinput {
    width: 92%;
    margin-left: 4% !important;
    padding: 6px 10px !important;
    box-sizing: border-box;
    line-height: 1.5;
    font-size: var(--font-size-2);
    min-height: 34px;
    color: var(--text-color) !important;
    background-color: var(--hover-color);
    margin: 0px;
    border: 1px solid var(--border-strong-color);
    outline: 0 !important;
    border-radius: 0.75rem;
    text-overflow: ellipsis;
    transition: border-color 0.2s;
}
.menusearchmarccinput::placeholder {

    color: var(--text-color) !important;
}
.menusearchmarccinput:focus {
    border-color: var(--brand-color);
    box-shadow: 0 0 0 3px rgba(93, 135, 255, 0.1);
}

.menusearchmarccmenu{
    padding-top:50px !important;
}
.menu-wrapper.is-select > button svg {
    position: absolute;
    top: 0;
    right: 0;
    margin: 10px;
}

.menu-wrapper .menu--select {
    top: initial;
    width: 100%;
    border-top: none;
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.menu-wrapper .menu.is-bottom-aligned {
    top: initial;
    z-index: 99998 !important;
    max-height:200px;
    overflow-y:auto;
    overflow-x:hidden;
}
.menu-wrapper .menu.estabottom {
    bottom:40px;
}

.menu-wrapper.is-select .menu.is-bottom-aligned {
    color: var(--accent-color);
    background-color: var(--input-color);
    border: 1px solid var(--border-strong-color);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);

    border-radius: 0.75rem;
}

.menu-wrapper .menu > li {
    position: relative;
    display: flex;
    align-items: center;
}

.menu-wrapper .menu-option {
    display: block;
    width: 100%;
    height: 36px;
    color: var(--text-color);
    background: transparent;
    border: 0;
    overflow-x: hidden;
    padding: 0 10px;
    position: relative;
    font-size: var(--font-size-1);
    line-height: 36px;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
    user-select: none;
    border-radius: 0.5rem;
    transition: background 0.15s;
}

.menu-wrapper .menu-option:hover,
.menu-wrapper .menu-option:focus {
    background: var(--hover-color);
    outline: 0;
}

.menu-wrapper .menu-option svg {
    vertical-align: middle;
}

.menu-wrapper .menu.menu--select .menu-option {
    padding-left: 30px;
}

.menu-wrapper .menu.menu--select .menu-option.is-selected:before {
    border-bottom: 2px solid var(--brand-color);
    border-right: 2px solid var(--brand-color);
    bottom: 0;
    content: "";
    height: 12px;
    left: 14px;
    margin: auto;
    position: absolute;
    top: -2px;
    transform: rotate(45deg);
    width: 6px;
}

/*
 * === TABLE ===
 */
.table-list {
    display: flex;
    flex-direction: column;
    margin: 0;
    min-height: 0;
    user-select: none;
    border: 1px solid var(--border-strong-color);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);
    border-radius: 0.75rem;
}

.table-list--full-height,
.table-list--full-height .table-list__wrapper {
    flex: 1 1 0;
    height: 100%;
}

.table-list__body {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
    padding-left:0px;
}

.table-list__wrapper {
    display: flex;
    flex-flow: column nowrap;
}

.table-list__header {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    flex-flow: row nowrap;
    height: 36px;
    min-height: 36px;
    flex-basis: 36px;
    line-height: 35px;
    background: var(--white-color);
    border-bottom: 1px var(--border-strong-color);
    box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);
    z-index: 1;
}

.table-list--full-height .table-list__header {
    padding-right: var(--spacing-1);
}

.table-list.is-scrolling .table-list__header {
    box-shadow: 0 4px 6px -2px rgba(0,0,0,.04);
}

.table-list__header-item {
    display: flex;
    align-items: center;
    font-size: var(--font-size-1);
    color: var(--text-muted-color);
}

.table-list-country,
.table-list-email,
.table-list-status,
.table-list-number,
.table-list-agent,
.table-list-type,
.table-list-date {
    flex: 1 0 10px;
    margin: 0 10px;
    min-width: 65px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-list-icon {
    display: flex;
    align-items: center;
    flex: 0;
    flex-basis: 50px;
    justify-content: center;
    min-width: 50px;
    text-align: center;
    width: 50px;
    position: relative;
}

.table-list-name {
    flex: 1 1 80%;
    display: flex;
    margin-right: 10px;
    min-width: 150px;
}

.table-list-country {
    flex: 0 0 15%;
    min-width: 125px;
}

.table-list-email {
    flex: 0 0 15%;
    min-width: 150px;
}

.table-list-status {
    flex: 0 0 15%;
    min-width: 180px;
}
.table-list-status div{
    text-align: center;
}
.table-list-number {
    flex: 0 0 10%;
    min-width: 80px;
}

.table-list-date {
    flex: 0 0 15%;
    min-width: 180px;
}

.table-list-agent {
    flex: 0 0 15%;
    min-width: 180px;
}

.table-list-type {
    flex: 0 0 15%;
    min-width: 180px;
}

.table-list-actions {
    display: flex;
    flex: 0;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
    text-align: right;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    padding-left: 8px;
    padding-right: 8px;
    opacity: 0;
}

.table-list__item--selected .table-list-actions,
.table-list__item:hover .table-list-actions {
    min-width: auto;
    background: var(--hover-color);
    opacity: 1;
    transition: opacity .25s;
}

.table-list-actions > .btn {
    display: block;
    /*background-color: transparent !important;*/
}

.table-list-actions > .btn:first-child {
    margin-left: 0;
}

.table-list__item .table-list-actions::before {
    content: "";
    position: absolute;
    left: -15px;
    top: 0;
    bottom: 0;
    width: 15px;
    background: var(--botonmastabla-gradient);
    opacity: 0;
}

.table-list__item:hover .table-list-actions::before,
.table-list__item--selected .table-list-actions::before {
    opacity: 1;
}

.table-list__item {
    position: relative;
    flex: 0 0 auto;
    width: 100%;
    height: 35px;
    line-height: 35px;
    margin-top: -1px;
    color: var(--accent-color);
    background: var(--white-color);
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    overflow: hidden;
    cursor: pointer;
}

.table-list__item--selected,
.table-list__item:hover {
    background: var(--hover-color);
}

.table-list__item::before {
    content: "";
    background: var(--brand-color);
    bottom: -1px;
    left: 0;
    position: absolute;
    top: -1px;
    width: 2px;
    transform: translateX(-2px);
    transition: transform 0.2s ease;
}

.table-list__item--selected::before {
    transform: translateX(0);
}

.table-list__item-wrapper {
    display: flex;
    justify-content: space-between;
    width: 100%;
    min-height: 100%;
}

.table-list-context-menu {
    padding: 0 7px;
}

/* - TABLE ITEM SKELETON - */
.table-list__item--skeleton {
    pointer-events: none;
}

.table-list__item--skeleton  .table-list__item-wrapper > div {
    display: flex;
    align-items: center;
}

.table-list__item--skeleton  .table-list__item-wrapper > div:not(:first-child)::before {
    content: "";
    display: flex;
    align-self: center;
    width: 100%;
    height: 15px;
    animation-duration: 2.5s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: tableItemSkeletonShimmer;
    animation-timing-function: linear;
    background: var(--hover-color);
    background: linear-gradient(to right,  var(--hover-color) 8%, var(--falcon-popover-border-color) 88%, var(--white-color) 93%);
    background-size: 800px 104px;
    border-radius: 0.75rem;
}

@keyframes tableItemSkeletonShimmer {
    0%{
        background-position: -800px 0;
    }
    100%{
        background-position: 800px 0;
    }
}

/*
 * === SIDEBAR ===
 */


.module__notifications {
    padding: 0 var(--spacing-1);
}

.module__notifications-button {
    position: relative;
    color: var(--white-color);
}

.module__notifications-count {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 23px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-05);
    background: var(--red-color);
    border: 2px solid var(--brand-color);
    border-radius: 50%;
}

/*
 * === SIDEBAR NOTIFICATIONS ===
 */
.sidebar-notifications {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 340px;
    height: 100%;
    /*background: #f4f8f9;*/
    background: var(--fondodestaca-color);
    box-shadow: 0px 0px 12px 3px rgba(0, 0, 0, 0.15);
    opacity: 0;
    will-change: transform;
    transform: translateX(340px);
    transition:
            opacity 0.4s cubic-bezier(0.1, 0.82, 0.25, 1),
            transform 0.4s cubic-bezier(0.1, 0.82, 0.25, 1);
    z-index: var(--zIndex-3);
}

.sidebar-notifications.is-opened {
    opacity: 1;
    transform: translateX(0);
    transition:
            opacity 0.2s cubic-bezier(0.1, 0.82, 0.25, 1),
            transform 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
}

.sidebar-notifications__inner {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    width: 100%;
    height: 100%;
}

.sidebar-notifications__header {
    display: flex;
    flex: 0 0 auto;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    line-height: 20px;
    padding: var(--spacing-2) var(--spacing-1);
    border-bottom: 1px solid var(--border-strong-color);
    user-select: none;
}

.sidebar-notifications__header-title {
    font-size: var(--font-size-2);
    text-transform: uppercase;
}

.sidebar-notifications__header-buttons {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
}

.sidebar-notifications__header-buttons > .btn-plain {
    font-size: var(--font-size-2);
    margin-left: var(--spacing-1);
}

.sidebar-notifications__header-buttons > .btn-plain::after {
    top: 0;
}

.sidebar-notifications__body {
    position: relative;
    overflow: hidden;
    overflow-y: auto;
}

.sidebar-notifications__item {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
    padding: var(--spacing-1) var(--spacing-1);
    border-bottom: 1px solid var(--border-strong-color);
    cursor: pointer;
}

.sidebar-notifications__item-overlay {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    opacity: 0;
    transition: all 0.2s ease;
    pointer-events: none;
}

.sidebar-notifications__item:hover .sidebar-notifications__item-overlay {
    opacity: 1;
    background: rgba(0, 0, 0, 0.03);
}

.sidebar-notifications__item-title {
    font-size: var(--font-size-2);
    font-weight: 600;
    max-width: 90%;
    line-height: 20px;
    text-overflow: ellipsis;
    text-transform: uppercase;
    overflow: hidden;
}

.sidebar-notifications__item-meta {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-end;
    font-size: var(--font-size-1);
    margin-top: var(--spacing-05);
}

.hiddenoverhover {
    display: none;
}

.sidebar-notifications__item:hover > .hiddenoverhover {
    display: inline !important;
}
.sidebar-notifications__item:hover > div >.hiddenoverhover {
    display: inline !important;
}

.sidebar__nav-item--notifications.is-unread .sidebar__nav-item--notifications__count {
    transform: scale(1);
}

.sidebar__nav-item--notifications.is-unread > a svg {
    transform-origin: 50% 50%;
    animation-name: bell-ring;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    color:red;
}

@keyframes bell-ring {
    0% { transform: rotate(0deg); }
    10% { transform: rotate(10deg); }
    20% { transform: rotate(-10deg); }
    30% { transform: rotate(10deg);
        color:orange; }
    40% { transform: rotate(-10deg);}
    50% { transform: rotate(0deg);
        color:red;}
}

.sidebar__nav-item--notifications.is-unread > a::after {
    transform: scale(1);
}

.sidebar-notifications__item.is-unread::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 8px;
    height: 8px;
    margin: 20px 15px;
    background: var(--brand-color);
    border-radius: 50%;
}

.sidebar-notifications__item-badge {
    position: relative;
    width: 20px;
    height: 20px;
    font-size: var(--font-size-05);
    line-height: 20px;
    text-align: center;
    text-transform: uppercase;
    color: var(--white-color);
    margin-right: var(--spacing-05);
    background: var(--accent-color);
    border-radius: 50%;
}

.sidebar-notifications__item.is-lead .sidebar-notifications__item-badge {
    background: var(--brand-color);
}

.sidebar-notifications__item.is-missed-call .sidebar-notifications__item-badge {
    background: var(--error-color);
}

/*
 * === MODULE ===
 */
.module {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    padding-left: 70px;
    background: var(--module-color);
    box-sizing: border-box;
    will-change: padding;
    transition:
            padding .2s ease;
}

.module__inner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

/* - MODULE HEADER - */
.module__header {
    position: relative;
    display: flex;
    flex-direction: row;
    padding: var(--spacing-3);
}

.module__header--assisted {
    padding-bottom: var(--spacing-1);
}

.module__header-title {
    font-size: 1.53125rem;
    color:var(--bs-heading-color);
}

.module__header-right {
    margin-left: auto;
}

/* - MODULE NAV - */
.module__nav {
    position: relative;
    top: 0;
    align-items: center;
    flex-direction: row;
    padding: 0 var(--spacing-3);
    color: var(--text-color);
    overflow-x: auto;
    z-index: var(--zIndex-1);
}

.module__nav-item {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-2);
    line-height: 1.2;
    padding: 15px 10px;
    min-width: 70px;
    text-transform: uppercase;
    opacity: 0.7;
    cursor: pointer;
}


.module__nav-item:hover,
.module__nav-item--active {
    opacity: 1;
}


.module__nav-item > .feather {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

.module__nav-item--right {
    margin-left: auto;
}

.module__nav--slide-down {
    animation: module-nav--slide-down .2s cubic-bezier(0.1, 0.82, 0.25, 1) forwards;
}

@keyframes module-nav--slide-down {
    0% {
        transform: translateY(-15px);
    }

    100% {
        transform: translateY(0px);
    }
}

/* - MODULE STATE - */
.module-state {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.module-state__title {
    font-size: 130pt;
    opacity: 0.4;
    transform: rotate(90deg);
}

.module-state__description {
    font-size: 13pt;
    opacity: 0.4;
}

.module-spinner {
    display: flex;
    /** Avoid animation flickering */
    transform: translate3d(0, 0, 0);
    user-select: none;
}

.module-state > .module-spinner,
.module-state.is-errored > .module-spinner + span {
    /**
     * Move the spinner left
     * the width of the sidebar.
    transform: translateX(-40px) translate3d(0, 0, 0);
     */
     font-weight:bold;
}

.module-spinner > div {
    display: inline-flex;
    width: 1rem;
    height: 1rem;
    margin: 3rem 0.3rem;
    background: var(--brand-color);
    border-radius: 50%;
    /** Avoid animation flickering */
    transform: translate3d(0, 0, 0);
    animation: module-spinner 0.6s ease infinite alternate;
}

.module-spinner > div:nth-child(2) {
    animation-delay: 0.2s;
}

.module-spinner > div:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes module-spinner {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0.1;
        transform: translateY(-1rem);
    }
}

.module-spinner--small > div {
    width: 0.7rem;
    height: 0.7rem;
}

.module-spinner--white > div {
    background: var(--white-color);
}

/* - MODULE CONTENT - */
.module__content {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.module__content--padded {
    padding: var(--spacing-3);
}

.module__content--full-height {
    height: 100%;
    overflow: hidden;
}

.module__header--assisted ~ .module__content--full-height {
    height: calc(100% - 134px);
    padding-bottom: var(--spacing-6);
}

.module__content--full-height .row {
    height: 100%;
}

/* - MODULE NOTIFICATIONS - */
.module__notifications {
    padding: 0 var(--spacing-1);
}

.module__notifications-button {
    position: relative;
    color: var(--white-color);
}

.module__notifications-count {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 23px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-05);
    background: var(--red-color);
    border: 2px solid var(--brand-color);
    border-radius: 50%;
}

/* - MODULE ACTIONBAR - */
.actionbar {
    display: flex;
    flex: 0 0 auto;
    flex-direction: row;
    align-items: center;
    margin-bottom: var(--spacing-1);
}

.actionbar--footer {
    margin-top: var(--spacing-1);
    margin-bottom: 0;
}

.actionbar .btn {
    height: 35px;
    line-height: 15px;
    margin: 0 0 0 10px;
}

.actionbar > .btn:first-child {
    margin-left: 0;
}

.actionbar__left {
    position: relative;
    flex: 2 1 auto;
}

.actionbar__search {
    position: relative;
    max-width: 520px;
    min-width: 0;
}

.actionbar__search-buttons {
    position: relative;
    top: -1px;
    display: flex;
    align-items: center;
    flex-direction: row;
}

.actionbar__search-filter-btn {
    height: 100%;
    padding-left: 3px;
    padding-right: 5px;
    opacity: 0.5;
    color: var(--text-color);
}

.actionbar__search-filter-btn:hover {
    opacity: 0.9;
}

.actionbar__search-search-btn {
    height: 100%;
    padding-left: 3px;
    padding-right: 8px;
    color: var(--text-color);
}

.actionbar__search-wrapper {
    position: relative;
    display: flex;
    flex-direction: row;
    height: 35px;
    line-height: 35px;
    background: var(--hover-color);
    border: 1px solid var(--border-strong-color);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    border-radius: 0.75rem;
}

.actionbar__search-wrapper input {
    font-size: var(--font-size-2);
    color: var(--accent-color);
    border: none;
    padding: 8px;
    flex: 1;
    width: 100%;
    background: transparent;
    appearance: none;
}

.actionbar__search-wrapper input[type=search]::-webkit-search-cancel-button {
    display: none;
}
.actionbar__search-wrapper input[type=search] {
    line-height: 100% !important;
}

.actionbar__search-wrapper input:focus {
    outline: 0;
}

.actionbar__search .filter-wrapper {
    position: absolute;
    width: 100%;
    background: var(--bs-body-bg);
    max-height:500px;
    overflow-y:auto;
    border: 1px solid var(--border-strong-color);
    border-radius: 0.375rem;
    box-shadow: 0 2px 6px 0 rgba(0,0,0,.1);
    display: none;
    line-height: 20px;
    margin-top: 5px;
    overflow:auto;
    padding: var(--spacing-1) var(--spacing-3) var(--spacing-3);
    z-index: var(--zIndex-4);
}
.actionbar__search .filter-wrapper::-webkit-scrollbar{
    width: 14px;
    height:14px;
}
.actionbar__search .filter-wrapper::-webkit-scrollbar-thumb{
    background: var(--scrolldark-color);
}

.actionbar__search .filter-wrapper.is-visible {
    display: block;
}

.actionbar__search .filter__label {
    display: block;
    font-size: var(--font-size-1);
    margin-left: var(--spacing-05);
    margin-bottom: var(--spacing-05);
}

.actionbar__search .filter__section {
    display: block;
    margin-bottom: 20px;
}

.actionbar__search .filter__section:last-child {
    margin-bottom: 0;
}

.actionbar__search .filter-wrapper .menu-wrapper > button {

    border: 1px solid var(--datalyse-input-white) !important;
    background: var(--datalyse-input-white);
    border-radius: 0.75rem;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.1);
    line-height: 32px;
    padding-left: 10px;
    text-align: left;
    transition: border-color .1s;
    width: 100%;
}

.actionbar__search .filter-wrapper .menu-option {
    font-size: var(--font-size-1);
}

.actionbar__buttons {
    display: inline-flex;
}

.actionbar__buttons--hidden {
    opacity: 0.5;
    pointer-events: none;
}

.actionbar__buttons > .menu-wrapper .menu svg {
    margin-right: 5px;
    margin-top: -3px;
    width: 18px;
    height: 18px;
    color: var(--text-color);
}

.actionbar__pagination {
    display: inline-flex;
    align-items: center;
    margin-left: 10px;
}

.actionbar__pagination > .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    margin: 0;
    margin-right: -1px;
    padding: 0;
}
.actionbar__pagination > .btn--disabled {
    pointer-events: none;
}

.actionbar__pagination .feather {
    width: 16px;
    height: 16px;
}

.actionbar__pagination-back {
    border-radius: 0.75rem 0 0 0.75rem;
    border-width: 1px;
}

.actionbar__pagination-forward {
    border-radius: 0 0.75rem 0.75rem 0;
    border-width: 1px;
}

.actionbar__pagination-number {
    padding: 0 20px;
}


/*
 * === WEBPHONE ===
 */
.dataphone_called{
    font-size:12px;
}
.datapatransfer{
    margin:0px;
}
.phone {
    position: fixed;
    bottom: 0;
    right: 0;
    margin-right:-300px;
    width: 0;
    height: 0;
    overflow:hidden;
    /* box-shadow: 0 0 12px 1px rgba(255, 255, 255, 0.1); */

    border-radius: 1rem 0 0 0;
    transform: translateY(0px);
    transition: all 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
    z-index: 99999;/*var(--zIndex-4) */
}

.phone--opened {
    width: 400px;
    height: unset;
    transform: translateY(0);
    box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.1);
    margin-right:0px;
}

.phone__header {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    padding: var(--spacing-05) 13px;
    font-size: var(--font-size-1);
    color: var(--white-color);
    background: var(--brand-color);
    user-select: none;
    cursor: pointer;
    border-radius: 1rem 0 0 0;
}
.phone--opened > .phone__header {
    background:var(--hover-color) !important;
    color: var(--text-color);
    font-size:12px;
    height: 40px;
}
.phone--opened > .phone__header svg{
    color:var(--text-color);

}

.phone__header svg {
    display: inline-block;
    width: 18px;
    height: 18px;
    color: var(--white-color);
}

.phone--opened .phone__header svg {
    transform: rotate(180deg);
}

.phone__body {
    position: relative;
    height:750px;
    overflow:hidden !important;
    background: var(--hover-color);
}

.avatar-sm {
    height: 2.25rem;
    width: 2.25rem;
}

/*
 * === TOOLTIP ===
 */
.tooltip{
    position: fixed;
    display: block;
    z-index:10000;
    line-height: 20px;
    font-size: var(--font-size-2);
    opacity: 1 !important;
    color: var(--bg-secondary-color);
    background-color: var(--dark-color);
    border: 1px solid var(--dark-color);
    border-radius: 0.5rem;
    pointer-events: none;
    outline:none;
    text-decoration:none;
}

.tooltip.is-top:after,
.tooltip.is-top:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.tooltip.is-top:before {
    border-top-color: var(--dark-color);
    border-width: 6px;
    margin-left: -6px;
}

.tooltip.is-top:after {
    border-top-color: var(--dark-color);
    border-width: 5px;
    margin-left: -5px;
}

.tooltip.is-left:after,
.tooltip.is-left:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.tooltip.is-left:before {
    border-left-color: var(--dark-color);
    border-width: 6px;
    margin-top: -6px;
}

.tooltip.is-left:after {
    border-left-color: var(--dark-color);
    border-width: 5px;
    margin-top: -5px;
}



.tooltip.is-right:after,
.tooltip.is-right:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    transform: scaleX(-1);
}

.tooltip.is-right:before {
    border-left-color: var(--dark-color);
    border-width: 6px;
    margin-top: -6px;
}

.tooltip.is-right:after {
    border-left-color: var(--dark-color);
    border-width: 5px;
    margin-top: -5px;
}


.tooltip.is-bottom:after,
.tooltip.is-bottom:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.tooltip.is-bottom:before {
    border-bottom-color: var(--dark-color);
    border-width: 6px;
    margin-left: -6px;
}

.tooltip.is-bottom:after {
    border-bottom-color: var(--dark-color);
    border-width: 5px;
    margin-left: -5px;
}

.tooltip__inner {
    font-size: var(--font-size-2);
    max-width: 200px;
    padding: 5px 10px;
    text-align: left;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tooltip__inner {
    max-width: initial;
    white-space: nowrap;
}



/*
 * === TOAST ===
 */
.widget-toast {
    position: relative;
    top: 30px;
    right: 30px;
    width: 100%;
    max-width: 367px;
    margin-bottom: 10px;
    background-color: var(--touraccent-color);
    border-radius: 0.75rem;
    box-sizing: border-box;
    padding: 7px;
    padding-left: 12px;
    padding-top: 15px;
    padding-bottom: 15px;
    z-index: 2000;
    color: var(--white-color);
    font-size: 12px;
    line-height: 1.5;
    animation: widget-connection-status 200ms ease;
    cursor: default;
}

@keyframes toast-slide {
    from {
        opacity: 0.7;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.widget-toast::before {
    box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    -moz-border-radius: inherit;
    -webkit-border-radius: inherit;
    border-radius: inherit;
}


.widget-toast__body {
    display: table;
    width: 100%;
    position: relative;
}

.widget-toast__col {
    display: table-cell;
    vertical-align: middle;
    box-sizing: border-box;
}

.widget-toast__col:nth-child(1) {
    width: auto;
    padding: 0 16px 2px 0;
    text-align: left;
}

.widget-toast__col:nth-child(2) {
    width: 18px;
    height: 18px;
    text-align: right;
}

.widget-toast-close-btn {
    cursor:pointer;
    font-weight:600;
    font-size:15px;
    opacity:1;
    color: var(--blue-color);
    position:absolute;
    margin-top:-10px;
    padding:10px;
    right:0;
    top:0;

}
.widget-toast-close-btn:Hover{
    opacity:0.6;
}



.widget-toast__container {
    position: fixed;
    top: 30px;
    right: 0;
    z-index: var(--zIndex-5);
}

/*
 * === FEEDBACK ===
 */
.widget-feedback {
    position: absolute;
    left: 30px;
    bottom: -25px;
    width: 300px;
    margin-right: var(--spacing-3);
    margin-bottom: var(--spacing-6);
    background: var(--white-color);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 0.75rem;
    z-index: var(--zIndex-5);
}

.widget-feedback__header {
    display: flex;
    flex-flow: column nowrap;
    padding: var(--spacing-1);
}

.widget-feedback__header-title {
    font-size: var(--font-size-2);
    font-weight: 600;
    margin-bottom: var(--spacing-05);
}

.widget-feedback__header-description {
    font-size: var(--font-size-1);
    color: var(--text-secondary-color);
    line-height: 20px;
}

.widget-feedback__body {
    padding: 0 var(--spacing-1);
}

.widget-feedback__body textarea {
    width: 100%;
    height: 70px;
}

.widget-feedback__buttons {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    flex-flow: row nowrap;
    font-size: var(--font-size-05);
    padding: var(--spacing-1) 0;
    background: var(--white-color);
    text-transform: uppercase;
}

.widget-feedback__buttons .btn-plain > svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.widget-feedback-send-btn {
    display: flex;
    flex-flow: row nowrap;
    padding: var(--spacing-05) var(--spacing-1);
    color: var(--white-color);
    margin-right: var(--spacing-1);
    background: var(--brand-color);
    border-radius: 0.75rem;
    transition: transform 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
}

.widget-feedback-send-btn:hover {
    opacity: 0.8;
}

.widget-feedback-send-btn:active {
    transform: scale(0.95);
}

.widget-feedback-close-btn {
    position: absolute;
    top: 0;
    right: 0;
    margin: var(--spacing-05);
    color: var(--accent-color);
}

.widget-feedback-close-btn:hover {
    opacity: 0.6;
}

/*
 * === NOTIFICATION ===
 */
.widget-notification {
    position: fixed;
    right: 16px;
    top: 70px;
    width: 320px;
    background: var(--hover-color);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: right 0.3s cubic-bezier(0.1, 0.82, 0.25, 1), opacity 0.3s ease, transform 0.3s ease;
    transform-origin: top right;
    z-index: 199999;
    overflow: hidden;
    animation: callSlideIn 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes callSlideIn {
    from { opacity: 0; transform: translateX(40px) scale(0.95); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes callPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    50% { box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); }
}

.widget-notification__header {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 20px 16px;
    color: var(--text-color);
    position: relative;
}

.widget-notification__header::before {
    content: '';
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #10b981, #059669);
    border-radius: 50%;
    opacity: 0.12;
    animation: callPulse 2s ease-in-out infinite;
}

.widget-notification__header-title {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #10b981;
    margin-top: 28px;
}

.widget-notification__header-caller {
    font-size: 20px;
    font-weight: 700;
    margin: 6px 0 12px;
    letter-spacing: -0.3px;
}

.widget-notification__header .btn {
    margin-top: 6px;
    border-radius: 8px;
    font-size: 12px;
    padding: 6px 14px;
    font-weight: 500;
}

.widget-notification-details-btn {
    padding: 3px 0;
    color: var(--white-color);
    border-bottom: 1px solid var(--white-color);
    text-transform: uppercase;
}

.widget-notification__buttons {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px 18px;
    background: transparent;
    text-transform: none;
}

.widget-notification__buttons .btn-plain {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
}

.widget-notification__buttons .btn-plain > svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-right: 8px;
}

.widget-notification-respond-btn,
.widget-notification-hangup-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 10px 16px;
    color: #fff;
    border-radius: 10px;
    transition: all 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
    border: none;
    cursor: pointer;
}

.widget-notification-respond-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4);
}

.widget-notification-hangup-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(239, 68, 68, 0.4);
}

.widget-notification-respond-btn:active,
.widget-notification-hangup-btn:active {
    transform: scale(0.97);
}

.widget-notification-respond-btn {
    background: linear-gradient(135deg, #10b981, #059669);
}

.widget-notification-hangup-btn {
    background: linear-gradient(135deg, #ef4444, #dc2626);
}

.widget-notification-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--text-color);
    opacity: 0.5;
    transition: all 0.15s ease;
    z-index: 2;
}

.widget-notification-close-btn:hover {
    opacity: 1;
    background: rgba(239, 68, 68, 0.1);
    color: var(--error-color);
}

/*
 * === SIDE PANEL ===
 */
.side-panel {
    position: relative;
    width: calc(100% - 200px);
    height: 100%;
    margin-left: 200px;
    background: var(--module-color);
    box-shadow: none;
    display: none;
    opacity: 0;
    transform: translateX(100%);
    z-index: var(--zIndex-2);
}

.side-panel.is-visible {
    display: block;
    animation: side-panel-slide 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    animation-fill-mode: forwards;
    animation-delay: 0.1s;
}

@keyframes side-panel-slide {
    from {
        opacity: 0;
        transform: translateX(100%);
    }

    to {
        opacity: 1;
        transform: translateX(0px);
    }
}

.side-panel__inner {
    position: relative;
    width: 100%;
    height: 100%;
    padding: var(--spacing-3);
    overflow-x: hidden;
    overflow-y: auto;
}

.side-panel-close-btn {
    position: absolute;
    top: var(--spacing-2);
    left: -50px;
    padding: 5px;
    color: var(--accent-color);
    background: var(--white-color);
    border: 2px solid var(--white-color);
    border-radius: 100%;
    transform: scale(1);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.side-panel-close-btn:hover {
    transform: scale(1.1);
}

.side-panel__header {
    display: flex;
    align-items: center;
}

.side-panel__header-title {
    flex-grow: 1;
    order: 1;
}
.side-panel__header-menu {
    order: 5;
    float: right;
    margin-left: var(--spacing-1);
    white-space: nowrap;
    text-align: right;
}

.side-panel__header-title__item {
    font-size: var(--font-size-7);
}

.side-panel-header-btn,
.side-panel-header-btn {
    opacity: 0.6;
    cursor: pointer;
    margin-left: var(--spacing-05);
    transition: opacity 0.2s ease;
}

.side-panel-header-btn:hover {
    opacity: 1;
}

.side-panel-menu-btn {
    width: 42px;
    height: 42px;
    padding: 0;
    margin: 0;
    margin-left: var(--spacing-05);
}

.side-panel-menu-text-btn {
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    height: 42px;
    line-height: 20px;
    text-transform: uppercase;
    margin: 0;
    margin-left: 15px;
}

.side-panel-menu-text-btn .btn__icon {
    border-left: 1px solid #bcc3c7;
    padding-left: 5px;
    margin-left: 10px;
}

.side-panel__header .menu {
    top: 50px;
}

.side-panel__header .menu svg {
    margin-right: 5px;
    margin-top: -3px;
    vertical-align: middle;
    width: 16px;
    height: 16px;
}

.side-panel__tabs {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-top: 0;
    margin: 10px 0;
}

.side-panel__tabs-container {
    display: flex;
    flex-direction: row;
    margin: 0;
    padding: 15px 0;
    list-style: none;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}

.side-panel__tab {
    display: inline-block;
    overflow: hidden;
    box-sizing: border-box;
    margin: 2px 0;
    padding: 0 18px;
    min-height: 27px;
    line-height: 27px;
}

.side-panel__tab-link {
    display: block;
    overflow: hidden;
    max-width: 100%;
    border-bottom: 2px solid transparent;
    color: var(--text-secondary-color) !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    transition: all 220ms ease;
}

.side-panel__tab.is-active .side-panel__tab-link,
.side-panel__tab-link:hover {
    border-bottom-color: var(--brand-color);
    color: var(--brand-color) !important;
}

.side-panel__tab.is-active .side-panel__tab-link {
    font-weight: 600;
}

.js-attached{
    display:none;
}


.form-control {
    display: block;
    /*margin-bottom: var(--spacing-1);*/
}

.form-control label,.form-group label {
    display: inline-block;
    font-size: var(--font-size-1);
    font-weight: 500;
    color: var(--text-color);
    margin-bottom: var(--spacing-1);
}

.form-control label > span {
    font-size: var(--font-size-1);
    color: var(--red-color);
}





/* WEBPHONEFINAL */
.js-phone:not(.phone--opened) .phone__body{
    display:none;
}
#events{
    position:fixed;
    top:35px;
    left:0px;
    width:100%;
    height:15px;
    text-align:center;
    z-index:9999999999999;

    color: var(--text-muted-color);
    font-size:10px;
    text-align:center;
}
.js-phone-body  {

    color: var(--dark-color);
    font-weight: 300;
    background:var(--white-color);
}
.js-phone-body .wrapper {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-align:center;
}
#phonetocall{
    background: var(--hover-color);
}
.js-phone-body .wrapper.form-success .container h1 {
    -webkit-transform: translateY(85px);
    transform: translateY(85px);
}
.js-phone-body .container {
    max-width: 600px;
    margin: 0 auto;
    padding: 80px 0;
    height: 400px;
    text-align: center;
}
.js-phone-body .container h1 {
    font-size: 40px;
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-transition-timing-function: ease-in-put;
    transition-timing-function: ease-in-put;
    font-weight: 200;
}
.js-phone-body form {
    padding: 0;
    position: relative;
    z-index: 2;
}
.js-phone-body form input{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
}

.js-phone-body form button {
    -webkit-transition-duration: 0.25s;
    transition-duration: 0.25s;
}
.js-phone-body form button:hover {
    background-color: var(--hover-color);
}
.js-phone-body #wrapperdivd{
    z-index:9999;
    position:absolute;
    width:100%;
}
.js-phone-body .noseve{
    max-height:1px;
    overflow:hidden;
}
.js-phone-body #wrapperdiv{
    margin:auto;
    max-width:200px;
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-transition-timing-function: ease-in-put;
    transition-timing-function: ease-in-put;

}


.btnNEW,.btnNEWdigya,.btnNEWdig{
    cursor:pointer;
    height:36px;
    margin:2px;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    border: 1px solid var(--border-strong-color);
    background: var(--falcon-input-bg);
    border-radius: 0.75rem;
    padding: 10px 15px;
    display: inline;
    text-align: center;
    font-size: 14px;
    color: var(--text-color);
    transition: background 0.2s, border-color 0.2s;
    font-weight: 400;

}
.btnNEW:Hover,.btnNEWdigya:Hover,.btnNEWdig:Hover{
    background-color: var(--hover-color) !important;
    border-color: var(--brand-color);
}
.btnNEWdig{
    height:50px;
    width: calc(33% - 4px);
    margin:2px;
    border-radius: 1rem;
    background-color: var(--datalyse-bg-input);
    color:var(--falcon-btn-falcon-default-color);

}
.widget-notification-respond-btn:Hover{
    background: linear-gradient(135deg, #059669, #047857) !important;
}
.widget-notification-hangup-btn:Hover{
    background: linear-gradient(135deg, #dc2626, #b91c1c) !important;
}
.btnNEWdigyatxt{
    width:calc(100% - 54px);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    border: none;
    display: inline;
    text-align: center;
    font-size: 16px;
    line-height:22px;
    background: var(--white-color) !important;
    background-color: var(--white-color) !important;
    color: var(--text-color) !important;
    margin:0px;
    padding:0px;
    margin-top:8px;
    margin-bottom:7px;

}

.btnNEWdigyatxtsel{
    width:calc(100% - 4px);
    margin:2px;
    outline: 0;
    border: 1px solid var(--border-strong-color);
    background-color: var(--hover-color);
    border-radius: 0.75rem;
    padding: 5px 5px;
    display: inline;
    text-align: center;
    font-size: 12px;
    color: var(--brand-color);
    transition: background 0.2s;
    font-weight: 400;
    display:none

}
.btnNEWdigya{
    margin:0 !important;
}
.btnNEW:disabled{
    cursor:not-allowed;
    display:none !important;
}
.paisbtnNEW{
    float:left;
    margin-top:7px;
    padding:4px;
    padding-left:7px;
    padding-right:7px;
}
#borratebtn{
    float:right;
    margin-top:7px;
    padding:4px;
    cursor:pointer;
}
#borratelimg{
    width:14px;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
.borratebtnNEWdisabled{
    cursor: default !important;
    opacity:0.2;
}
.btnNEWcallnew{
    cursor:pointer;
    outline:none;
    background:url('/images/callbtn.png');
    background-size:100% 100%;
    border-radius:25px;
    height:50px;
    width:50px;
    color:transparent;
    border:2px solid #fff;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);
}
.btnNEWcallnew:Hover{
    box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.05);
}
.btnNEWcallnew:disabled{
    cursor:not-allowed;
    display:none !important;
}

.btnNEWhangupnew{
    cursor:pointer;
    outline:none;
    background:url('/images/hangupbtn.png');
    background-size:100% 100%;
    border-radius:25px;
    height:50px;
    width:50px;
    color:transparent;
    border:2px solid #fff;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);
}
.btnNEWhangupnew:Hover{
    box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.05);
}
#llamandofondodiv{
    z-index:9999999999;
    margin-top:0px;
    left:0;
    width:100%;
    height:100%;
    min-height:300px;
    position:relative;
    background:var(--white-color);
    color: var(--text-muted-color);
    text-align:center;
}
#cargandodiv{
    z-index:9999999999;
    margin-top:40px;
    left:0;
    width:100%;
    height:100%;
    position:fixed;
    background:var(--white-color);
    color: var(--text-muted-color);
    text-align:center;
}

.btnNEWcallnewmov2{
    margin:auto;
    margin-top:0px;
    background:url('/images/Blocks-1s-200px.gif');
    background-size:100% 100%;
    height:100px;
    width:100px;
    color:transparent;

    animation-name: examplemovcalling2;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.btnNEWcallnewmov{
    margin:auto;
    margin-top:0px;
    position:relative;
    background:url('/images/callbtn.png');
    background-size:100% 100%;
    border-radius:50px;
    height:100px;
    width:100px;
    color:transparent;
    border:2px solid #fff;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);

    animation-name: examplemovcalling;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
@keyframes examplemovcalling {
    0%   {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);height:100px;width:100px;border-radius:50px;margin-top:0px;}
    20%  {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3);height:150px;width:150px;border-radius:75px;margin-top:-25px;}
    40%  {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);height:120px;width:120px;border-radius:60px;margin-top:-10px;}
    60%  {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3);height:160px;width:160px;border-radius:80px;margin-top:-30px;}
    80%  {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);height:120px;width:120px;border-radius:60px;margin-top:-10px;}
    100% {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);height:100px;width:100px;border-radius:50px;margin-top:0px;}
}
@keyframes examplemovcalling2 {
    0%   {transform:rotate(0deg);height:100px;width:100px;border-radius:50px;margin-top:0px;}
    20%  {height:150px;width:150px;border-radius:75px;margin-top:-25px;}
    40%  {height:120px;width:120px;border-radius:60px;margin-top:-10px;}
    60%  {height:160px;width:160px;border-radius:80px;margin-top:-30px;}
    80%  {height:120px;width:120px;border-radius:60px;margin-top:-10px;}
    100% {transform:rotate(360deg);height:100px;width:100px;border-radius:50px;margin-top:0px;}
}
.llamandoaaspan{
    color: var(--text-muted-color);
    text-align:center;

}
.u-hidden{
    display:none !important;
}
#pongolineasnow_enwebphonedivYA{
    min-width:100%;height:40px;
    padding-top:20px;
}

.pestawebphone,.pestawebphonenew{
    padding:7px;
    display:inline;
    height:25px;
    border-radius: 0.5rem;
    background: var(--hover-color);
    color: var(--text-color);
    font-size:11px;
    max-width:40px;
    cursor:pointer;
}
.pestawebphone:Hover,.pestawebphonenew:Hover{
    background:#D1E0F0;
}
.webpselected{
    background:#9BDAF4;
}


.leadStatus{
    border-radius: 15px;
    color: white;
    margin: 5px;
    width:90%;
    line-height: calc(100% - 20px);
    text-align: center;
}

.popover{
    max-width: 100%; /* Max Width of the popover (depending on the container!) */
    min-width: 300px;
}

.tourRESALTA::before{
    content: "";
    position:absolute;
    top: 50%;
    transform: translateY(-50%);

    height: calc(100%);
    min-height: calc(100%);

    width: calc(100%);
    min-width: calc(100%);

    left: 0; right: 0;

    margin: 0 auto;

    animation-name: tourRESALTAMOV;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

@keyframes tourRESALTAMOV {
    0% {  }
    50% { background: rgba(239,179,130,0.4) }
}

::-webkit-scrollbar-corner {
    background: rgba(0,0,0,0);
  }


.borderradius {
    border-radius: 10px !important;
}

.borderradius input{
    border-radius: 10px !important;
}
.bg-holder {
    position: absolute;
    width: 100%;
    min-height: 100%;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    will-change: transform, opacity, filter;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-repeat: no-repeat;
    z-index: 0;
}
.flex-between-center {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}



.modal__body {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
}

.modal__body-inner {
    position: relative;
    flex: 1 1 auto;
    height: 100%;
    overflow: visible;
    overflow-y: auto;
    max-height: calc(100vh - 24vh);
}

.modal__body-inner {
    padding: 20px 24px;
}

.modal__actions {
    display: flex;
    flex: 0 0 auto;
    flex-flow: row nowrap;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px 24px;
    background: var(--white-color);
    border-top: 1px solid var(--border-color, rgba(0, 0, 0, 0.06));
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}


/*
 * === MENU ===
 */
 .menu-wrapper {
    position: relative;
    display: inline-flex;
}

.menu-wrapper .menu {

    color: var(--accent-color);
    background-color: var(--white-color);
    border: 1px solid var(--border-strong-color);

    position: absolute;
    top: 40px;
    right: 0;
    padding: 6px;
    border-radius: 0.75rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    pointer-events: none;
    opacity: 0;
    transform: translateY(-10px);
    transform-origin: 100% 0;
    transition:
            transform 0.2s cubic-bezier(0.1, 0.82, 0.25, 1),
            opacity 0.2s cubic-bezier(0.1, 0.82, 0.25, 1);
    z-index: var(--zIndex-5);
}

.menu-wrapper .menu--left {
    left: 0;
    right: initial;
}

.menu-wrapper .menu.is-visible {
    pointer-events: auto;
    opacity: 1;
    transform: none;
    display: block !important;
}

.modal .menu-wrapper.is-select > button{
    background-color: var(--falcon-input-bg) !important;
    border: 1px solid var(--datalyse-bg-input) !important;
}

.modal .menu-wrapper {
    display: block;
    width: 100%;
}
.modal .menu-wrapper .menu{
    max-height: 200px !important;
    overflow: auto;
    position: absolute;
    display:none;

}
.modal label {
    display: inline-block;
    margin-bottom: 6px;
    font-weight: 500;
    font-size: 13px;
    color: var(--text-secondary-color, #64748b);
}
.calendar {
    width: 3.125rem;
    line-height: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    border-radius: .375rem;
}
.calendar .calendar-month {
    background-color: var(--error-color);
    color: var(--white-color);
    border-radius: .375rem .375rem 0 0;
    padding: .25rem;
    font-weight: 600;
}
.calendar .calendar-day {
    font-size: 1.728rem;
    padding: .25rem;
    border: .125rem solid rgba(230, 55, 87, .3);
    border-top: 0;
    border-radius: 0 0 .375rem .375rem;
    color: var(--text-muted-color);
    font-weight: 700;
}


.colorstatus-0 { background-color: rgba(77, 182, 172, 1); color: white !important; }
.colorstatus-1 { background-color: rgba(255, 183, 77, 1); color: black !important; }
.colorstatus-2 { background-color: rgba(240, 98, 146, 1); color: white !important; }
.colorstatus-3 { background-color: rgba(79, 195, 247, 1); color: black !important; }
.colorstatus-4 { background-color: rgba(149, 117, 205, 1); color: white !important; }
.colorstatus-5 { background-color: rgba(255, 138, 101, 1); color: black !important; }
.colorstatus-6 { background-color: rgba(129, 199, 132, 1); color: black !important; }
.colorstatus-7 { background-color: rgba(100, 181, 246, 1); color: black !important; }
.colorstatus-8 { background-color: rgba(255, 82, 82, 1); color: white !important; }
.colorstatus-9 { background-color: rgba(186, 104, 200, 1); color: white !important; }
.colorstatus-10 { background-color: rgba(174, 213, 129, 1); color: black !important; }
.colorstatus-11 { background-color: rgba(255, 64, 129, 1); color: white !important; }
.colorstatus-12 { background-color: rgba(38, 166, 154, 1); color: white !important; }
.colorstatus-13 { background-color: rgba(77, 208, 225, 1); color: black !important; }
.colorstatus-14 { background-color: rgba(255, 213, 79, 1); color: black !important; }
.colorstatus-15 { background-color: rgba(121, 134, 203, 1); color: white !important; }
.colorstatus-16 { background-color: rgba(83, 188, 178, 1); color: white !important; }
.colorstatus-17 { background-color: rgba(33, 161, 149, 1); color: white !important; }
.colorstatus-18 { background-color: rgba(98, 179, 244, 1); color: black !important; }
.colorstatus-19 { background-color: rgba(179, 218, 134, 1); color: black !important; }
.colorstatus-20 { background-color: rgba(245, 173, 67, 1); color: black !important; }
.colorstatus-21 { background-color: rgba(75, 206, 223, 1); color: black !important; }
.colorstatus-22 { background-color: rgba(28, 156, 144, 1); color: white !important; }
.colorstatus-23 { background-color: rgba(104, 185, 250, 1); color: black !important; }
.colorstatus-24 { background-color: rgba(87, 203, 255, 1); color: black !important; }
.colorstatus-25 { background-color: rgba(245, 203, 69, 1); color: black !important; }
.colorstatus-26 { background-color: rgba(118, 131, 200, 1); color: white !important; }
.colorstatus-27 { background-color: rgba(77, 193, 245, 1); color: black !important; }
.colorstatus-28 { background-color: rgba(234, 92, 140, 1); color: white !important; }
.colorstatus-29 { background-color: rgba(99, 180, 245, 1); color: black !important; }
.colorstatus-30 { background-color: rgba(73, 189, 241, 1); color: black !important; }
.colorstatus-31 { background-color: rgba(78, 194, 246, 1); color: black !important; }
.colorstatus-32 { background-color: rgba(139, 107, 195, 1); color: white !important; }
.colorstatus-33 { background-color: rgba(78, 209, 226, 1); color: black !important; }
.colorstatus-34 { background-color: rgba(167, 206, 122, 1); color: black !important; }
.colorstatus-35 { background-color: rgba(128, 141, 210, 1); color: white !important; }
.colorstatus-36 { background-color: rgba(251, 179, 73, 1); color: black !important; }
.colorstatus-37 { background-color: rgba(255, 68, 133, 1); color: white !important; }
.colorstatus-38 { background-color: rgba(253, 211, 77, 1); color: black !important; }
.colorstatus-39 { background-color: rgba(80, 211, 228, 1); color: black !important; }
.colorstatus-40 { background-color: rgba(150, 118, 206, 1); color: white !important; }
.colorstatus-41 { background-color: rgba(255, 219, 85, 1); color: black !important; }
.colorstatus-42 { background-color: rgba(255, 83, 83, 1); color: white !important; }
.colorstatus-43 { background-color: rgba(36, 164, 152, 1); color: white !important; }
.colorstatus-44 { background-color: rgba(255, 67, 132, 1); color: white !important; }
.colorstatus-45 { background-color: rgba(253, 136, 99, 1); color: black !important; }
.colorstatus-46 { background-color: rgba(255, 87, 87, 1); color: white !important; }
.colorstatus-47 { background-color: rgba(252, 79, 79, 1); color: white !important; }
.colorstatus-48 { background-color: rgba(90, 171, 236, 1); color: black !important; }
.colorstatus-49 { background-color: rgba(244, 102, 150, 1); color: white !important; }
.colorstatus-50 { background-color: rgba(122, 135, 204, 1); color: white !important; }
.colorstatus-51 { background-color: rgba(122, 192, 125, 1); color: black !important; }
.colorstatus-52 { background-color: rgba(255, 91, 91, 1); color: white !important; }
.colorstatus-53 { background-color: rgba(71, 202, 219, 1); color: black !important; }
.colorstatus-54 { background-color: rgba(185, 103, 199, 1); color: white !important; }
.colorstatus-55 { background-color: rgba(111, 124, 193, 1); color: white !important; }


.br5{
    border-radius: 0.5rem;
    height:32px;
    text-align:center;
    margin:1px;
    border: 1px solid var(--white-color);
};
/*
 * === chatbot ===
 */

#akichatbotadmincontents,#akiwhatshap{
    padding-top:70px;
    }
/*
 * === whatsapp ===
 */
#akichatWHATBOTscrollmensajes .chat-message {
    max-width: calc(100% - 7rem);
    margin-bottom: .25rem;
    display: inline-block;
    position: relative;
}
#akichatWHATBOTscrollmensajes .avatar-l,.avatar-l img{
    height: 28px;
    width: 28px;
}

#akichatWHATBOTscrollmensajes .w-xxl-75 {
    width: 75% !important;
}
#akichatWHATBOTscrollmensajes .flex-1 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
#akichatWHATBOTscrollmensajes .flex-end-center {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#akichatWHATBOTscrollmensajes .d-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
.chat-content-scroll-area {
    height: 100%;
    padding-bottom: 1rem;
    overflow-y: auto;
}
.chat-content-header {
    padding: 1rem;
    border-bottom: 1px solid var(--falcon-border-color);
}
.bg-200 {
    background-color: var(--falcon-200) !important;
}
.btn-default.is-activado{
    color: var(--dark-color);
}

/*
#verchatsWHATDIV{

display: flex !important;
flex-direction: row;
flex-wrap: nowrap;
align-items: stretch;
width: 100%;

}

#verchatsWHATDIV .card-chat-content{
width: 70%;
}
#verchatsWHATDIV .app-chat{
width: 30%;
}
#whatschatsidebar{
height: calc(100% + 74px)
}
#verchatsWHATDIV .chat-content-body {
    height: calc(100% - 130px);
}
#verchatsWHATDIV .card-chat-pane {
    height: calc(100% - 90px);
    position: relative;
    overflow: hidden;
} */


/*
WHATSAAPP Y CHATBOT
*/

.searchtopnavv{
    padding-left:45px !important;
    max-width:150px;
}
@media (max-width: 987px) {

.searchtopnavv{
    display: none !important;
}
.chat-sidebar {
    display: block;
    width:100%;
}
.card-chat-content {
    display: none;
}
    .btnreducechatmin {
        display: none;
    }
    .chat-sidebar.heclickadounaconverchatbotadm {
        display: none;
    }
    .heclickadounaconverchatbotadm .btnreducechatmin{
        display: inline !important;
        cursor:pointer;
    }
    .card-chat-content.heclickadounaconverchatbotadm {
        right: 0px;
        display: block;
        width:100% !important;
    }
}
@media (min-width: 987px) {
    .chat-sidebar {
        min-width:320px;
        max-width:320px;
    }
    .btnreducechatmin {
        display: none;
    }
}

textarea::-webkit-resizer {
    display: none; /* Ocultar el icono específico en navegadores basados en WebKit (como Chrome y Edge) */
  }
.v-hidden{
    visibility: hidden;
}
#divformmandawhats{
background: var(--white-color)
}
.chatwhatssendtemplate{
    width: calc(100% - 8px);
    margin:4px;
}

#whatschatsidebar{
    display: block !important;
    overflow-y: auto;
    overflow-x: hidden;
    height:100%;
}

.dataTables_length{
    padding-top: 5px;
    text-align: left;
    padding-left:10px;
    padding-right:10px;
    float:right;
}
.dt-buttons{
    padding-top: 5px;
    padding-left:10px;
    padding-right:10px;
    float: right;
}
.dt-buttons .dt-button{
    margin-bottom: 3px;
    margin-right: 3px;
}
.dataTables_length select{
    padding-top: 5px;

}
.dataTables_filter{
    padding-top: 5px;
    padding-left:10px;
    padding-right:10px;
    margin-bottom:0px !important;
    float: left;
    margin-top: -20px;
}

/* ===== DataTables Dark Theme Integration ===== */
[data-bs-theme=dark] table.dataTable thead th,
[data-bs-theme=dark] table.dataTable thead td {
    background-color: var(--bg-color) !important;
    color: var(--text-secondary-color) !important;
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme=dark] table.dataTable tbody td {
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme=dark] table.dataTable tbody tr:hover td {
    background-color: var(--hover-color) !important;
}
[data-bs-theme=dark] table.dataTable tbody tr.odd td,
[data-bs-theme=dark] table.dataTable tbody tr.even td {
    background-color: var(--bg-color) !important;
}
[data-bs-theme=dark] table.dataTable tbody tr.odd:hover td,
[data-bs-theme=dark] table.dataTable tbody tr.even:hover td {
    background-color: var(--hover-color) !important;
}
[data-bs-theme=dark] table.dataTable {
    border-color: var(--border-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_filter input,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_length select {
    background-color: var(--bg-tertiary-color) !important;
    color: var(--text-color) !important;
    border-color: var(--border-strong-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_info {
    color: var(--text-secondary-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_filter label,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_length label {
    color: var(--text-secondary-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--text-secondary-color) !important;
    background-color: transparent !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: var(--hover-color) !important;
    color: var(--text-color) !important;
    border-color: var(--border-strong-color) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--bs-primary, #5d87ff) !important;
    color: #fff !important;
    border-color: var(--bs-primary, #5d87ff) !important;
}
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: var(--text-muted-color) !important;
    background-color: transparent !important;
}
[data-bs-theme=dark] table.dataTable.no-footer,
[data-bs-theme=dark] table.dataTable thead th,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_scrollHead {
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme=dark] .card {
    background-color: var(--bg-color);
    border-color: var(--border-color);
}
[data-bs-theme=dark] .card-header {
    background-color: var(--bg-color);
    border-bottom-color: var(--border-color);
}
[data-bs-theme=dark] table.dataTable.stripe tbody tr.odd,
[data-bs-theme=dark] table.dataTable.display tbody tr.odd,
[data-bs-theme=dark] table.dataTable.stripe tbody tr.even,
[data-bs-theme=dark] table.dataTable.display tbody tr.even {
    background-color: var(--bg-color) !important;
}

/* - MODAL AVATAR - */
.image-explorer-container {
    width: 400px;
    height: 447px;
    margin: 0px auto;
    user-select: none;
}

.image-explorer-container .image-explorer-image-view {
    width: 400px;
    height: 400px;
    position: relative;
    overflow: hidden;
}

.image-explorer-container.empty .image-explorer-image-view[data-upload-prompt]::after {
    background-clip: padding-box;
    box-sizing: border-box;
    content: attr(data-upload-prompt);
    color: rgb(170, 170, 170);
    text-align: center;
    font-size: 18px;
    line-height: 25px;
    width: 60%;
    height: 100%;
    margin-left: -30%;
    position: absolute;
    top: 35%;
    left: 50%;
    background-size: 48px;
    border-radius: 0.75rem;
    padding: 48px 20px 0px;
}

.image-explorer-container .image-explorer-image-view .image-explorer-mask {
    box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 0px 1000px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -128px;
    margin-top: -128px;
}

.image-explorer-container .image-explorer-image-view .image-explorer-mask.circle-mask {
    width: 260px;
    height: 260px;
    background-clip: padding-box;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px;
    border-radius: 100%;
    border-width: 2px;
    border-style: solid;
    border-color: white;
    border-image: initial;
}

.image-explorer-container .image-explorer-image-view img {
    position: absolute;
    left: 50%;
    top: 50%;
}

.image-explorer-container.empty .image-explorer-image-view .image-explorer-mask {
    display: none;
}

.image-explorer-container .image-explorer-image-view .image-explorer-drag-delegate,
.avatar-white-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    cursor: move;
    background-color: rgba(0, 0, 0, 0);
}


.image-explorer-container.empty .image-explorer-image-view .image-explorer-drag-delegate {
    cursor: default;
}

.avatar-white-bg {
    background-image: url(/images/avatar-bg-light.png);
    background-position: -23px -23px;
    background-repeat: no-repeat;
}

[data-bs-theme="dark"] .avatar-white-bg {
    background-image: url(/images/avatar-bg-dark.png);
}

.image-explorer-container .image-explorer-scale-slider-wrapper {
    display: inline-block;
    width: 300px;
    position: relative;
    height: 47px;
    line-height: 20px;
    box-sizing: border-box;
    padding-top: 10px;
    margin: 0px 50px;
}

.image-explorer-container.empty .image-explorer-scale-slider-wrapper {
    display: none;
}

input[type="range"] {
    height: 10px;
    appearance: none !important;
    background: rgb(178, 178, 178);
    border-radius: 0.75rem;
    outline: 0;
}

input[type='range']::-webkit-slider-thumb {
    appearance: none !important;
    width: 28px;
    height: 28px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background: white;
    border: 2px solid rgba(0,0,0,0.15);
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.image-explorer-container .image-explorer-scale-slider {
    display: inline-block;
    width: 300px;
    vertical-align: middle;
    padding: 0px;
    margin: 0px;
}

.image-explorer-container .image-explorer-scale-icon {
    position: absolute;
    top: 8px;
    width: 20px;
    height: 20px;
    color: var(--text-muted-color);
}

.image-explorer-container .image-explorer-scale-icon.left {
    left: -35px;
}

.image-explorer-container .image-explorer-scale-icon.right {
    right: -35px;
}
.dropdown-header{
    color: var(--text-color) !important;
    font-size:17px;
    font-weight:bold;
}

