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

@layer base {
  h1, h2, h3, h4, h5, h6, p, ul, li, summary {
    @apply dark:text-white;
  }
  h1 {
    @apply text-3xl font-bold underline mb-5;
  }
  h2 {
    @apply text-xl font-bold mb-4;
  }
  h3 {
    @apply text-xl mb-4;
  }
  p {
    @apply mb-4
  }
  a {
    @apply text-blue-700;
    @apply dark:text-blue-200;
  }
  a:hover {
    @apply text-blue-600;
    @apply dark:text-blue-100;
  }
  ul {
    @apply list-disc mb-4 ml-5;
  }
}

@layer components {
  .btn {
    @apply font-bold py-2 px-4 rounded;
  }
  .btn-primary {
    @apply bg-blue-500 text-white;
  }
  .btn-primary:hover {
    @apply bg-blue-700 text-blue-100;
  }
  .btn-line {
    @apply border;
  }
  .btn-line:hover {
    @apply bg-slate-200;
  }
}

/* Remove native browser header & footer when on print */
@media print {
  @page { margin: 0; }
}