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

.grav-body-styling {
    h1 {
        @apply text-3xl font-header font-bold text-fisoPrimary mt-6 mb-4;
    }

    h2 {
        @apply text-2xl font-header font-bold text-fisoSecondary mt-4 mb-2;
    }

    h3 {
        @apply text-xl font-semibold text-slate-600 mt-6 mb-2;
    }

    h4 {
        @apply text-xl text-slate-600 mt-6 mb-2;
    }

    h5 {
        @apply font-medium text-slate-600 mt-4 mb-2;
    }

    h6 {
        @apply text-sm font-medium text-slate-600 mt-2 mb-2;
    }

    p {
        @apply mt-6;
    }

    a {
        @apply whitespace-nowrap font-medium text-slate-500 hover:text-fisoSecondary;
    }

    ul {
        @apply list-disc list-outside ml-4;
    }

    ol {
        @apply list-decimal list-outside ml-4;
    }

    .notices {
        p {
            @apply m-0;
        }

        @apply rounded-md px-6 py-4 mt-6;
    }

    .notices.yellow {
        p {
            @apply text-yellow-800;
        }

        @apply bg-yellow-50;
    }

    .notices.red {
        p {
            @apply text-red-800;
        }

        @apply bg-red-50;
    }

    .notices.blue {
        p {
            @apply text-blue-800;
        }

        @apply bg-blue-50;
    }

    .notices.green {
        p {
            @apply text-green-800;
        }

        @apply bg-green-50;
    }
}