export const buttonClassic =
  "border-gray-300 bg-white text-gray-800 shadow-sm hover:text-gray-800 hover:bg-gray-100 hover:border-gray-300 hover:shadow focus:ring focus:ring-gray-500 focus:ring-opacity-25 active:bg-white active:border-white active:shadow-none";
export const buttonEmerald =
  "border-emerald-700 bg-emerald-700 text-white hover:text-white hover:bg-emerald-800 hover:border-emerald-800 focus:ring focus:ring-emerald-500 focus:ring-opacity-50 active:bg-emerald-700 active:border-emerald-700";
export const buttonOrange =
  "border-orange-700 bg-orange-700 text-white hover:text-white hover:bg-orange-800 hover:border-orange-800 focus:ring focus:ring-orange-500 focus:ring-opacity-50 active:bg-orange-700 active:border-orange-700";
export const buttonRed =
  "border-red-500 bg-red-500 text-white hover:text-white hover:bg-red-700 hover:border-red-700 focus:ring focus:ring-red-500 focus:ring-opacity-50 active:bg-red-700 active:border-red-700";
export const buttonBlue =
  "border-blue-700 bg-blue-700 text-white hover:text-white hover:bg-blue-800 hover:border-blue-800 focus:ring focus:ring-blue-500 focus:ring-opacity-50 active:bg-blue-700 active:border-blue-700";
export const buttonSky =
  "border-sky-500 bg-sky-500 text-white hover:text-white hover:bg-sky-700 hover:border-sky-700 focus:ring focus:ring-sky-700 focus:ring-opacity-50 active:bg-sky-700 active:border-sky-700";
export const buttonPink =
  "border-pink-700 bg-pink-700 text-white hover:text-white hover:bg-pink-800 hover:border-pink-800 focus:ring focus:ring-pink-500 focus:ring-opacity-50 active:bg-pink-700 active:border-pink-700";
export const buttonGrey =
  "border-gray-700 bg-gray-700 text-white hover:text-white hover:bg-gray-800 hover:border-gray-800 focus:ring focus:ring-gray-500 focus:ring-opacity-25 active:bg-gray-700 active:border-gray-700";
export const buttonLightBlue =
  "border-blue-200 bg-blue-200 text-blue-700 hover:text-blue-700 hover:bg-blue-300 hover:border-blue-300 focus:ring focus:ring-blue-500 focus:ring-opacity-50 active:bg-blue-200 active:border-blue-200";
export const buttonLightRed =
  "border-red-200 bg-red-200 text-red-700 hover:text-red-700 hover:bg-red-300 hover:border-red-300 focus:ring focus:ring-red-500 focus:ring-opacity-50 active:bg-red-200 active:border-red-200";
export const buttonLightOrange =
  "border-orange-200 bg-orange-200 text-orange-700 hover:text-orange-700 hover:bg-orange-300 hover:border-orange-300 focus:ring focus:ring-orange-500 focus:ring-opacity-50 active:bg-orange-200 active:border-orange-200";
export const buttonLightGray =
  "border-gray-200 bg-gray-200 text-gray-700 hover:text-gray-700 hover:bg-gray-300 hover:border-gray-300 focus:ring focus:ring-gray-500 focus:ring-opacity-50 active:bg-gray-200 active:border-gray-200";