/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.menu .app-brand.demo {
  height: 85px;
  margin-top: 0px;
}

.app-brand-logo.demo svg {
  width: 55px;
  height: auto;
}

.app-brand-text.demo {
  font-size: 1rem;
  letter-spacing: 0;
  line-height: 22px;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
/* Detached navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
  padding-top: 76px !important;
}
/* Default navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
  display: block !important;
}
tbody#datalisthere tr td.text-nowrap {
    white-space: normal !important;
    word-wrap: break-word;
    max-width: 250px;
}
.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.rtl-only {
  display: none !important;
  text-align: left !important;
  direction: ltr !important;
}

[dir='rtl'] .rtl-only {
  display: block !important;
}
#user-list-table tr td {
    border: 1px solid rgb(0 0 0 / 10%) !important;
}
#user-list-table tr td {
    white-space: nowrap;
}

#data-removal-table tr td {
  border: 1px solid rgb(0 0 0 / 10%) !important;
}
#data-removal-table tr td {
  white-space: nowrap;
}
/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1rem;
}

.edit_btn, .delete_btn, .active_inactive, .view_btn {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 8px;
}

.sm-md-btn {
  padding: 5px 13px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  min-width: auto;
}
.card-datatable .dt-container .dt-layout-row:nth-of-type(1) {
  margin: 0 !important;
  padding: 0;
  padding: 10px 5px;
    
    margin: 0;
}
.dt-length {
  display: flex;
  gap: 10px;
  align-items: center;
}



.datatype-class  .dt-length {
  display: flex;
  gap: 10px;
}
.datatype-class  select{order: 2;}
div.dt-container div.dt-layout-row{margin-top: 0 !important;}
div.dt-container.dt-empty-footer tbody>tr:last-child>* , table.dataTable>thead>tr>th, table.dataTable>thead>tr>td{
  border: 1px solid rgb(0 0 0 / 10%) !important; 
}
.btn-list-group .btn-group a { 
  border-radius: 15%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 7px 7px;
  border: solid 1px;
  font-size: 14px;
  opacity: 1;
  box-shadow: 0px 2px 4px 1px rgb(14 12 149 / 10%);
  border-color: #d3d3d3;
  background: #ffffff;
}
a.bx.info.float-left.active_inactive.mr-1.bxs-dislike.text-danger {
  color: #bc3266 !important;
    background-color: #fff2f7;
    border-color: #ffcbde;
}

.btn-list-group .btn-group{
  gap: 10px;
}
 
.datatype-class .dt-container .dt-layout-row:last-child, 
.datatype-class .dt-container .dt-layout-row:nth-of-type(1) input, 
.datatype-class .dt-container .dt-layout-row:nth-of-type(1) label
.datatype-class .dt-container .dt-layout-row:nth-of-type(1) select{
 
  font-size: 14px;
}
 
div.dt-container .dt-paging .dt-paging-button.disabled, div.dt-container .dt-paging .dt-paging-button.disabled:hover, div.dt-container .dt-paging .dt-paging-button.disabled:active {
  cursor: default;
  color: rgb(55 70 129) !important;
  border: 1px solid #37468154 !important;
  background: transparent;
  box-shadow: none;
}
table.dataTable thead>tr>th.dt-orderable-asc:hover, table.dataTable thead>tr>th.dt-orderable-desc:hover, table.dataTable thead>tr>td.dt-orderable-asc:hover, table.dataTable thead>tr>td.dt-orderable-desc:hover {
  outline: 0px solid rgba(0, 0, 0, 0.05) !important;
  outline-offset: 0 !important;
  background: #fbfbfb !important;
}
 
.toast h6 {
  font-size: 14px !important;
}
.swal2-container { 
  z-index: 9999 !important;
}

.toast h5 {
  font-size: 15px !important;
  font-weight: bold;
}
.toast.alert-success {
  background-color: rgb(85 225 76);
}

.toast {
  padding: 0;
}
.swal2-modal .swal2-content {
  font-size: 15px !important; 
  font-weight: 400 !important; 
}
.swal2-modal h2 { 
  font-size: 25px !important; 
  line-height: 39px !important; 
}
.end-10{right: 10px;}
button.swal2-confirm.swal2-styled{
  color: #fff !important;
  background-color: #374681 !important;
  border-color: #374681 !important;
      border-radius: 100px;
    padding: 10px 0px;
/*  box-shadow: 0 0.125rem 0.25rem 0 rgba(105, 108, 255, 0.4);*/
min-width: 120px;
}
button.swal2-cancel.swal2-styled{
  color: #374681 !important;
  background-color: #fff !important;
  border: solid 1px #374681 !important;
      border-radius: 100px;
    padding: 10px 0px;
/*  box-shadow: 0 0.125rem 0.25rem 0 rgba(105, 108, 255, 0.4);*/
min-width: 120px;
}


