/* Sparse overrides on top of Tailwind CDN. */
* { box-sizing: border-box; }
html, body { height: 100%; }
body { font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

.btn        { @apply inline-flex items-center justify-center rounded-md px-3 py-1.5 text-sm font-medium transition; }
.btn-primary{ @apply bg-indigo-600 text-white hover:bg-indigo-700 disabled:opacity-50; }
.btn-ghost  { @apply text-slate-700 hover:bg-slate-100 disabled:opacity-50; }
.btn-danger { @apply bg-red-600 text-white hover:bg-red-700 disabled:opacity-50; }
.btn-sub    { @apply bg-white border border-slate-300 hover:bg-slate-50 text-slate-700; }

.kbd { @apply inline-flex items-center gap-1 rounded border border-slate-300 bg-slate-50 px-1.5 py-0.5 text-xs text-slate-600; }

.row-hover:hover { background: rgba(99, 102, 241, 0.04); }

.spinner {
    width: 16px; height: 16px;
    border: 2px solid rgba(99, 102, 241, 0.25);
    border-top-color: rgb(99, 102, 241);
    border-radius: 9999px;
    animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.modal-bg { background: rgba(15, 23, 42, 0.45); }

.tag {
    @apply inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium;
}
.tag-active   { @apply bg-emerald-100 text-emerald-700; }
.tag-trialing { @apply bg-sky-100 text-sky-700; }
.tag-past_due { @apply bg-amber-100 text-amber-700; }
.tag-recovery_required { @apply bg-rose-100 text-rose-700; }
.tag-canceled { @apply bg-slate-200 text-slate-600; }
.tag-expired  { @apply bg-slate-200 text-slate-500; }

table.tbl { @apply w-full text-left text-sm; }
table.tbl thead th { @apply px-3 py-2 text-xs font-semibold uppercase tracking-wider text-slate-500 bg-slate-50 border-b border-slate-200; }
table.tbl tbody td { @apply px-3 py-2 border-b border-slate-100 align-top; }
table.tbl tbody tr:hover { background: rgba(99, 102, 241, 0.04); }

.field-label { @apply block text-xs font-medium text-slate-600 mb-1; }
.field-input { @apply block w-full rounded border border-slate-300 px-2.5 py-1.5 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500; }
