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

@layer base {
  :root {
    --brand: #E63946;
  }

  body {
    @apply bg-gray-50 text-gray-900 antialiased;
  }

  * {
    @apply border-gray-200;
  }
}

@layer components {
  .sidebar-link {
    @apply flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium text-gray-600 transition-colors hover:bg-gray-100 hover:text-gray-900;
  }

  .sidebar-link-active {
    @apply bg-brand-50 text-brand-600;
  }

  .stat-card {
    @apply rounded-xl border bg-white p-6 shadow-sm;
  }

  .data-table th {
    @apply bg-gray-50 px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-gray-500;
  }

  .data-table td {
    @apply px-4 py-3 text-sm text-gray-700;
  }

  .data-table tr {
    @apply border-b border-gray-100 last:border-0;
  }

  .data-table tr:hover td {
    @apply bg-gray-50;
  }
}