
.datepicker-dropdown-menu {
  width: 100%;
}


.card-info {
  border-left: 4px solid var(--bs-info);
}

.card-success {
  border-left: 4px solid var(--bs-success);
}

.card-danger {
  border-left: 4px solid var(--bs-danger);
}

.day-width {
  width: 100%;
}

@media (min-width: 768px) {
    .day-width {
        width: 14.285%;
    }
}

.cursor-pointer {
  cursor: pointer;
}

.sidebar {
  width: 350px;
  height: 100%;
  background: var(--bs-dark);
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 56px;
  right: -350px; /* Hide it off-screen initially */
  transition: right 0.3s ease;
  z-index: 1050; /* To be above other content */
  padding: 0.5rem 1.5rem;
  align-items: flex-start;
}

.sidebar.show {
  right: 0; /* Slide in */
}

 /*Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    .sidebar {
        right: 0; /* Always visible on desktop */
        position: static; /* Change position */
        height: auto; /* Adjust height */
        width: auto; /* Adjust width */
        display: flex; /* Use flex for layout */
        flex-direction: row;
        padding: 0;
    }
}

.sidebar-overlay {
  position: fixed;
  background: linear-gradient(90deg, rgba(0,0,0, 0.8), rgba(0,0,0,1));
  z-index:999;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

.sidebar-overlay.show {
  opacity: 1;
  visibility: visible;
}

/*Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .sidebar-overlay {
    display: none !important;
  }
}

.weekly-loader {
  width: 100%;
  padding-bottom: 50%;
  position: relative;
  background: white;
}