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

@layer base {
    a[href*='/']:not([class]),
    a[href*='/'][class=""] {
        @apply text-primary hover:underline;
    }

    h1 {
        @apply text-2xl;
    }

    h2 {
        @apply text-xl;
    }

    h3 {
        @apply text-lg;
    }

    .container {
        @apply grid grid-cols-12 mx-auto gap-4
    }

    .header {
        @apply col-span-12 flex gap-2 p-2.5 border-b border-primary-700 bg-gradient-to-l from-primary-700;

        .logo {
            @apply text-2xl;

            svg {
                @apply text-3xl inline-block;
            }
        }
    }

    .sidebar {
        @apply col-span-2
    }

    .content {
        @apply col-span-10
    }

    .page-header {
        @apply border-b border-primary-200 dark:border-primary-950 py-2.5 bg-gradient-to-l from-primary-200 dark:from-primary-950;
    }

    dl {
        @apply grid grid-cols-12;

        dt {
            @apply col-span-full
        }

        dd {
            @apply col-span-full col-start-2;

            &:last-of-type {
                @apply mb-2
            }
        }

    }
}

th.tmc {
    @apply min-w-[800px];
}