/* Version: 1.1.1 */

:root {
  --numDays: 4;
  --numHours: 24;
  --unitMinutes: 5;
  --timeHeight: 60px;
  --calBgColorUnavailable: #f5f8ff;
  --calBgColorAvailable: #e5edff;
  --eventBorderColor0: #d6d6d6;
  --eventBorderColor1: #f2d3d8;
  --eventBorderColor2: #fff114;
  --eventBorderColor3: #c3ddff;
  --eventBorderColor4: #93ff95;
  --eventColor0: #f1f1f1;
  --eventColor1: #ffd6d1;
  --eventColor2: #fafaa3;
  --eventColor3: #e2f8ff;
  --eventColor4: #d1ffe6;
}
.vacf-title-row,
.vacf-event-row {
  display: grid;
  grid-template-columns: 50px 1fr;
  grid-column-gap: 10px;
}
.vacf-time-column {
  display: grid;
  grid-template-rows: repeat( calc( var( --numHours ) * 60 / var( --unitMinutes ) ), calc( var( --unitMinutes ) * 1px ) );
  grid-row-gap: 0;
}
.vacf-event-column {
  display: grid;
  width: 96%;
  grid-template-rows: repeat( calc( var( --numHours ) * 60 / var( --unitMinutes ) ), calc( var( --unitMinutes ) * 1px ) );
  grid-row-gap: 0;
  grid-template-columns: 1fr;
  grid-column-gap: 0;
  border-radius: 5px;
  z-index: 1;
  overflow: hidden;
}
.vacf-available {
  background: var(--calBgColorAvailable);
  z-index: 2;
  grid-column-start: 1;
  grid-column-end: 2;
  margin: 0;
}
.vacf-unavailable {
  background: var(--calBgColorUnavailable);
  z-index: 2;
  grid-column-start: 1;
  grid-column-end: 2;
  margin: 0;
}
.vacf-event-container {
  border-radius: 5px;
  overflow: hidden;
  z-index: 3;
  cursor: pointer;
  grid-column-start: 1;
  grid-column-end: 2;
}
.vacf-event-color0 {
  background-color: var(--eventColor0);
  border: var(--eventBorderColor0) 1px dashed;
  opacity: 0.5;
}
.vacf-event-color1 {
  background-color: var(--eventColor1);
  border: var(--eventBorderColor1) 1px solid;
}
.vacf-event-color2 {
  background-color: var(--eventColor2);
  border: var(--eventBorderColor2) 1px solid;
}
.vacf-event-color3 {
  background-color: var(--eventColor3);
  border: var(--eventBorderColor3) 1px solid;
}
.vacf-event-color4 {
  background-color: var(--eventColor4);
  border: var(--eventBorderColor4) 1px solid;
}

.vacf-title-item {
  display: flex;
  overflow: hidden;
}
.vacf-date-num {
  font-size: 3rem;
  font-weight: 600;
  display: inline;
}
.vacf-date-day {
  display: inline;
  font-size: 2rem;
  font-weight: 400;
}
.vacf-event-title {
  font-size: small;
  font-weight: 700;
}
.vacf-event-description {
  font-size: small;
  font-style: italic;
}
.vacf-month-title {
  font-size: 2rem;
  font-weight: 300;
  text-transform: capitalize;
  margin-bottom: 0px;
}
.vacf-cal-arrows {
  height: fit-content;
}