.button {
    @apply inline-flex items-center justify-center space-x-2 h-10 leading-10 px-4 md:px-8 cursor-pointer;
    @apply uppercase leading-none text-center;
    @apply transition-colors outline-none focus:outline-2 focus:outline-offset-2 focus:outline-primary-light;
    @apply rounded-md;
}

.button--small {
    @apply px-2 py-1 md:px-4 text-xs sm:text-sm;
}

.button--full {
    @apply block w-full;
}

.button--secondary {
    @apply bg-none bg-primary-light text-white;
    @apply hover:bg-primary-light/80;
}

.button--primary {
    @apply bg-pink text-white;
    @apply hover:bg-none hover:bg-pink/80;
}

.button--muted {
    @apply bg-zinc-300 hover:bg-zinc-300;
}

.button--dark {
    @apply bg-primary-dark;
}

.button[disabled] {
    @apply cursor-not-allowed;
}