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

body {
  @apply bg-gradient-to-br from-zinc-900 to-zinc-950 bg-fixed;
  @apply w-screen h-screen;
  @apply text-orange-50 antialiased font-mono tracking-tighter;
}

a[aria-current="page"] {
  border-bottom: 2px solid #de0002;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

/* for innerHTML articles */
article p {
  @apply mt-5 indent-4;
}

article h3 {
  @apply mt-8 text-2xl text-orange-600;
}

article a {
  @apply text-orange-300 hover:underline;
}

article h3 > a {
  @apply text-orange-600;
}

article ul,
article ol {
  @apply mt-5 list-inside;
}

article ul {
  @apply list-disc;
}

article ol {
  @apply list-decimal;
}


/* Code blocks */
.hh4 {
  @apply text-orange-600;
}

.hh3 {
  @apply text-blue-500;
}

.hh13 {
  @apply text-orange-800;
}

.hh10 {
  @apply text-slate-500;
}

.hh5 {
  @apply text-orange-300;
}

/* dunno what this is yet */
.hh18 {
  color: red;
}

.code-block {
  @apply bg-black bg-opacity-40 p-3 rounded-lg shadow-lg shadow-black;
}

.code-block-inner {
  @apply p-2;
}