#calendar {
  border: 1px solid #c6c6c6;
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.calendar-title {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  background-color: #a2abf8;
  width: 100%;
}
.row.header {
  height: 30px;
  text-align: center;
  margin-right: 0px !important;
  margin-left: 0px !important;
}
.row.header .week-cell {
  border: 1px solid #c6c6c6;
}
.row.week {
  /* height: 80px; */
  margin-right: 0px !important;
  margin-left: 0px !important;
}
.row.week .col {
  padding-top: 4px;
  padding-bottom: 4px;
}
.row.week .col.date-cell {
  border: 1px solid #c6c6c6;
  background-color: #fafafa;
  /* transition: background-color 0.2s ease, color 0.2s ease; */
}
.row.week .col.date-cell.sunday-cell {
  background-color: #ffd8d6 !important;
}
.row.week .col.date-cell.saturday-cell {
  background-color: #acdfff !important;
}
.blank-cell {
  background-color: #eeeeee !important;
  border: 1px solid #c6c6c6;
}
.frame {
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  border: 2px solid rgba(255, 255, 255, 1);
  background-color: white;
}
.frame .frame-text {
  flex-grow: 1;
  padding-left: 7px;
  display: flex;
  align-items: center;
}
.frame.frame-active .frame-text {
  background-color: rgb(255, 255, 255);
}
.frame.frame-active .frame-status {
  background-color: lightgreen;
  color: white;
  padding: 1px 3px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.frame.frame-active:hover {
  color: #35aa35;
  box-shadow: rgba(0, 0, 0, 0.15) 3.95px 3.95px 4.6px;
  border: 2px solid #35aa35;
  cursor: pointer;
  font-weight: bold;
  transition: color 0.3s ease, box-shadow 0.3s ease, border 0.3s ease,
    font-weight 0.3s ease;
}

.frame.frame-inactive .frame-status {
  background-color: rgb(122, 122, 122);
  color: white;
  padding: 1px 3px;
}
.frame.frame-inactive .frame-text {
  background-color: rgb(205, 205, 205);
}

.today-day {
  background-color: #ffde5a;
  border-radius: 50%;
}