@import "tailwindcss";

/* Southernsun palette (southernsun.pl): amber brand on slate neutrals.
   Readability rules: amber (#ffac00) is only used as a background with dark
   text; text/links on white use brand-strong (AA contrast). */
@theme {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;

  --color-brand: #ffac00;
  --color-brand-hover: #f09e00;
  --color-brand-strong: #a35f00;   /* text & links on white (≥ 4.5:1) */
  --color-brand-tint: #fff3da;     /* highlights, disagreement rows */
  --color-brand-tint-strong: #ffe2a6;
  --color-brand-from: #ffb43d;
  --color-brand-to: #ff8a00;
  --color-ink: #0f172a;            /* slate-900 */
}

@utility btn {
  @apply inline-flex items-center justify-center gap-2 rounded-lg px-4 py-2 text-sm font-semibold transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-strong focus-visible:ring-offset-2 disabled:opacity-50 cursor-pointer;
}

@utility btn-primary {
  @apply btn bg-brand text-ink hover:bg-brand-hover shadow-sm;
}

@utility btn-secondary {
  @apply btn border border-slate-300 bg-white text-slate-700 hover:bg-slate-50;
}

@utility btn-danger {
  @apply btn border border-red-200 bg-white text-red-700 hover:bg-red-50;
}

@utility card {
  @apply rounded-xl border border-slate-200 bg-white shadow-sm;
}

@utility link {
  @apply font-medium text-brand-strong underline-offset-2 hover:underline;
}

@utility input {
  @apply block w-full rounded-lg border border-slate-300 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-brand-strong focus:outline-none focus:ring-2 focus:ring-brand/40;
}

@utility label {
  @apply mb-1 block text-sm font-medium text-slate-700;
}

@utility badge {
  @apply inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium whitespace-nowrap;
}

@utility th {
  @apply px-4 py-2 text-left text-xs font-semibold uppercase tracking-wide text-slate-500;
}

@utility td {
  @apply px-4 py-2 align-top text-sm text-slate-800;
}
