/* Hilfsklassen (Tailwind via CDN macht den Rest) */

.card {
  @apply bg-white rounded-lg shadow-sm border p-4;
}
.card h2 {
  @apply text-lg font-semibold mb-3;
}
.input {
  @apply w-full px-3 py-2 border rounded text-sm focus:outline-none focus:ring-2 focus:ring-blue-300;
}
.btn-primary {
  @apply px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded text-sm font-medium;
}
.btn-secondary {
  @apply px-3 py-1.5 border border-slate-300 hover:bg-slate-100 rounded text-sm;
}

.tab-btn {
  @apply px-4 py-2 border-b-2 border-transparent text-slate-600 hover:text-slate-900 hover:border-slate-300;
}
.tab-btn.active {
  @apply border-blue-600 text-blue-700 font-medium;
}

.list-item {
  @apply p-3 border rounded bg-slate-50;
}

#sig-canvas {
  cursor: crosshair;
  background: #fff;
}