/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.filtr2 .search-toggle-a.btn.btn-icon.btn-primary.waves-effect.waves-float.waves-light {
    display: none;
}
.closeCall {
    position: absolute;
    bottom: 20px;
    left:50%;
    transform: translate(-50%);
}

.ficon.feather.icon-phone-incoming, .ficon.feather.icon-volume-2 {
    background-color: #7367f0;
    color: #FFF !important;
    padding: 5px;
    border-radius: 5px;
}
#callsCount {
    background-color: #FFF;
    color: #7367f0 !important;
    top: 5px;
    right: -10px;
}

td {
    white-space: normal;
    max-width: 250px;
}
.breadcrumb-wrapper {
    display: flex;
    align-items: center;
}
.swal2-popup.swal2-modal.swal2-icon-warning.swal2-show {
    border-radius: 20px !important;
    background-color: #10163A !important;
}
.swal2-icon.swal2-warning.swal2-icon-show {
    color: #FFF !important;
    border-color: #FFF;
}
.swal2-confirm.swal2-styled {
    background-color: #262C49 !important;
}
.swal2-cancel.swal2-styled {
    background-color: #7367F0 !important;
}
.swal2-styled:focus {
    outline: 0;
    box-shadow: none !important;
}
#swal2-title {
    color: #FFFFFF !important;
}
#swal2-content {
    color: #333333 !important;
}
.datepicker.input-group {
    border: 1px solid #7367F0 ;
}
.datepicker.input-group input {
    height: 32px;
    background: transparent;
    color: #686868;
}
.datepicker.input-group span {
    border-left: none;
    border-right: 0px ;
}
.datepicker.datepicker-dropdown {
    padding: 10px;
    width: 25%;
    max-width: 320px;
    min-width: 250px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
}
.datepicker.datepicker-dropdown .datepicker-days {
    padding: 0;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed {
    width: 100%;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th {
    text-align: center;
    padding: 0.5rem 0;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.prev {
    color: #000;
    padding-bottom: 1rem;
    padding-top: 1rem;
    background: #fff;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.datepicker-switch {
    color: #000;
    background: #fff;
    padding-bottom: 1rem;
    padding-top: 1rem;
    font-size: 1rem;
    font-weight: 600;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.next {
    color: #000;
    padding-bottom: 1rem;
    padding-top: 1rem;
    background: #fff;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.dow {
    font-family: Montserrat;
    color: #000;
    font-size: 0.875rem;
    font-weight: 400;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody {
    position: relative;
    top: 13px;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td {
    text-align: center;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day {
    font-size: 0.9375rem;
    padding: 0.5rem 0;
    color: #000;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day:hover {
    background: #fff;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.active {
    color: #fff;
    background: transparent;
    position: relative;
    z-index: 1;
    text-shadow: none;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.active:before {
    content: "";
    width: 28px;
    height: 25px;
    background: #66d1d1;
    text-shadow: none;
    border-radius: 2px;
    display: block;
    margin: auto;
    vertical-align: middle;
    position: absolute;
    top: 6px;
    z-index: -1;
    left: 0;
    right: 0;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.today {
    color: #fff;
    background: transparent;
    position: relative;
    z-index: 1;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.today:before {
    content: "";
    width: 28px;
    height: 25px;
    background: #7367F0 ;
    color: #fff;
    border-radius: 2px;
    box-shadow: 3px 3px 6px 0 rgba(147, 127, 201, 0.2);
    -webkit-box-shadow: 3px 3px 6px 0 rgba(147, 127, 201, 0.2);
    -moz-box-shadow: 3px 3px 6px 0 rgba(147, 127, 201, 0.2);
    display: block;
    margin: auto;
    vertical-align: middle;
    position: absolute;
    top: 6px;
    z-index: -1;
    left: 0;
    right: 0;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.old.day {
    color: #d9dde3;
}

.datepicker > div {
    display: initial;
    padding: 0.375rem 0.75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    text-align: center;
    white-space: nowrap;
    border-radius: 2px;
}
.datepicker.input-group {
    padding: 0;
    border: 1px solid #e8ebf1;
}
.datepicker.input-group .email-compose-fields .select2-container--default .select2-selection--multiple,
.datepicker.input-group .form-control,
.datepicker.input-group .select2-container--default .select2-selection--single,
.datepicker.input-group .select2-container--default .select2-selection--single .select2-search__field,
.datepicker.input-group .tt-hint,
.datepicker.input-group .tt-query,
.datepicker.input-group .typeahead,
.datepicker.input-group select,
.email-compose-fields .select2-container--default .datepicker.input-group .select2-selection--multiple,
.select2-container--default .datepicker.input-group .select2-selection--single,
.select2-container--default .select2-selection--single .datepicker.input-group .select2-search__field {
    border: 0;
}
.datepicker.input-group .input-group-addon {
    padding: 0 10px;
    border-left: 0px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.datepicker.input-group .input-group-addon svg {
    width: 18px;
    color: #686868;
}
.datepicker-dropdown:after {
    border-bottom-color: #fff;
}
.datepicker-dropdown:before {
    border-bottom-color: #e8ebf1;
}
.datepicker-dropdown.datepicker-orient-top:after,
.datepicker-dropdown.datepicker-orient-top:before {
    top: auto;
}
.datepicker-dropdown.datepicker-orient-top:after {
    border-top-color: #fff;
}
.datepicker-dropdown.datepicker-orient-top:before {
    border-top-color: #e8ebf1;
}
.rtl .datepicker {
    direction: rtl;
}
.rtl .datepicker.input-group .input-group-addon {
    border-left: 1px solid transparent;
    border-right: 0;
}
.rtl .datepicker.input-group span {
    border-right: 0;
    border-left: 1px solid #7367F0 ;
}
.dt-buttons.flex-wrap.d-inline-flex {
    align-items: center;
}
.filtr {
  align-items: center !important;
display: flex;
justify-content: flex-end;
}
.btn.btn-icon.btn-secondary.waves-effect.waves-float.waves-light {
    background-color: #262C49 !important;
}
.filtr .row {
    justify-content: flex-end;
    padding-right: 15px;
    padding-left: 15px;
}
.filtr2 {
  align-items: center !important;
display: flex;
justify-content: flex-end;
}
.btn.btn-icon.btn-secondary.waves-effect.waves-float.waves-light {
    background-color: #262C49 !important;
}
.filtr2 .row {
    justify-content: flex-end;
    padding-right: 15px;
    padding-left: 15px;
}
button, .btn {
  font-family: Montserrat !important;
}
.consent-box {
    padding: 20px;
    background-color: #f4f4f4;
    border-radius: 15px;
}
.hidden-icon.bottom_right.gl-show {
    cursor: pointer;
}
.input-group.date.datepicker:hover {
    cursor: pointer;
}
.input-group.date.datepicker input:hover {
    cursor: pointer;
}
.variables {
    padding: 15px;
    background-color: #f0f0f0;
    border-radius: 10px;
    font-size: 12px;
    margin-top: 10px;
}
.departs label {
    display: block;
    margin-bottom: 5px;
}
.departs label input {
    margin-right: 5px;
}
.departs {
    height: 150px;
    overflow-y: scroll;
    background-color: #fafafa;
    padding: 15px;
    border-radius: 10px;
}
.countdown {
    display: flex;
    justify-content: center;
    align-content: center;
}
.position-relative.nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
}
.placeholder {
    background-color: #7367F0;
    color: #FFF;
    padding: 5px;
    border-radius: 5px;
}
#card-element {
  border: 1px solid #d9d9d9;
  padding: 9.5px;
  border-radius: 5px;
}
.alert-success h2 {
    color: #FFF;
    font-weight: 700;
    margin-bottom: 15px;
}
.alert-body {
    padding: 15px;
}
.feather.icon-x.close-alert {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 26px;
    z-index: 25
}
.feather.icon-x.close-alert:hover {
    cursor: pointer;
}
table {
    width: 100% !important;
}

table.dataTable tbody td.select-checkbox::before, table.dataTable tbody td.select-checkbox::after, table.dataTable tbody th.select-checkbox::before, table.dataTable tbody th.select-checkbox::after {
    display: block;
    position: absolute;
    top: 47% !important;
    left: 50%;
    width: 15px;
    height: 15px;
    box-sizing: border-box;
}
table.dataTable tbody tr.selected {
    border-radius: 0 !important;
}
.btn.btn-icon {
    padding: 0.615rem 0.736rem;
}
.day:hover {
    cursor: pointer;
}
.filter-column-a {
  display: none;
}
table.dataTable tr.selected td.select-checkbox::after, table.dataTable tr.selected th.select-checkbox::after {
    margin-top: -8px !important;
    margin-left: -6px !important;
}
.main-menu-content .feather.icon-circle.online {
    color: #26d017;
    background-color: #26d017;
    border-radius: 100%;
    margin-right: 10px;
}
.main-menu-content .feather.icon-circle.offline {
    color: red;
    background-color: red;
    border-radius: 100%;
    margin-right: 10px;
}
.main-menu-content .dropdown-menu.show {
    width: 84%;
}
.sp-colorize {
    border: 1px solid #ddd;
}
.collect_box {
  display: none;
}
.row.mb-2.pb-2.row-border-bottom {
    border-bottom: 1px solid #d9d9d9;
}


.card-body.call-chat {
    max-height: 400px;
    overflow-y: auto;
}
.btn.btn-orange.waves-effect.waves-float.waves-light {
    height: 40px;
    background-color: #FF6A00 !important;
    color: #FFF;
    font-weight: 500;
    align-items: center;
    display: flex;
    justify-content: center;
}
.plans .card-header.p-2 {
    background-color: #10163A !important;
}
.plans .card-header.p-2 h4 {
    color: #FFFFFF !important;
    font-weight: 300;
}
.plans .card-header.p-2 h3 {
    color: #FFFFFF !important;
    font-weight: 700;
}
.plans .card-body {
    border: 1px solid rgba(34, 41, 47, 0.125);
}
.feather.icon-check {
    color: #23c615;
    font-weight: 900;
}
.feather.icon-x {
    color: #bf1313;
    font-weight: 900;
}
.currentBTN {
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn.btn-icon.btn-primary.backBtn {
    padding: 5px !important;
    height: 25px;
    color: #FFFFFF;
    margin-right: 15px;
    background-color: #10163A;
}

#glp-content-chat .chat-body {
     display: block;
     margin: 10px 30px 0 0;
     overflow: hidden;
 }
#glp-content-chat .chat-body .chat-content {
     float: right;
     padding: .7rem 1rem;
     margin: 0 1rem 10px 0;
     clear: both;
     color: #fff;
     background-image: linear-gradient(80deg, #7367f0, #9e95f5);
     background-repeat: repeat-x;
     border-radius: .357rem;
     box-shadow: 0 4px 8px 0 rgba(34, 41, 47, .12);
     max-width: 75%;

 }
#glp-content-chat .chat-left .chat-body .chat-content {
     float: left;
     margin: 0 0 10px 1rem;
     color: #6e6b7b;
     background: none;
     background-color: #fff;
 }

.dot {
    display: inline-block;
    width: 5px !important;
    height: 5px !important;
    border-radius: 50%;
    margin-right: 3px;
    background: #303131;
    animation: wave 1.3s linear infinite;
}

@keyframes wave {
    0%, 60%, 100% {
        transform: initial;
    }

    30% {
        transform: translateY(-15px);
    }
}
.dot:nth-child(2) {
     animation-delay: -1.1s;
 }

.dot:nth-child(3) {
     animation-delay: -0.9s;
 }
.unseen {
    margin-left: 0px !important;
    margin-bottom: 15px;
}

body #glp-box-content {
    overflow-y: scroll;
    height: calc(100% - 71px);
    scrollbar-width: none;
    width: 100%;
}
.usersListBlock {
    height: 100%;
    overflow-y: auto;
}
.chatZone {
    height: 100%;
}
.chatZ {
    height: 100%;
}
body[size="desktop"][height="large"] .chat-section {
    height: 100%;
    display: flex;
    flex-wrap: wrap;
}
.userDetails {
 position: absolute;
 right: 0;
 z-index: 999999999999999;
 height: 100%;
 overflow-y: auto;
 padding-bottom: 35px;
}

body[size="vertical_full"][height="large"] .userDetails {
 position: fixed;
 right: 0;
 z-index: 999999999999999;
 top: 0;
 background-color: #FFF;
}
.icon.icon-phone-off {
 font-size: 18px;
 background-color: red;
 padding: 10px 10px 10px 10px;
 border-radius: 100px;
 color: #FFF;
}

.icon.icon-phone {
 font-size: 18px;
 background-color: #149d10;
 padding: 10px 10px 10px 10px;
 border-radius: 100px;
 color: #FFF;
}
.shepherd-enabled.shepherd-target #tour {
    pointer-events: none !important;
}
.ctaBtn {
    color: #FFF !important;
    width: 25px;
    height: 25px;
    padding: 0px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px !important;
}
.filters {
    background-color: #f8f8f8;
    border-radius: 10px;
    margin-bottom: 20px;
}
.message.message-client.col-12.pb-2 {
    background-color: #f0f0f0;
    border-radius: 10px;
}

table.dataTable thead .sorting::before, table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_desc_disabled::before {
  display: none !important;
}
table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::after {
  display: none !important;
}

button[data-toggle="collapse"] {
    box-shadow: none;
    padding: 0px;
    font-weight: 600;
}

.faqCard {
    background-color: #f7f7f7;
    border-radius: 7px !important;
}

.alert-body strong {
display: flex;
align-items: center;
}

.card-header h2 {
  display: flex;
align-items: center;
}

.users-list .closed {
  margin-left: 0px !important;
  margin-bottom: 15px;
}

.dropdown-toggle.nav-link.dropdown-more-link {
    color: #333 !important;
}
.dropdown.dropdown-more.nav-item {
  list-style: none !important;
}
.head-nav {
    display: flex;
    align-items: center;
}
.dropdown-toggle.nav-link.dropdown-more-link:after {
    display: none;
}
.blankChat {
    background-color: #FFFFFF;
}
.blankChatimg {
    width: 400px;
}
.card-body.users-list {
    border-right: 1px solid #eee;
}
.detailsZone.col-md-3.p-1 {
    border-left: 1px solid #eee;
    overflow-y: auto;
}
.faq-content-p {
    font-size: 12px;
}

.unseen .chat-user-message.text-truncate.mb-0.font-size-13 {
    font-weight: 700;
    color: #4c4c4c;
}

.users-list li + li {
    margin-left: 0px !important;
}

.callActive .row.mobLarge {
    width: 100%;
    margin: 0px;
}

.departmentsList label {
    display: block;
    margin-bottom: 4px;
}
.col-12.col-md-6.departmentsList {
    height: 300px;
    overflow-y: auto;
}