@import "tailwindcss";
@plugin "daisyui";

input[type="range"]::-webkit-slider-thumb,
input[type="range"]::-moz-range-thumb {
  pointer-events: all;
  width: 24px;
  height: 24px;
  -webkit-appearance: none;
  /* @apply w-6 h-6 appearance-none pointer-events-auto; */
}
input[type="file"]::file-selector-button {
  display: none;
}

input[type="file"]::-webkit-file-upload-button {
  display: block;
  width: 0;
  height: 0;
  margin-left: -100%;
}

input[type="file"]::-ms-browse {
  display: none;
}
.fade-me-out.htmx-swapping {
  opacity: 0;
  transition: opacity 100ms ease-out;
}
.fade-me-in.htmx-added {
  opacity: 0;
}
.fade-me-in {
  opacity: 1;
  transition: opacity 100ms ease-out;
}

@view-transition {
  navigation: auto;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
}

@keyframes fade-out {
  to {
    opacity: 0;
  }
}

.fade-it {
  view-transition-name: match-element;
}

::view-transition-old(fade-it) {
  animation: 100ms ease-out() both fade-out;
}
::view-transition-new(fade-it) {
  animation: 220ms ease-out() 90ms both fade-in;
}