/* 共享日期选择器主题：贴合「带娃折腾记」品牌色（与 tool.css 的 --brand 对齐） */
.flatpickr-calendar {
  font-family: inherit;
  border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
  border: 1px solid var(--line, #eee);
  overflow: hidden;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.selected:hover {
  background: var(--brand, #E8835A);
  border-color: var(--brand, #E8835A);
  color: #fff;
}

.flatpickr-day.today {
  border-color: var(--brand, #E8835A);
  color: var(--brand, #E8835A);
}

.flatpickr-day:hover {
  background: #FBEee6;
}

.flatpickr-months .flatpickr-month,
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  color: #fff;
  fill: #fff;
  background: var(--brand, #E8835A);
}

.flatpickr-current-month .cur-month,
.flatpickr-current-month input.cur-year {
  color: #fff;
  font-weight: 600;
}

.flatpickr-weekdays {
  background: var(--brand, #E8835A);
}

span.flatpickr-weekday {
  color: #fff;
  font-weight: 600;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #c9c2ba;
}

/* 移动端：弹层改为居中模态，解决「输入框靠下时日历跑到视口外 / 被裁切」这一"点不开/错位"根因 */
@media (max-width: 640px) {
  /* 半透明遮罩，点空白处即可关闭（flatpickr 原生支持），同时让弹层像模态 */
  body.fp-modal-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 99990;
  }
  /* 覆盖 flatpickr 内联的 top/left，强制居中且始终落在可视区内 */
  .flatpickr-calendar.open {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 99999 !important;
    margin: 0;
    max-width: 92vw;
    max-height: 88vh;
    font-size: 15px;
  }
  .flatpickr-day {
    height: 40px;
    line-height: 40px;
  }
}