.btn {
	@apply py-2 px-4 text-center rounded-xl transition-all disabled:cursor-not-allowed focus:ring-2 focus:ring-offset-2 focus:ring-blue-400/75;

	&-primary {
		@apply bg-blue-400 text-white hover:bg-blue-500 active:bg-blue-300 disabled:bg-blue-100;
	}

	&-secondary {
		@apply bg-orange-400 text-white hover:bg-orange-500 active:bg-orange-300 disabled:bg-orange-100;
	}

	&-danger {
		@apply bg-red-500 text-white hover:bg-red-600 active:bg-red-300 disabled:bg-red-300;
	}

	&-white {
		@apply bg-white text-black hover:bg-gray-50 disabled:bg-gray-300;
	}

	&-black {
		@apply bg-black text-white hover:bg-gray-800 active:bg-gray-600 disabled:bg-gray-600;
	}

	&-gray {
		@apply bg-slate-300 text-black hover:bg-slate-400 disabled:bg-slate-100;
	}

	&-card-action {
		@apply py-4 w-full rounded-t-none focus:ring-0;
	}
}