.date-picker.calendar-picker {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.calendar-month {
  grid-column: 1 / -1;
  color: var(--accent-2);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  margin-top: 2px;
}

.calendar-weekday {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
  padding: 2px 0;
}

.calendar-blank {
  min-height: 58px;
}

.calendar-picker .calendar-day,
.calendar-picker .date-option {
  min-height: 58px;
  border-radius: 14px;
  padding: 6px 2px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1px;
}

.calendar-day-number {
  font-size: 17px;
  line-height: 1;
  font-weight: 950;
}

.calendar-day-month,
.calendar-picker .date-badge {
  font-size: 9px;
  line-height: 1.05;
  font-weight: 850;
}

.calendar-day-month {
  color: var(--muted);
  text-transform: uppercase;
}

.calendar-picker .date-option.active .calendar-day-month,
.calendar-picker .date-option.active .date-badge {
  color: rgba(23, 17, 9, .72);
}

.calendar-day-disabled {
  color: rgba(246, 239, 226, .34);
  background: rgba(255, 255, 255, .025);
  border: 1px solid rgba(255, 255, 255, .07);
  box-shadow: none;
}

.calendar-day-disabled .calendar-day-month {
  color: rgba(183, 170, 150, .38);
}