/* GentleBooth theme overrides for Flatpickr — align the calendar popup with
   the admin's blue accent + Sarabun font + a clear range pill (matches the
   reference: solid blue endpoints, light fill between, rounded ends). */

.flatpickr-calendar {
  font-family: 'Sarabun', system-ui, sans-serif;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.16);
  border-radius: 12px;
}

/* Header month/year + weekday labels */
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year { font-weight: 600; }
.flatpickr-weekday { color: var(--text-secondary, #909399); font-weight: 500; }

/* Day cells — a touch larger so the range reads clearly */
.flatpickr-day {
  border-radius: 999px;
  font-size: 14px;
}
.flatpickr-day:hover,
.flatpickr-day:focus { background: var(--ea-primary-bg, rgba(64, 158, 255, 0.10)); border-color: transparent; }

/* Selected single + range endpoints = solid admin blue */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
  background: var(--ea-primary, #409EFF);
  border-color: var(--ea-primary, #409EFF);
  color: #fff;
}

/* In-between days = light fill, square so the pill connects edge-to-edge */
.flatpickr-day.inRange {
  background: var(--ea-primary-bg, rgba(64, 158, 255, 0.12));
  border-color: transparent;
  box-shadow: -5px 0 0 var(--ea-primary-bg, rgba(64, 158, 255, 0.12)),
               5px 0 0 var(--ea-primary-bg, rgba(64, 158, 255, 0.12));
}

/* Today marker */
.flatpickr-day.today { border-color: var(--ea-primary, #409EFF); }
.flatpickr-day.today:hover { background: var(--ea-primary, #409EFF); color: #fff; }