@tailwind base;

@tailwind components;

@tailwind utilities;

@layer base {
  body {
    @apply bg-white dark:bg-gray-900;
  }

  h1 {
    @apply text-4xl lg:text-5xl leading-none font-extrabold tracking-tight mt-5 mb-4 sm:mt-7 sm:mb-5;
  }

  h2 {
    @apply text-xl mt-2;
  }

  h3 {
    @apply text-lg;
  }
}

a:hover {
  color: inherit;
}

@layer components {
  .mbz-card {
    @apply block bg-mbz-yellow hover:bg-mbz-yellow/90 text-violet-title dark:text-white dark:hover:text-white/90 rounded-lg dark:border-violet-title shadow-md dark:bg-gray-700 dark:hover:bg-gray-700/90 dark:text-white dark:hover:text-white;
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --oruga-variant-primary: #1e7d97;

    --oruga-field-label-color: white;

    --oruga-table-background-color: #111827;
    --oruga-table-th-color: white;

    --oruga-modal-content-background-color: #111827;

    --oruga-dropdown-item-color: white;
    --oruga-dropdown-menu-background: #111827;
    --oruga-dropdown-item-hover-color: white;
    --oruga-dropdown-item-hover-background-color: #111827;
  }
}