@import "./markdown.css";
@import "./transitions.css";

html {
  scroll-behavior: smooth;
  hyphens: auto;
  overscroll-behavior-y: none;
}

body {
  @apply bg-light-500 dark-bg-dark-200 dark-text-light-200;
  overscroll-behavior-y: none;
  touch-action: pan-x pan-y;
}

#app {
  @apply min-h-100vh max-h-100vh flex;
}

input, select, textarea {
  @apply dark-bg-dark-100 p-2 rounded-lg
}

.button {
  @apply p-2 flex font-bold rounded-xl shadow-md hover-(shadow-lg bg-light-100) transition-all duration-200 ease-out bg-light-600 items-center dark-bg-dark-200;

}

.button.active {
  @apply bg-dark-100 shadow-xl text-light-300 dark-bg-light-300 dark-text-dark-500 ;
}



::-webkit-scrollbar {
  width: 10px;
}
