.date-picker {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}

.native-date-picker {
  position: absolute;
  width: 1px;
  height: 1px;
  right: 24px;
  bottom: 0;
  opacity: 0;
  pointer-events: none;
}

.calendar-button {
  width: 48px;
  border: 1px solid #d9cdbb;
  border-radius: 10px;
  background: var(--cream);
  color: var(--wine);
  font-size: 20px;
  cursor: pointer;
}

.calendar-button:hover,
.calendar-button:focus {
  outline: 2px solid #d7b876;
  border-color: transparent;
}