/* Кастомные стили для Flatpickr */

.flatpickr-input {
  cursor: pointer !important;
}

.flatpickr-input::placeholder {
  color: var(--color-text-tertiary);
}

/* Темная тема для flatpickr */
[data-theme="dark"] .flatpickr-calendar {
  background: var(--card-bg);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid var(--border-color);
}

[data-theme="dark"] .flatpickr-months {
  background: var(--color-bg-secondary);
}

[data-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
[data-theme="dark"] .flatpickr-current-month input.cur-year {
  color: var(--color-text-primary);
  background: transparent;
}

[data-theme="dark"] .flatpickr-weekday {
  color: var(--color-text-secondary);
}

[data-theme="dark"] .flatpickr-day {
  color: var(--color-text-primary);
}

[data-theme="dark"] .flatpickr-day:hover {
  background: var(--color-bg-secondary);
}

[data-theme="dark"] .flatpickr-day.selected {
  background: var(--primary-color);
  border-color: var(--primary-color);
}

[data-theme="dark"] .flatpickr-day.today {
  border-color: var(--primary-color);
}

/* Иконка календаря в поле */
#date-from,
#date-to {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23888' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  padding-right: 40px;
}