@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}

@layer base {
  #root {
    @apply h-full;
  }

  html,
  body {
    @apply h-full;
    @apply select-none;
    @apply font-mono antialiased text-white;
    @apply overflow-hidden;
  }

  header {
    -webkit-app-region: drag;
  }

  button {
    -webkit-app-region: no-drag;
  }

  ::-webkit-scrollbar {
    @apply w-2;
  }

  ::-webkit-scrollbar-thumb {
    @apply bg-[#555] rounded-md;
  }

  ::-webkit-scrollbar-track {
    @apply bg-transparent;
  }
}

.md {
  font-size: max(calc(1.5vw + 1.5vh), 20px);

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: bold;
  }

  h1 {
    font-size: max(calc(2.7vw + 2.7vh), 36px);
  }

  h2 {
    font-size: max(calc(2.5vw + 2.5vh), 32px);
  }

  h3 {
    font-size: max(calc(2.3vw + 2.3vh), 28px);
  }

  h4 {
    font-size: max(calc(2.1vw + 2.1vh), 24px);
  }

  h5 {
    font-size: max(calc(1.9vw + 1.9vh), 20px);
  }

  h6 {
    font-size: max(calc(1.7vw + 1.7vh), 16px);
  }

  ul {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
  }

  ul li {
    padding-left: 1em;
    text-indent: -1em;
  }

  ul li:before {
    content: '•';
    padding-right: 5px;
  }

  ol {
    list-style-type: decimal;
    margin-left: 0;
    padding-left: 1.75em;
    text-indent: -5px;
  }

  code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Corrier New', monospace;
    /* font-family: 'Comic Sans MS' cursive; ComicSans Jumpscare lol*/
  }

  blockquote p {
    font-style: italic;
    background-color: rgba(200, 200, 200, 0.05);
  }
}
