@reference "tailwindcss";

.thom-button-dashboard {
  @apply gap-1 overflow-hidden rounded-lg px-4 py-1 cursor-pointer z-10 backdrop-blur-md bg-emerald-500/30 text-black/80 ring-1 ring-emerald-500 hover:bg-emerald-500/40 hover:text-black hover:ring-emerald-600;
}
[data-theme="dark"] .thom-button-dashboard {
  @apply bg-emerald-400/10 text-emerald-300/80 ring-1 ring-emerald-400/20 hover:bg-emerald-400/20 hover:text-emerald-300 hover:ring-emerald-400/50;
}

.thom-button-check {
  @apply inline-flex justify-center items-center gap-1 overflow-hidden rounded-lg px-4 py-1 cursor-pointer z-10 bg-emerald-500/30 text-black/80 ring-1 ring-emerald-500 hover:bg-emerald-500/40 hover:text-black hover:ring-emerald-600;
}
[data-theme="dark"] .thom-button-check {
  @apply bg-emerald-400/10 text-emerald-300/80 ring-1 ring-emerald-400/20 hover:bg-emerald-400/20 hover:text-emerald-300 hover:ring-emerald-400/50;
}

.thom-button-check-blue {
  @apply inline-flex justify-center items-center gap-1 overflow-hidden rounded-lg px-4 py-1.5 cursor-pointer z-10 bg-blue-500/30 text-black/80 ring-1 ring-blue-500 hover:bg-blue-500/40 hover:text-black hover:ring-blue-600;
}
[data-theme="dark"] .thom-button-check-blue {
  @apply bg-blue-400/10 text-blue-300/80 ring-1 ring-blue-400/20 hover:bg-blue-400/20 hover:text-blue-300 hover:ring-blue-400/50;
}