html,
body {
  height: 100%;
}

.signin-page{
    font-family: 'Roboto', sans-serif;
    margin: 0px;
    padding: 0px;
    background-attachment: fixed;
    background-size: cover;
    font-size: 14px;
    background-image: url('./image/g11.JPG');
    background-position: bottom center;
    display: flex;
}
.register-page{
    width: 100%;
    max-width: 1215px;
    margin: auto;
    background-color: #fff;
    box-shadow: 18px 33px 25px rgb(0 0 0 / 22%);
}

#glDateNotfDt,#glDateDtDeclartion,#glDateWorkingFrom,#glDateWorkingTo,#glDateApproval,#glDatedateB1,#glDatedateB2,#glDatedateC1,#glDatedateC2{
    top:85px !important;
    left:12px !important;
}  


.swal-text {
  
  text-align: center;
  color: rgb(255 3 3);
  
}

.swal-success .swal-text{
  
	text-align: center;
    color: #337d09;
    font-weight: 600;
    font-size: 20px;
  
}
#idOfTheParentDiv li {
  margin-bottom: 15px;
}
#idOfTheParentDiv li a,#idOfTheParentDiv li p{
  font-size: 27px;
}

.text-foward{
  color:#4d2f56;
  font-weight:600;
}
.text-foward-success{
  color:#2b7a19;
  font-weight:600;
}
.form-signin {
    width: 100%;
    max-width: 750px;
    margin: auto;
    background-color: #fff;
    box-shadow: 18px 33px 25px rgb(0 0 0 / 22%);
}
.body-bg-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: -1;
    opacity: 0.6;
}
.login-left-box{
    
    background-color: #06357b;
    background-repeat: no-repeat;
    box-sizing: border-box;
    padding: 5px 15px;
    background-position: 27% 27%;
    height: 100%;
}
.login-left-box img{
  width: 35%;
  height: 160px;
}

.signin-page form{
    padding: 15px;
    display: table;
    width: 100%;
}

.login-left-box p {
    color: #fff;
    font-size: 17px;
    line-height: 33px;
}

.required label:after {
    color: #e32;
    content: ' *';
    display:inline;
}
.form-signin .checkbox {
  font-weight: 400;
}

.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}


.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
/*  Dashboard */

.sidebar-dark{
  background-color: #06357b;
}

.sidebar-dark  img{
  width: 60px;
}
.color_white{
	color:#fff;
}
.sidebar .sidebar-card p{
  font-size: 16px;
}
.sidebar .sidebar-brand{
  height: auto;
  text-transform: capitalize;
  padding: 5px;
  text-align: left;
}
.sidebar .sidebar-brand p{
  font-size: 16px;
}

.sidebar-dark #sidebarToggle {
  width: 2.5rem;
  height: 2.5rem;
  text-align: center;
  margin-right: 10px;
  cursor: pointer;
}
.sidebar-dark #sidebarToggle::after {
  font-weight: 900;
  content: '\f104';
  font-family: 'Font Awesome 5 Free';
  margin-right: 0.1rem;
}
.sidebar-dark.toggled #sidebarToggle::after {
  content: '\f105';
  font-family: 'Font Awesome 5 Free';
  margin-left: 0.25rem;
}

.table-bordered td, .table-bordered th {
  border: 1px solid #46474a;
}
.sidebar-dark .nav-item.active .nav-link {
  color: #fff;
  background: #fff;
  color: #06357b;
}

.sidebar-dark .nav-item.active .nav-link i {
  color: #06357b;
}
footer.sticky-footer {
  padding: 10px 0;
  flex-shrink: 0;
}

.holder img{
  width: 100px;
  height: 85px;
  border-radius: 2px;
}
.previewfrm img{
  width:120px;
  
}

.disabledLis {
  pointer-events: none;
  opacity: 0.6;
}