.z-index-999{z-index: 9999;}
.top-10{top: 10px;}
label { 
  text-transform: capitalize;
}
div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover {
 
  background: linear-gradient(to bottom, rgb(55 70 129) 0%, rgb(55 70 129) 100%) !important;
  color: #fff !important;
}

div.dt-container .dt-length, div.dt-container .dt-search, div.dt-container .dt-info, div.dt-container .dt-processing, div.dt-container .dt-paging,
.table, .table:not(.table-dark) th
{color: #4e5052 !important;}
.card-header h5 {
  font-size: 20px;
  color: #374681;
}

.stat-cards-icon.primary {
  background-color: rgba(47,73,209,.1);
  color: #2f49d1;
}
.stat-cards-icon {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  margin-right: 9px;
}
.stat-cards-icon, .stat-cards-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.stat-cards-info__profit.success {
  color: #4bde97;
}
.stat-cards-info__profit {
  margin-right: 10px;
}
.stat-cards-info__profit, .stat-cards-info__progress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 12px;
  line-height: 1.22;
}
.stat-cards-icon.warning {
  background-color: rgba(255, 182, 72, .1);
  color: #ffb648;
}

.stat-cards-icon.purple {
  background-color: rgba(95, 46, 234, .1);
  color: #5f2eea;
}
.stat-cards-icon.success {
  background-color: rgba(75, 222, 151, .1);
  color: #4bde97;
}
.stat-cards-info__profit.danger {
  color: #f26464;
}
.card.card-sm-dashbord h4 {
  color: #000;
  font-size: 18px;
}
.font-12{font-size: 12px;}

.gradient-user-welocm-box {
  background-color: #038fd1;
  background-image: linear-gradient(11deg, #374681 0%, #090979 35%, #00d4ff 100%);
}

.gradient-user-welocm-box .text-primary, .gradient-user-welocm-box  p {
  color: #ffffff !important;
}
.gradient-user-welocm-box  .btn-outline-primary {
  color: #ffffff;
  border-color: #ffffff;
  background: transparent;
}
.text-bg-warning {
  background-color: #f91 !important;
}
.text-bg-success {
  background-color: #2d9c2d !important;
}
.select2-container--open .select2-dropdown { 
  Z-INDEX: 99999;
}
.select2-container { 
  width: 100% !important;
}

.select2-container--default .select2-selection--single { 
  border-radius: 4px;
  width: 100%;
  padding:6px 0.5rem;
  font-size: 0.8375rem;
  font-weight: 400;
  line-height: 1.53;
  color: #000;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #3d4b8229 !important;
  height: auto !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 36px !important; 
  width: 25px !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #374681 !important;
  color: white;
}


.login-wrapper{
    background-image: url('../../assets/img/backgrounds/loginbg.png');
}

/*######################### call-screen  ##############################*/
.callmodal{
     background-color: hsl(0deg 0% 0% / 78%);
 }
.callmodal .modal-dialog{
    max-width: 1000px;
}
.callmodal .call-header {
  width: 100%;
  height: 74px;
  padding: 5px 15px;
  background-color: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03), 0 10px 40px rgba(0, 0, 0, 0.09);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.callmodal .caller-details p {
  font-size: 20px;
  color: #fff;
}
.callmodal .caller-details h2 {
  color: #fff !important;
  font-size: 35px;
  margin-bottom: 20px;
}

.callmodal .modal-body{
  background: rgb(96, 185, 255);
  background: linear-gradient(190deg, rgb(65 129 179) 0%, rgba(19, 91, 134, 1) 100%);
  padding-bottom: 100px;
  border-bottom-left-radius: calc(0.5rem - 0px);
  border-bottom-right-radius: calc(0.5rem - 0px);
}
.callmodal .modal-content{
        background-color: transparent;
}
.callmodal .caller-id h5 {
  margin: 0;
  font-size: 25px;
  font-weight: bold;
}
.callmodal .call-icon i {
  font-size: 40px !important;
}

@keyframes calling {
  0% {
    opacity: 0.2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 0.2;
  }
}
@keyframes calling2 {
  0% {
    box-shadow: 0px 0px 0px 0px rgba(62, 149, 255, 0.09);
  }
  50% {
    box-shadow: 0px 0px 0px 5px rgba(62, 149, 255, 0.2);
  }
  100% {
    box-shadow: 0px 0px 0px 15px rgb(117 179 255 / 50%);
  }
}
 
.callmodal .caller-id span {
  animation-name: calling;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}
.callmodal .caller-id span:nth-child(2) {
  animation-delay: 0.2s;
}
.callmodal .caller-id span:nth-child(3) {
  animation-delay: 0.4s;
}
.callmodal .caller-id,
.callmodal .caller-time {
  display: table-cell;
}
.callmodal .caller-id {
  width: 50%;
}
.callmodal .caller-time {
  width: 40%;
  text-align: right;
}
.callmodal .caller-img {
  width: 150px;
  border-radius: 50%;
  height: 150px;
  overflow: hidden;
  margin: 15% auto;
  border: 1px solid rbga(0, 0, 0, 0.1);
  animation: calling2 0.8s ease-in-out infinite alternate;
}
.callmodal .caller-img img {
  width: 100%;
}
.callmodal .caller-details {
  width: 100%;
  margin-top: -110px;
  text-align: center;
}
.callmodal .caller-details p {
  margin-top: -15px;
}
.callmodal .caller-control {
  width: 100%;
  text-align: center;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.callmodal .call-icon {
  padding: 12px;
  background-color: #c9dfef;
  border-radius: 50%;
  color: black;
  height: 70px;
  width: 70px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
  transition: 0.5s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
}
div.dt-container .dt-paging .dt-paging-button { 
  border: 1px solid #37468154 !important;
}
.callmodal .call-icon:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.33), 0 10px 40px rgba(0, 0, 0, 0.39);
  transition: 0.5s ease-in-out;
}
.callmodal .call-drop {
  color: red;
}
.callmodal .agent-search-dialog {
  padding: 10px 20px;
  display: none;
} 
div.dt-container .dt-paging .dt-paging-button:hover { 
  background: linear-gradient(to bottom, #374681 0%, #1b2d72 100%) !important;
}
div.dt-container .dt-paging .dt-paging-button.disabled{ background:none !important; opacity: 0.5;}
table.dataTable thead>tr>th.dt-orderable-asc, table.dataTable thead>tr>th.dt-orderable-desc, table.dataTable thead>tr>th.dt-ordering-asc, table.dataTable thead>tr>th.dt-ordering-desc, table.dataTable thead>tr>td.dt-orderable-asc, table.dataTable thead>tr>td.dt-orderable-desc, table.dataTable thead>tr>td.dt-ordering-asc, table.dataTable thead>tr>td.dt-ordering-desc {
 
  white-space: nowrap;
}
tbody#datalisthere tr td { 
  white-space: nowrap;
}
div.dt-container div.dt-layout-row { 
  overflow-x: auto;
  overflow-y: hidden;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #ffffff;
  border: 1px solid #3d5079; 
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
 
  color: #3d5079; 
  line-height: 23px;
}

