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



@layer components {

  body, input, textarea {
    @apply bg-white dark:bg-slate-800 text-zinc-700 dark:text-white;
  }
  
  p {
    @apply py-2;
  }
  
  h1 {
    @apply font-bold text-4xl my-2
  }
  
  h2 {
    @apply font-bold text-3xl my-2
  }

  ul {
    @apply list-disc list-inside;
  }

  ul > li > ul {
    @apply ml-6;
  }

  ol {
    @apply list-decimal list-inside;
  }

  ol > li > ul {
    @apply ml-6;
  }

  table {
    @apply border-collapse border-spacing-0 border border-slate-500
  }

  td, th {
    @apply py-1 px-2 border-collapse border-spacing-0 border border-slate-500 text-sm align-top text-wrap text-pretty
  }

  pre {
    @apply my-3 font-mono text-xs bg-sky-100 py-1 px-1 text-wrap;
  }
}