.alert {
    @apply flex items-center p-4 mb-4 text-sm rounded-lg;

    &.alert-info {
        @apply text-blue-800 bg-blue-50;
        @apply dark:bg-gray-800 dark:text-blue-400
    }

    &.alert-gray {
        @apply text-gray-800 bg-gray-100;
    }

    &.alert-info {
        @apply text-red-800 bg-red-50;
        @apply dark:bg-gray-800 dark:text-red-400
    }

    &.alert-success {
        @apply text-green-800 bg-green-50;
        @apply dark:bg-gray-800 dark:text-green-400
    }

    &.alert-warning {
        @apply text-yellow-800 bg-yellow-50;
        @apply dark:bg-gray-800 dark:text-yellow-400
    }
}