/* Flatpickr theme overrides for KlusAI Nexus (Oatmeal / mist) */

/* ── Light mode base ── */
.flatpickr-calendar {
  border-radius: 0.75rem;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(26, 35, 49, 0.05);
  border: none;
  font-family: 'Inter', sans-serif;
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-family: 'Familjen Grotesk', 'Inter', sans-serif;
}

.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: oklch(14.8% 0.004 228.8);
  border-color: oklch(14.8% 0.004 228.8);
  color: #fff;
}

.flatpickr-day.today:not(.selected) {
  border-color: oklch(72.3% 0.014 214.4);
}

.flatpickr-day:hover:not(.selected):not(.today) {
  background: oklch(96.3% 0.002 197.1);
  border-color: oklch(96.3% 0.002 197.1);
}

.flatpickr-time input,
.flatpickr-time .flatpickr-am-pm {
  font-family: 'Inter', sans-serif;
}

.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: oklch(96.3% 0.002 197.1);
}

/* Alt input inherits the field styling from the original input */
.flatpickr-input.flatpickr-input[readonly] {
  cursor: pointer;
}

/* ── Dark mode ── */
.flatpickr-dark.flatpickr-calendar {
  background: oklch(27.5% 0.011 216.9);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.flatpickr-dark .flatpickr-months .flatpickr-month {
  background: oklch(27.5% 0.011 216.9);
  color: #fff;
}

.flatpickr-dark .flatpickr-current-month .flatpickr-monthDropdown-months {
  background: oklch(27.5% 0.011 216.9);
  color: #fff;
}

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

.flatpickr-dark .flatpickr-months .flatpickr-prev-month,
.flatpickr-dark .flatpickr-months .flatpickr-next-month {
  fill: oklch(72.3% 0.014 214.4);
  color: oklch(72.3% 0.014 214.4);
}

.flatpickr-dark .flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-dark .flatpickr-months .flatpickr-next-month:hover {
  fill: #fff;
  color: #fff;
}

.flatpickr-dark .flatpickr-weekdays {
  background: oklch(27.5% 0.011 216.9);
}

.flatpickr-dark span.flatpickr-weekday {
  background: oklch(27.5% 0.011 216.9);
  color: oklch(56% 0.021 213.5);
}

.flatpickr-dark .flatpickr-days .dayContainer .flatpickr-day {
  color: oklch(92.5% 0.005 214.3);
}

.flatpickr-dark .flatpickr-day.flatpickr-disabled,
.flatpickr-dark .flatpickr-day.flatpickr-disabled:hover,
.flatpickr-dark .flatpickr-day.prevMonthDay,
.flatpickr-dark .flatpickr-day.nextMonthDay {
  color: oklch(45% 0.017 213.2);
}

.flatpickr-dark .flatpickr-day:hover:not(.selected):not(.today) {
  background: oklch(37.8% 0.015 216);
  border-color: oklch(37.8% 0.015 216);
}

.flatpickr-dark .flatpickr-day.today:not(.selected) {
  border-color: oklch(56% 0.021 213.5);
  color: #fff;
}

.flatpickr-dark .flatpickr-day.selected,
.flatpickr-dark .flatpickr-day.selected:hover {
  background: #fff;
  border-color: #fff;
  color: oklch(14.8% 0.004 228.8);
}

.flatpickr-dark .flatpickr-time {
  border-top-color: oklch(37.8% 0.015 216);
}

.flatpickr-dark .flatpickr-time input,
.flatpickr-dark .flatpickr-time .flatpickr-am-pm {
  color: #fff;
}

.flatpickr-dark .flatpickr-time input:hover,
.flatpickr-dark .flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-dark .flatpickr-time input:focus,
.flatpickr-dark .flatpickr-time .flatpickr-am-pm:focus {
  background: oklch(37.8% 0.015 216);
}

.flatpickr-dark .flatpickr-time .flatpickr-time-separator {
  color: oklch(56% 0.021 213.5);
}

.flatpickr-dark .numInputWrapper:hover {
  background: oklch(37.8% 0.015 216);
}

.flatpickr-dark .numInputWrapper span {
  border-color: oklch(45% 0.017 213.2);
}

.flatpickr-dark .numInputWrapper span:hover {
  background: oklch(45% 0.017 213.2);
}

.flatpickr-dark .numInputWrapper span svg path {
  fill: oklch(72.3% 0.014 214.4);
}