/* The date picker (flatpickr), themed to match the site. Loaded after the vendor stylesheet so these rules win; the vendor files stay untouched. */

.flatpickr-calendar {
  background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: var(--r-sm);
  box-shadow: var(--shadow-3); font-family: var(--font-ui); padding-bottom: 10px;
}
.flatpickr-calendar.arrowTop::before, .flatpickr-calendar.arrowTop::after,
.flatpickr-calendar.arrowBottom::before, .flatpickr-calendar.arrowBottom::after { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .flatpickr-calendar.open { animation: cal-in 0.45s var(--ease-out); }
  @keyframes cal-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
}

/* Month header: serif month name, quiet arrows */
.flatpickr-months { padding: 10px 0 4px; align-items: center; }
.flatpickr-months .flatpickr-month { height: 40px; background: transparent; color: var(--text); fill: var(--text); }
.flatpickr-current-month { font: 300 1.3rem/1 var(--font-display); letter-spacing: -0.01em; padding-top: 6px; color: var(--text); }
.flatpickr-current-month .flatpickr-monthDropdown-months, .flatpickr-current-month input.cur-year, .flatpickr-current-month span.cur-month {
  font: inherit; font-weight: 300; color: var(--text); background: transparent;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover, .flatpickr-current-month input.cur-year:hover { background: var(--brand-soft); }
.numInputWrapper span { border-color: var(--line); }
.numInputWrapper span:hover { background: var(--brand-soft); }
.numInputWrapper span.arrowUp::after { border-bottom-color: var(--text-muted); }
.numInputWrapper span.arrowDown::after { border-top-color: var(--text-muted); }
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
  display: grid; place-items: center; width: 40px; height: 40px; padding: 0; margin: 0 6px; top: 10px; border-radius: var(--r-sm); color: var(--text); fill: var(--text);
  transition: background 0.3s, fill 0.3s;
}
.flatpickr-months .flatpickr-prev-month svg, .flatpickr-months .flatpickr-next-month svg { width: 12px; height: 12px; fill: var(--text); }
.flatpickr-months .flatpickr-prev-month:hover, .flatpickr-months .flatpickr-next-month:hover { background: var(--brand-soft); }
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg { fill: var(--accent-strong); }

/* Weekday row: small tracked capitals */
.flatpickr-weekdays { height: 30px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
span.flatpickr-weekday { background: transparent; color: var(--text-muted); font: 500 0.62rem/1 var(--font-ui); letter-spacing: 0.14em; text-transform: uppercase; }

/* Days */
.flatpickr-day { color: var(--text); border: 1px solid transparent; border-radius: var(--r-sm); font-size: 0.88rem; transition: background 0.25s, color 0.25s; }
.flatpickr-day:hover, .flatpickr-day:focus { background: var(--brand-soft); border-color: transparent; color: var(--text); }
.flatpickr-day.today { border-color: transparent; box-shadow: inset 0 -2px 0 var(--accent); }
.flatpickr-day.today:hover { background: var(--brand-soft); border-color: transparent; color: var(--text); }
.flatpickr-day.selected, .flatpickr-day.selected:hover, .flatpickr-day.selected:focus, .flatpickr-day.startRange, .flatpickr-day.endRange {
  background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: none;
}
.flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { color: var(--text-muted); opacity: 0.5; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { color: var(--text-muted); opacity: 0.45; background: transparent; border-color: transparent; text-decoration: none; cursor: not-allowed; }
.flatpickr-day.flatpickr-disabled:not(.prevMonthDay):not(.nextMonthDay) { text-decoration: line-through; }

/* The visible date box (flatpickr keeps the real value in a hidden field) */
.flatpickr-input[readonly], input.flatpickr-input, .form input.flatpickr-input[readonly] { cursor: pointer; }