/* Keep both halves of the scheduling popup on the same accessible palette. */
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] {
  --schedule-surface: #f8faf7;
  --schedule-header: #eaf0e9;
  --schedule-ink: #26352f;
  --schedule-muted: #63746b;
  --schedule-line: #ccd7cd;
  --schedule-hover: #dfeade;
  --schedule-selected: #285b49;
  background: var(--schedule-surface) !important;
  color: var(--schedule-ink) !important;
  border: 1px solid var(--schedule-line) !important;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 32px #192c2526;
  font-family: inherit;
}
html[data-appearance=night] body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] {
  --schedule-surface: #242c39;
  --schedule-header: #2d3847;
  --schedule-ink: #edf2f7;
  --schedule-muted: #aab7c7;
  --schedule-line: #4a596b;
  --schedule-hover: #38495a;
  --schedule-selected: #2854bf;
  color-scheme: dark;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] :is(.react-datepicker__month-container,.react-datepicker__time-container,.react-datepicker__time,.react-datepicker__time-box,.react-datepicker__time-list) {
  background: var(--schedule-surface) !important;
  color: var(--schedule-ink) !important;
  border-color: var(--schedule-line) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] .react-datepicker__header {
  background: var(--schedule-header) !important;
  color: var(--schedule-ink) !important;
  border-color: var(--schedule-line) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] :is(.react-datepicker__current-month,.react-datepicker-time__header,.react-datepicker__day-name,.react-datepicker__day,.react-datepicker__time-list-item) {
  color: var(--schedule-ink) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] :is(.react-datepicker__month-select,.react-datepicker__year-select) {
  background: var(--schedule-surface) !important;
  color: var(--schedule-ink) !important;
  border: 1px solid var(--schedule-line) !important;
  border-radius: 5px;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] :is(.react-datepicker__day--outside-month,.react-datepicker__day--disabled,.react-datepicker__time-list-item--disabled) {
  color: var(--schedule-muted) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] .react-datepicker__day:hover:not(.react-datepicker__day--disabled),
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] .react-datepicker__time-list-item:hover:not(.react-datepicker__time-list-item--disabled) {
  background: var(--schedule-hover) !important;
  color: var(--schedule-ink) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] :is(.react-datepicker__day--selected,.react-datepicker__day--keyboard-selected,.react-datepicker__time-list-item--selected) {
  background: var(--schedule-selected) !important;
  color: #fff !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] .react-datepicker__navigation-icon::before {
  border-color: var(--schedule-muted) !important;
}
html body:has(#root) div.react-datepicker.custom-datetime-calendar[role="dialog"] .react-datepicker__time-list {
  scrollbar-color: var(--schedule-line) var(--schedule-surface);
}