/* Kalendarz preferowanego dnia — tylko preferencja, bez dostepnosci. */

.datepicker__label {
  display: block;
  margin-bottom: 10px;
  font-size: .875rem;
  color: var(--color-text);
}
.datepicker {
  padding: 12px;
  background: #FAF9F6;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-control);
}
.datepicker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.datepicker__month {
  font-size: .9375rem;
  font-weight: 500;
  color: var(--color-text);
}
.datepicker__nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  color: var(--color-ink);
  cursor: pointer;
}
.datepicker__nav:hover { border-color: var(--color-line); background: #fff; }
.datepicker__nav[disabled] { opacity: .35; cursor: not-allowed; }

.datepicker__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  text-align: center;
}
.datepicker__dow {
  padding-block: 6px;
  font-size: .75rem;
  font-weight: 500;
  color: var(--color-muted);
}
.datepicker__day {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  min-height: 34px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 50%;
  font-size: .9375rem;
  color: var(--color-text);
  cursor: pointer;
}
.datepicker__day:hover:not([disabled]) { background: #fff; border-color: var(--color-line); }
.datepicker__day[aria-pressed="true"] { background: var(--color-ink); color: #fff; }
.datepicker__day[disabled] { color: #B9C2CB; cursor: not-allowed; }
.datepicker__day--empty { visibility: hidden; }

.datepicker__footer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  font-size: .8125rem;
  color: var(--color-muted);
}
.datepicker__footer input { flex: none; width: 22px; height: 22px; accent-color: var(--color-ink); }
.datepicker__selection { margin-top: 8px; font-size: .8125rem; color: var(--color-text); }

/* Wygodniejsze cele dotykowe na telefonie. */
@media (max-width: 767px) {
  .datepicker__day { min-height: 44px; }
  .datepicker__footer { min-height: 44px; }
}