// Button

.btn {
    @apply border bg-primary-400 text-white py-2 px-4 shadow-sm rounded-md cursor-pointer;

    &:hover {
        @apply text-white bg-primary-600 transition-all duration-300;
    }

    svg {
        @apply w-4 fill-current mr-2 inline;
    }
}

.btn-primary {
    @extend .btn;
    @apply bg-primary-600;

    &:hover {
        @apply bg-primary-800;
    }
}

.btn-secondary {
    @extend .btn;
    @apply bg-primary-600;

    &:hover {
        @apply bg-primary-800;
    }
}

.btn-alert {
    @extend .btn;
    @apply bg-red-600 text-white;

    &:hover {
        @apply bg-red-800;
    }
}