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

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/
.main-content-wrapper {
  h2 {
    @apply my-5 text-2xl font-bold;
  }
  p {
    @apply my-3;
  }
  a {
    @apply text-indigo-800 underline hover:text-indigo-500;
  }
  img {
    @apply my-12;
  }
  ul {
    @apply list-disc ml-7;
  }
  ol {
    @apply list-decimal ml-7;
  }
  blockquote {
    @apply text-gray-600 italic bg-gray-50 border-l-4 border-gray-200 px-4 py-8 my-8 relative;
  }
  blockquote::before, blockquote::after {
    @apply text-5xl absolute font-serif text-gray-200
  }
  blockquote::before {
    @apply content-['“'] -left-2 -top-6;
  }
  blockquote::after {
    @apply content-['”'] right-1 -bottom-12;
  }
  table {
    @apply my-10 min-w-full table-auto border border-gray-200 text-sm;
  }
  table caption {
    @apply hidden;
  }
  thead {
    @apply bg-gray-100;
  }
  th {
    @apply px-6 py-3 text-left font-semibold text-gray-600 border-b;
  }
  tbody {
    @apply divide-y divide-gray-200;
  }
  tbody tr {
    @apply hover:bg-gray-50;
  }
  tbody td {
    @apply px-6 py-4;
  }
  code {
    @apply bg-neutral-100 text-fuchsia-600 font-mono text-sm px-1 py-0.5 rounded;
    /* @apply bg-gray-800 text-lime-300 font-mono text-sm px-1 py-0.5 rounded; */
  }
}
.article-summary {
  h2 {
    @apply my-2 font-bold;
  }
  p {
    @apply my-2;
  }
  ul {
    @apply list-disc ml-5;
  }
  ol {
    @apply list-decimal ml-5;
  }
  blockquote {
    @apply text-gray-600 italic bg-gray-50 border-l-4 border-gray-200 px-4 py-8 my-6 relative;
  }
  blockquote::before, blockquote::after {
    @apply text-5xl absolute font-serif text-gray-200
  }
  blockquote::before {
    @apply content-['“'] -left-2 -top-6;
  }
  blockquote::after {
    @apply content-['”'] right-1 -bottom-12;
  }
  code {
    @apply bg-neutral-100 text-fuchsia-600 font-mono text-sm px-1 py-0.5 rounded;
  }
}
.article-summary:last-child {
  @apply border-none;
}