/* Minimal Flatpickr Theme Overrides for Monster Math */

/* Import the original flatpickr CSS first */
@import url('https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css');

/* Override colors to match Monster Math theme */
.flatpickr-calendar {
  font-family: 'Quicksand', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(74, 74, 138, 0.15);
  border: 1px solid #E5E7EB;
}

/* Selected dates - use Monster Math green theme */
.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: #2BB673;
  border-color: #2BB673;
  color: #fff;
}

/* Today's date */
.flatpickr-day.today {
  border-color: #2BB673;
}

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

/* Hover states */
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  background: #F3F4F6;
  border-color: #D1D5DB;
}

/* Range selection */
.flatpickr-day.inRange {
  background: rgba(43, 182, 115, 0.1);
  border-color: rgba(43, 182, 115, 0.2);
  color: #2BB673;
}

/* Navigation arrows hover */
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  color: #2BB673;
}

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

/* Current month text */
.flatpickr-current-month {
  color: #2BB673;
  font-weight: 600;
}

.flatpickr-current-month span.cur-month {
  color: #2BB673;
  font-weight: 600;
}

.flatpickr-current-month span.cur-month:hover {
  background: rgba(43, 182, 115, 0.1);
}

/* Year input */
.flatpickr-current-month input.cur-year {
  color: #2BB673;
  font-weight: 600;
}

/* Month dropdown */
.flatpickr-current-month .flatpickr-monthDropdown-months {
  color: #2BB673;
  font-weight: 600;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: rgba(43, 182, 115, 0.1);
}

/* Weekday headers */
span.flatpickr-weekday {
  color: #6B7280;
  font-weight: 600;
}

/* Input field styling */
.flatpickr-input {
  font-family: 'Quicksand', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 10px 12px;
  transition: all 0.2s ease;
}

.flatpickr-input:focus {
  border-color: #2BB673;
  box-shadow: 0 0 0 3px rgba(43, 182, 115, 0.1);
}

.flatpickr-input:hover {
  border-color: #D1D5DB;
}