.modalBackground {
  background-color: #000;
  filter: alpha(opacity=70);
  opacity: 0.6;
  z-index: 100;
}
@media (min-width: 768px){
  .sidebar .sidebar-brand .sidebar-brand-text {
    display: block;
}

}

@media print {
  #printPageButton {
  display: none;
  }
}


  @media (min-width: 768px) {
    .bd-placeholder-img-lg {
      font-size: 3.5rem;
    }
  }
  
  /* Customize holiday color */
    .datepicker-holiday {
      background-color: #28a745 !important;
      color: #fff !important;
    }

    /* Custom calendar with responsive size */
    #calendarContainer {
      width: 100%;
      max-width: 100%;
      overflow: hidden;
    }

    .custom-calendar {
      width: 100%;
      height: 100%;
    }

    .datepicker table {
      width: 100%;
    }

    /* Customizing datepicker appearance */
    .datepicker {
      font-family: Arial, sans-serif;
    }

    .datepicker th, .datepicker td {
      text-align: center;
      padding: .75rem;
      font-weight: 600;
    }

    .datepicker table {
      border-collapse: collapse;
      width: 100%;
    }

    .datepicker table thead th {
      color: #0d6efd;
      border: 1px solid #dee2e6;
    }

    .datepicker table tbody td {
      border: 1px solid #dee2e6;
    }

    .datepicker table tbody td:hover {
      background-color: #f8f9fa;
      cursor: pointer;
    }
	.datepicker-inline {
		
		width: 100% !important;
	}
    @media (max-width: 768px) {
      /* Adjust size for smaller devices */
      #calendarContainer {
        height: 300px; /* Reduced height for smaller screens - adjust as needed */
      }
    }
	
	#leave1{
		background-color: #4674a9;
		padding: 5px;
	}
	
	#leave2{
		background-color: #9237bc;
		padding: 5px;
	}
	
	#leave3{
		background-color: #334938;
		padding: 5px;
	}
	
	#leave4{
		background-color:#4d2f56;
		padding: 5px;
	}
	
	.holiday-type-info {
      margin-top: 20px;
    }

    .holiday-type-info ul {
      list-style: none;
      padding: 0;
    }

    .holiday-type-info li {
      margin-bottom: 5px;
    }

    .holiday-type-info span {
      display: inline-block;
      width: 20px;
      height: 20px;
      margin-right: 5px;
      border-radius: 50%;
    }

    .holiday-gazetted, .holiday-gazetted:hover {
      background: #e61340 !important;
	  color: #fff;
    }

    .holiday-restricted , .holiday-restricted:hover{
      background: #2dc909 !important;
	  color: #fff;
    }

    .datepicker-weekend, .datepicker-weekend:hover {
		background: #4d2f56 !important;
		color: #fff;
    }
    .datepicker table tr td.new, .datepicker table tr td.old {
      color: #9999993d;
  }
  
       .timeline {
      list-style-type: none;
      position: relative;
      padding-left: 40px;
      margin-top: 20px;
    }

    .timeline::before {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      left: 20px;
      width: 2px;
      background-color: #ced4da;
      margin-left: -1.5px;
    }

    .timeline-item {
      margin-bottom: 20px;
      position: relative;
    }

    .timeline-item::before {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      left: -10px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: #fff;
      border: 2px solid #ced4da;
    }

    .timeline-body {
     
      padding: 20px;
      border-radius: 8px;
      border: 1px solid #ced4da;
    }

    .timeline-item::before {
      background-color: blue; /* Set the second last circle (before the final one) as blue */
    }
	
    
	
	.timeline-item.reject::before {
      background-color: red; /* Set the last circle as green */
    }
	
	.timeline-item.approve::before {
      background-color: green; /* Set the last circle as green */
    }
	
	.overlay {
		position: fixed;
		top: 50%;
		left: 50%;
	 }
	 
	#spinner {
		background: #14141466;
		position: fixed;
		width: 100%;
		top: 0;
		z-index: 9;
		height: 100%;
	}