/* Shared date buttons and a compact calendar; no native date wheels on mobile. */
.field-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.field { min-width: 0; }
.date-button {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; min-width: 0; min-height: 48px; padding: 12px 13px;
  border: 1px solid #dce0e8; border-radius: 8px; background: #fff;
  color: var(--navy); text-align: left; font-size: 13px;
}
.date-button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.date-button svg { width: 19px; height: 19px; color: var(--blue); flex-shrink: 0; }
.date-button:hover { border-color: #abb8dd; }
.date-button[aria-invalid="true"] { border-color: #b03b32; }
.calendar-picker { padding-top: 4px; }
.calendar-picker .eyebrow { padding-right: 25px; margin-bottom: 11px; }
.calendar-picker h2 { margin-top: 0; padding-right: 10px; }
.calendar-range { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 12px 0 20px; }
.calendar-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 13px; }
.calendar-heading h3 { margin: 0; flex: 1; text-align: center; font-size: 16px; font-weight: 650; text-transform: capitalize; }
.calendar-nav { width: 44px; height: 44px; border: 1px solid var(--line); background: #fff; border-radius: 9px; display: grid; place-items: center; }
.calendar-nav:not(:disabled):hover { background: var(--soft); border-color: #abb8dd; }
.calendar-nav:disabled { opacity: .3; }
.calendar-grid { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 3px 4px; }
.calendar-grid th { padding: 3px 0 8px; color: var(--muted); font-size: 11px; font-weight: 500; text-align: center; }
.calendar-grid abbr { text-decoration: none; }
.calendar-grid td { padding: 0; text-align: center; }
.calendar-day { width: 100%; height: 40px; padding: 0; border: 1px solid transparent; border-radius: 9px; background: #fff; color: var(--navy); font-size: 13px; }
.calendar-day:not(:disabled):hover { background: var(--soft); border-color: #cbd3ef; }
.calendar-day.is-today:not(.is-selected) { border-color: #d3ad51; }
.calendar-day.is-selected { background: var(--blue); color: #fff; font-weight: 650; }
.calendar-day.is-selected:not(:disabled):hover { background: var(--navy); }
.calendar-day:disabled { color: #a5aab7; background: #f5f6f8; opacity: 1; }
.calendar-day:focus-visible { outline-offset: 0; }
.calendar-help { color: var(--muted); font-size: 10px; line-height: 1.6; margin: 16px 0 0; }
.calendar-help span { display: block; }
@media(max-width:700px) { .date-button { font-size: 16px; } }
@media(max-width:480px) {
  .offer-dates.field-row { grid-template-columns: minmax(0,1fr); gap: 0; }
  .calendar-grid { border-spacing: 2px 3px; }
  .calendar-day { height: 44px; }
}