@layer base {

    *,
    ::after,
    ::before,
    ::backdrop,
    ::file-selector-button {
        border-color: var(--color-gray-200, currentColor);
    }

    h1 {
        @apply text-5xl mb-3;
    }

    h2 {
        @apply text-4xl mb-3;
    }

    h3 {
        @apply text-3xl mb-3;
    }

    h4 {
        @apply text-2xl mb-3;
    }

    h5 {
        @apply text-xl mb-3;
    }

    h6 {
        @apply text-lg mb-3
    }

    p {
        @apply mb-2;
    }

    .text-muted {
        @apply text-gray-500 dark:text-gray-400;
    }

    button {
        @apply cursor-pointer appearance-none;
    }

    .link {
        @apply font-medium text-blue-600 underline dark:text-blue-500 hover:no-underline transition-colors;
    }

    small {
        @apply text-sm text-gray-500;
    }

    .link {
        @apply text-blue-600 hover:text-blue-800 underline hover:no-underline transition-colors;
    }

    ul {
        @apply list-disc pl-6 mb-4;
    }

    ol {
        @apply list-decimal pl-6 mb-4;
    }

    blockquote {
        @apply border-l-4 border-gray-300 pl-4 italic text-gray-600 mb-4;
    }

    .code-inline {
        @apply bg-gray-100 px-2 py-1 rounded font-mono text-sm;
    }

    .code-block {
        @apply bg-gray-800 text-gray-100 p-4 rounded overflow-x-auto;
    }

}