.max_contener{
  max-width: 900px !important; 
  margin: 0 auto;
}
  /* Increase font size for all inputs with .form-control */
  .form-control {
    font-size: 15px !important; /* Adjust size as needed */
    height: 50px; /* Optional: Increase input height */
    line-height: 1.5; /* Improve spacing */
}
.date_input{
  max-width: 837px !important;
}
.date_input select{
  font-size: 20px !important; /* Adjust size as needed */
  color: black !important;
}
.select_img:hover {
  opacity: 0.7;
}

.select_menu:hover {
  opacity: 0.7;
  color: blue;
  cursor: pointer;
}

/*File Upload*/
.upload-file2 {
  text-indent: -999px;
  outline: none;
  width: 100%;
  height: 45px;
  color: rgba(0, 0, 0, 0) !important;
}

.upload-file2-text {
  pointer-events: none;
  margin-top: -36px !important;
  text-align: center;
  color: #FFF;
  height: 10px;
  text-transform: uppercase;
  font-weight: 900;
}

.text_gray{
  color: #777777 !important;
}
.text_space{
  line-height: 0 !important;
}


.modal_content_scroll {
  overflow-y: auto;
  max-height: 85vh; /* adjust as needed */
}



/* time line list */
ul.timeline {
  list-style-type: none;
  position: relative;
}
ul.timeline:before {
  content: ' ';
  background: #d4d9df;
  display: inline-block;
  position: absolute;
  left: 29px;
  width: 2px;
  height: 100%;
  z-index: 400;
}
ul.timeline > li {
  margin: 20px 0;
  padding-left: 20px;
}
ul.timeline > li:before {
  content: ' ';
  background: white;
  display: inline-block;
  position: absolute;
  border-radius: 50%;
  border: 3px solid #4A89DC;
  left: 20px;
  width: 20px;
  height: 20px;
  z-index: 400;
}
.timeline-icon {
  position: absolute;
  left: 15px;

  width: 30px;
  height: 30px;
  background-color: #fff;
  /* border: 2px solid #007bff;
  border-radius: 50%; */
  text-align: center;
  line-height: 26px;
  font-size: 14px;
  color: #007bff;
  z-index: 401;
}



input[readonly] {
  background-color: #e1e1e1 !important; /* Set to any color you want */
}

.txt_sheet{
  width: 100%;
  padding: 2px;
}
.border_b{
  border-bottom: 1px solid #2e86c1 !important;
}
.border_l{
  padding-left: 3px !important;
  border-left: 1px solid #2e86c1 !important;
}
.tbl_title_sheet{
  background-color: #d9dbee;
}
.textbox_button{
  width: 40px;
  height: 38px;
}
.text_center{
  text-align: center;
}

.margin_2_auto{
  margin: 20px auto;
  width: 95%;
}



#modal_top_success {
  z-index: 203 !important;
}
    /* Custom backdrop for second modal */
.custom_success-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 202;
      display: none;
}

.custom_success-hider.active {
      display: block;
}

#modal_top_info {
  z-index: 201 !important;
}
    /* Custom backdrop for second modal */
.custom_info-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 200;
      display: none;
}

.custom_info-hider.active {
      display: block;
}


#modal_top_error {
  z-index: 205 !important;
}
    /* Custom backdrop for second modal */
.custom_error-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 204;
      display: none;
}

.custom_error-hider.active {
      display: block;
}

#modal_top_confirm {
  z-index: 205 !important;
}
    /* Custom backdrop for second modal */
.custom_confirm-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 204;
      display: none;
}

.custom_confirm-hider.active {
      display: block;
}

#modal_top_calculator {
  z-index: 202 !important;
}
    /* Custom backdrop for second modal */
.custom_calculator-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 201;
      display: none;
}

.custom_calculator-hider.active {
      display: block;
}

.table_calculator{
  text-align: center;
    vertical-align: middle;
    padding-left: 10px;
    padding-right: 10px
}
.table_calculator td,
.table_calculator th {
  padding: 0px;       /* Use padding instead of margin */
  padding-left: 5px;
  padding-right: 5px;
}






    /* Second modal higher z-index */
    #modal_first {
      z-index: 100 !important;
    }

    /* Custom backdrop for second modal */
    .custom_first-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 99;
      display: none;
    }
    .custom_first-hider.active {
      display: block;
    }


    /* Second modal higher z-index */
    #modal_second {
      z-index: 102 !important;
    }

    /* Custom backdrop for second modal */
    .custom_second-hider {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 101;
      display: none;
    }

    .custom_second-hider.active {
      display: block;
    }

        /* Third modal higher z-index */
        #modal_third {
          z-index: 104 !important;
        }
    
        /* Custom backdrop for Third modal */
        .custom_third-hider {
          position: fixed;
          top: 0; left: 0;
          width: 100%; height: 100%;
          background: rgba(0, 0, 0, 0.5);
          z-index: 103;
          display: none;
        }
    
        .custom_third-hider.active {
          display: block;
        }
    


.toast_layer{
  z-index: 9999 !important;
}        



.show_dot_txt_1 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  /* limit 1 line */
  -webkit-line-clamp: 1; 
  overflow: hidden;
  text-overflow: ellipsis;
}

.show_dot_txt_2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
    /* limit 2 line */
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}



.editor_display img {
  max-width: 100%; /* Ensure images do not exceed the container's width */
  height: auto; /* Maintain aspect ratio */
  display: block; /* Prevent inline display issues */
  margin: 10px auto; /* Center images and add spacing (optional) */
}
.editor_display p {
  padding-bottom: 3px;
  margin-bottom: 1px;
}
.font_text_editor{
	font-family: 'Verdana', Arial, 'Hanuman','Source Sans Pro' !important; 
	font-size: 15px;
}

.img_input_box{

}
.img_input_box .img_input_box_i{
  margin-top: -13px !important;
}
.img_input_box img {
  width: 30px;
}

.btn-click-effect:active {
  transform: scale(0.95);
  transition: transform 0.1s ease;
}




/* count down timer circle */

#countdown {
  position: relative;
  margin: auto;
  margin-top: 0px;
  height: 40px;
  width: 40px;
  text-align: center;
}

#countdown-number {
  color: #F6BB42 ;
  display: inline-block;
  line-height: 40px;
}

#countdown svg {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  transform: rotateY(-180deg) rotateZ(-90deg);
}

#countdown svg circle {
  stroke-dasharray: 113px;
  stroke-dashoffset: 0px;
  stroke-linecap: round;
  stroke-width: 2px;
  stroke: #F6BB42 ;
  fill: none;
  animation: countdown 30s linear infinite forwards;
}

@keyframes countdown {
  from {
    stroke-dashoffset: 0px;
  }
  to {
    stroke-dashoffset: 113px;
  }
}

/* End count down timer circle */