table.table.pagination_tbl tr th {
    background: #ebeef5;
    border:1px solid rgb(200 206 219) !important;
    color: #222 !important;     white-space: nowrap;
}
div#card_view_result .card {
    border: solid 2px #edf3ff;
    box-shadow: none;    overflow: hidden;
}
div#card_view_result .col-md-4 {
    padding: 0 8px;
}
.lightblue-bg {
    justify-content: space-between;
}
.filter-row .card {
    background: #e9e9e9;
}
.filter-row .card .design-btn {
    background: #fff;
}
 

.filter-row .card .design-btn:hover {
    background: #374681 !important;
}
.swal2-modal.swal2-show{
    width: auto !important;
    height: auto !important;
}
.swal2-icon.swal2-success .line{
    background-color: #4CAF50;
}
.swal2-icon.swal2-success .placeholder{
    border: 4px solid #65d36acf;
    background-color: #4CAF50;
}

.fs-5rem {
    font-size: 5rem;
}
#formAuthentication input:is(:-webkit-autofill, :autofill) {
     background: #f7f8ff !important;
}
@media screen and (max-width: 576px){
    .authentication-wrapper .d-flex{
        flex-wrap: wrap;
    }
    .authentication-wrapper .logo-left-image{
        display: none;
    }
    .authentication-wrapper.authentication-basic .authentication-inner .card{
        min-height: auto !important;
    }
    .authentication-wrapper.authentication-basic .authentication-inner{
            min-width: 350px;
    }
    .authentication-wrapper.authentication-basic .authentication-inner svg{
        margin: auto !important;
    }
    .view_type{
        display: flex;
        flex-wrap: wrap;
    }
    .view_type a{
        margin-bottom: 10px;
    }
    .filter_btn{
        margin-right: 2px;
        padding-left: 2px;
    }
    #map-view #map{
        min-height: 450px;
        margin-top: 15px;
    }
    .add_edit_btn + .add_edit_btn{
        margin-top: 10px;
    }
    #complaint-form .authentication-inner .col-6{
        max-width: 100%;
        flex: 0 0 100%;
    }
}