.disabled {
  opacity: 0.5; /* Adjust the opacity to your preference */
  pointer-events: none; /* This prevents interactions with the element */
}
.anvaix-logo{
  width: 45% !important;
  height: 45% !important;
}
.tool-div{
  max-height: 85vh !important;
  overflow: auto;
}
@keyframes flash {
  0% { background-color: transparent; }
  50% { background-color: rgb(255, 242, 0); }
  100% { background-color: transparent; }
}

/* apply the animation to the element */
.flash {
  animation-name: flash;
  animation-duration: 1s; /* set the duration of the animation */
  animation-iteration-count: infinite; /* set the number of times to repeat the animation */
}
.flash-5 {
  animation-name: flash;
  animation-duration: 1s; /* set the duration of the animation */
  animation-iteration-count: 5; /* set the number of times to repeat the animation */
}
.flash-3 {
  animation-name: flash;
  animation-duration: 1s; /* set the duration of the animation */
  animation-iteration-count: 3; /* set the number of times to repeat the animation */
}

.flash-2 {
  animation-name: flash;
  animation-duration: 1s; /* set the duration of the animation */
  animation-iteration-count: 2; /* set the number of times to repeat the animation */
}

.flash-1 {
  animation-name: flash;
  animation-duration: 1s; /* set the duration of the animation */
  animation-iteration-count: 1; /* set the number of times to repeat the animation */
}


.border-top{
  border-top: 1vh solid #016c8d !important;
}
.row{
  overflow: auto !important;
  padding-bottom: 1.7vh !important;
}
#app{
  overflow: auto;
  max-height: 100%;
  height: 100%;
}
.nav li { 
  padding-left: 0.5vh;
 } 


.aside-nav{
  /* min-height: 70vh !important; */
}
.aside-logo{
  display: block !important;
}
.system-logo{
  background: url('/images/System/logo.png') no-repeat center;
  background-size: contain;
  height: 10vh;
}
.anvaix-logo{
  background: url('/images/System/anvaix-full.png') no-repeat center;
  background-size: contain;
  height: 20vh;
}

.navbar-nav {
  border-bottom-left-radius: 1.5rem;
}

.vertical .main-content,
.vertical.hover .main-content,
.narrow.open .main-content {
  height: 93vh !important;
  overflow: auto;
}

body{
  /* overflow: hidden !important; */
}
.main-content{
  border-top-left-radius: 0.5rem !important;
}
.vertical .sidebar-left,
.vertical.hover .sidebar-left,
.narrow.open .sidebar-left {
  box-shadow:none !important;
}

.table{
  width: 100% !important;
}
#print-logo{
  width: 100%;
  height: 100%;
  z-index: 9999999;
  position: fixed;
  opacity: 0.1;
  background-size: 50%;
  background: url('/images/System/print-logo.png') no-repeat center;
}
.modal {
  overflow-y:auto;
}
.system-massage-span{
  float: right;
}
.system-massage{
  text-align: center;
  /* float: right; */
  top: 0;
  z-index: 9999999;
  width: 100%;
  max-height: 20vh;
  overflow: auto;
}
.system-msg-div{
  position: absolute;
  display: grid;
  width: 100%;
  padding: 1rem;
  /* right: 0rem; */
  top: 9vh;
  max-height: 100vh;
  overflow: auto;
}
.app-top-nav{
  /* position: fixed; */
  z-index:999;
  width: -moz-available;
  width: -webkit-fill-available;  
  width: fill-available;
  width: stretch;
  /* min-width:80%; */
}
.bg-custom-light{
  /* border-bottom-left-radius: 5rem; */
  border-radius: 5rem;
  /* border-left: 10rem; */
}
.side-link-group{
  
  /* border: #4e73df 2px solid; */
  border-radius: 25px;
  width: 110% !important;
}
.select2-selection__rendered{
  color: black;
}
.icon-box {
    color: #fff;		
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: -70px;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    z-index: 9;
    background: #82ce34;
    padding: 15px;
    text-align: center;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
  }
.icon-box i {
  font-size: 58px;
  position: relative;
  top: 3px;
}

.nav-link:hover{
  border-radius: 25px;
}

.side-module-title{
  /* border: #4e73df 2px solid; */
  /* border-radius: 25px; */

}

