/* Flatpickr dark theme — charcoal background */
.flatpickr-calendar {
  background: #4a4a4a;
  border-color: #5a5a5a;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.flatpickr-calendar.arrowTop::before { border-bottom-color: #5a5a5a; }
.flatpickr-calendar.arrowTop::after { border-bottom-color: #4a4a4a; }

.flatpickr-months {
  background: #4a4a4a;
}

.flatpickr-months .flatpickr-month {
  color: #bebaba;
  fill: #bebaba;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  background: #4a4a4a;
  color: #bebaba;
}

.flatpickr-current-month .flatpickr-monthDropdown-months option {
  background: #4a4a4a;
  color: #bebaba;
}

.flatpickr-current-month input.cur-year {
  color: #bebaba;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  color: #bebaba;
  fill: #bebaba;
}

.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  fill: #bebaba;
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #63bbc8;
}

.flatpickr-weekdays {
  background: #4a4a4a;
}

span.flatpickr-weekday {
  color: #bebaba;
  background: #4a4a4a;
}

.flatpickr-day {
  color: #bebaba;
}

.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  background: rgba(99, 187, 200, 0.25);
  border-color: rgba(99, 187, 200, 0.4);
}

/* Selected day — teal */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #63bbc8;
  border-color: #63bbc8;
  color: #fff;
}

.flatpickr-day.today {
  border-color: #63bbc8;
}

.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  background: #63bbc8;
  border-color: #63bbc8;
  color: #fff;
}

/* Non-selectable days — muted */
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #666;
}

/* Teal focus ring on flatpickr input when calendar is open */
input.flatpickr-input.active {
  border-color: #63bbc8 !important;
  outline: none;
  box-shadow: 0 0 0 2px rgba(99, 187, 200, 0.3);
}

/* Flatpickr input placeholder */
input.flatpickr-input::placeholder {
  color: #bebaba;
}

/* Custom time dropdown */
.time-dropdown {
  position: relative;
}

.time-dropdown-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  color: #bebaba;
}

.time-dropdown-trigger.has-value {
  color: #bebaba;
}

.time-dropdown-trigger::after {
  content: "";
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #bebaba;
  flex-shrink: 0;
  margin-left: 8px;
}

.time-dropdown-trigger.open {
  border-color: #63bbc8 !important;
  box-shadow: 0 0 0 2px rgba(99, 187, 200, 0.3);
}

.time-dropdown-menu {
  display: none;
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 200px;
  overflow-y: auto;
  background: #4a4a4a;
  border: 1px solid #5a5a5a;
  border-radius: 6px;
  margin-top: 2px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.time-dropdown-menu.open {
  display: block;
}

.time-dropdown-option {
  padding: 7px 12px;
  font-size: 0.875rem;
  color: #bebaba;
  cursor: pointer;
}

.time-dropdown-option:hover {
  background: rgba(99, 187, 200, 0.25);
}

.time-dropdown-option.selected {
  background: #63bbc8;
  color: #fff;
}