.calender-container {
  margin-top: .5em;
  font-size: .7em;
  display: flex;
  gap: .3em;
  justify-content: space-evenly;
}

.month {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: rgb(51, 50, 50);
  border-radius: .5em;
  padding: .3em 0;
}

.month-title {
  font-weight: bold;
  color: var(--color-paleblue);
  text-transform: uppercase;
}

.days-labels {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  gap: .5em;
}

.days-labels div {
  width: 100%;
  text-align: center;
}

.weekends-rows {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
}



.day {
  text-align: center;
  width: 100%;
}

.day-passed {
  color: rgba(255, 255, 255, 0.247);
}

.bi-star-fill {
  color: red;
}