@tailwind base;
@tailwind components;
@tailwind utilities;

body {
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Poppins";
  background-image: url('images/grid_point.png'), url('./images/beams.webp');
  background-attachment: fixed;
  background-position: center;
}

div, p, span, a {
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Poppins";
}

@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark !important;
  }
  body {
    background-image: none;
  }
}

.btn-primary {
  @apply bg-blue-500 rounded p-1 px-6 flex justify-center text-white hover:bg-blue-500/95
}

.btn-secondary {
  @apply p-1 px-6 ring-1 rounded flex justify-center ring-slate-300 text-slate-800 cursor-pointer bg-white hover:bg-slate-50
}