html,
 body {
     font-family: 'Noto Sans Thai';
 }
    a{
        text-decoration: none;
    }
   a,
   a:hover {
       color: inherit;
   }

button:hover, .button:hover, .btn:hover {
    color: #fff !important;
    background: #555;
    box-shadow: 0px 0px 3px #00000099;
}

#loading {
    background: #000000aa;
    position: fixed;
    z-index: 999999999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#loading .btn {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    position: fixed;
    width: 50%;
    height: 100px;
}

 
  #flex-container {
      display: flex;
      box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.2);
  }

  .header_bar_css_1 {
      color: #6D6E70;
      margin: 0px;
      font-size:1.5rem;
      font-weight: bold;
  }

  .header_bar_css_1 .icon {
    font-size: 2rem;
    margin-right: 1rem;
  }

  #header_bar_css_2 {
      color: #6D6E70;
      margin: 0px;
  }

  #open_menu_css_1 {
      flex: 4;
      text-align: left;
      align-self: center;
  }

  #open_menu_css_2 {
      flex: 2;
      text-align: right;
      align-self: center;
  }

  #open_menu_css_3 {
      flex: 1;
      text-align: center;
      align-self: center;
  }

  img.rounded-circle {
      height: 50px;
      width: 50px;
  }

  #logout_css_1 {
      font-size: 1.5rem;
      padding: 0px;
  }


/**Table**/
.fixedHeader-floating th{
    background: #fff;
}

.fixedHeader-floating {
    border-collapse: collapse; 
}

/**Form**/
#form-save-block {
    position:fixed;bottom: 0;background: #00000066;width: inherit; text-align: center;padding: 1rem; z-index: 1;
}
    #form-save-block button{
        font-size: 1.2rem;
    }
.form-selection {
    font-weight: bold;
}


.floating-icon {
    background: #9BABB8;
    color: #fff;
    position: fixed;
    z-index: 999;
    top: 0;
    bottom: 0;
    margin: auto;
    right: -70px;
    font-size: 30px;
    border-radius: 50%;

    height: 55px;
    width: 55px;
    
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 1px 1px 5px #00000066;
    cursor: pointer;
    /* transform: translate(0, 50%); */
    /* transition: all 1s ease; */
}

.float-num {
    position:absolute;
    border-radius: 50%;
    background:red;
    font-size: 0.8rem;
    width: 25px;
    height: 25px;

    display: flex;
    justify-content: center;
    align-items: center;
    
    top: -10px;
    left: -5px;
    color: #fff;
}

.bounce {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight;
}


 @keyframes bounceInRight {
     0% {
         opacity: 0;
         transform: translateX(2000px);
     }

     60% {
         opacity: 1;
         transform: translateX(-30px);
     }

     80% {
         transform: translateX(10px);
     }

     100% {
         transform: translateX(0);
     }
 }

 .text-bold{
    font-weight: bold;
 }

 .input-group{
    margin-bottom: 1rem;
 }

    .input-group .input-group-text {
        /* min-width: 15%; */
        min-width: 150px;
    }
    .input-group .input-group-text.bg-blue {
        /* min-width: 15%; */
        min-width: 150px;
        background-color: #044D94 !important;
        color : white !important;
        border-color: #044D94;
    }

    .input-group .input-group-text.bg-violet {
        /* min-width: 15%; */
        min-width: 150px;
        background-color: #2D1C8B !important;
        color : white !important;
        border-color: #2D1C8B;
    }
#row-d {
    padding-bottom: 1.5rem;
}

#d-card-bg-blue {
    background-color: #D8EAFE;
    padding: 1rem 0.5rem;
    border-radius: 1rem;
    box-shadow: 6px 6px 12px 2px rgba(0, 0, 0, 0.15);
}

#d-card-bg-violet {
    background-color: #E2DBFA;
    padding: 1rem 0.5rem;
    border-radius: 1rem;
    box-shadow: 6px 6px 12px 2px rgba(0, 0, 0, 0.15);
}
.em-sign{
    color: red;
}

.form-control:not(:required){
    background-image: none !important;
    border-color: #ced4da !important;
}

.invalid-tooltip{
    position:relative;
    width: 100%;
}

.card {
    border-radius: 20px;
}


.ui-widget{
    font-family: 'Noto Sans Thai' !important;
   
}

.ui-widget-content.ui-autocomplete{
    z-index: 9999;
    max-height: 50%;
    overflow-y: auto;
}

.ui-widget.custom-combobox{
    max-height: 200px;
   overflow: auto;
}
.custom-combobox {
   position: relative;
   display: inline-block;
    flex: 1;
}
.custom-combobox-toggle {
   position: absolute;
   top: 50%;
   right: 10px;
   transform: translate(0, -50%);
}

.custom-combobox .form-control{
   background-position: right calc(0.375em + 1.1875rem) center !important;
}

.combobox-search-for-add {
    border-radius: 0 !important;
}

/* .dataTables_wrapper{
    overflow-y: auto;
} */

input[readonly]:not(.date):not(.date-optional){
    background: #eee;
}