.modal-full-fix{
  display: initial !important;
  max-width: 85%;
}
.rate{

  border-bottom-right-radius: 12px;
  border-bottom-left-radius: 12px;
  
  }
  
  
  
  .rating {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center
  }
  
  .rating>input {
  display: none
  }
  
  .rating>label {
  position: relative;
  width: 1em;
  font-size: 30px;
  font-weight: 300;
  color: #FFD600;
  cursor: pointer
  }
  
  .rating>label::before {
  content: "\2605";
  position: absolute;
  opacity: 0
  }
  
  .rating>label:hover:before,
  .rating>label:hover~label:before {
  opacity: 1 !important
  }
  
  .rating>input:checked~label:before {
  opacity: 1
  }
  
  .rating:hover>input:checked~label:before {
  opacity: 0.4
  }

  /*  ******************************** chat css  */

  .chat-app .people-list {
    width: 280px;
    position: absolute;
    left: 0;
    top: 0;
    padding: 20px;
    z-index: 7
}

.chat-app .chat {
    margin-left: 280px;
    border-left: 1px solid #eaeaea
}

.people-list {
    -moz-transition: .5s;
    -o-transition: .5s;
    -webkit-transition: .5s;
    transition: .5s
}

.people-list .chat-list li {
    padding: 10px 15px;
    list-style: none;
    border-radius: 3px
}

.people-list .chat-list li:hover {
    background: #efefef;
    cursor: pointer
}

.people-list .chat-list li.active {
    background: #efefef
}

.people-list .chat-list li .name {
    font-size: 15px
}

.people-list .chat-list img {
    width: 45px;
    border-radius: 50%
}

.people-list img {
    float: left;
    border-radius: 50%
}

.people-list .about {
    float: left;
    padding-left: 8px
}

.people-list .status {
    color: #999;
    font-size: 13px
}

.chat .chat-header {
    padding: 15px 20px;
    border-bottom: 2px solid #f4f7f6
}

.chat .chat-header img {
    float: left;
    border-radius: 40px;
    width: 40px
}

.chat .chat-header .chat-about {
    float: left;
    padding-left: 10px
}

.chat .chat-history {
    padding: 20px;
    border-bottom: 2px solid #fff;
    max-height: 70vh;
    overflow: auto;
}

.chat .chat-history ul {
    padding: 0
}

.chat .chat-history ul li {
    list-style: none;
    margin-bottom: 30px
}

.chat .chat-history ul li:last-child {
    margin-bottom: 0px
}

.chat .chat-history .message-data {
    margin-bottom: 15px
}

.chat .chat-history .message-data img {
    border-radius: 40px;
    width: 40px
}

.chat .chat-history .message-data-time {
    color: #434651;
    padding-left: 6px
}

.chat .chat-history .message {
    color: #444;
    padding: 18px 20px;
    line-height: 26px;
    font-size: 16px;
    border-radius: 7px;
    display: inline-block;
    position: relative;
    width: 100% !important;
}

.chat .chat-history .message:after {
    bottom: 100%;
    left: 7%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-bottom-color: #fff;
    border-width: 10px;
    margin-left: -10px
}

.chat .chat-history .my-message {
    background: #efefef
}

.chat .chat-history .my-message:after {
    bottom: 100%;
    left: 30px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-bottom-color: #efefef;
    border-width: 10px;
    margin-left: -10px
}

.chat .chat-history .other-message {
    background: #e8f1f3;
    text-align: right
}

.chat .chat-history .other-message:after {
    border-bottom-color: #e8f1f3;
    left: 93%
}

.chat .chat-message {
    padding: 20px
}

.online,
.offline,
.me {
    margin-right: 2px;
    font-size: 8px;
    vertical-align: middle
}

.online {
    color: #86c541
}

.offline {
    color: #e47297
}

.me {
    color: #1d8ecd
}

.float-right {
    float: right
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

@media only screen and (max-width: 767px) {
    .chat-app .people-list {
        height: 465px;
        width: 100%;
        overflow-x: auto;
        background: #fff;
        left: -400px;
        display: none
    }
    .chat-app .people-list.open {
        left: 0
    }
    .chat-app .chat {
        margin: 0
    }
    .chat-app .chat .chat-header {
        border-radius: 0.55rem 0.55rem 0 0
    }
    .chat-app .chat-history {
        height: 300px;
        overflow-x: auto
    }
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    .chat-app .chat-list {
        height: 650px;
        overflow-x: auto
    }
    .chat-app .chat-history {
        height: 600px;
        overflow-x: auto
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
    .chat-app .chat-list {
        height: 480px;
        overflow-x: auto
    }
    .chat-app .chat-history {
        height: calc(100vh - 350px);
        overflow-x: auto
    }
}