@tailwind base;
@tailwind components;
@tailwind utilities;
@import '@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss';

.dp__input {
  @apply block w-full rounded-md border-gray-300 shadow-sm transition-colors duration-200 focus:border-blue-500 focus:ring-1 focus:ring-blue-500 sm:text-sm;
  height: 38px;

  &.dp__disabled {
    @apply bg-gray-100 hover:border-gray-400;
  }
}

.dp__invalid .dp__input {
  @apply border-red-300 focus:border-red-500 focus:ring-red-500;
}