/* Common button styles (works with Tailwind CDN) */
.btn-primary {
  background-color: #2563eb; /* blue-600 */
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem; /* rounded */
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  transition: background-color 0.2s;
}
.btn-primary:hover {
  background-color: #1d4ed8; /* blue-700 */
}
.btn-primary:focus {
  outline: none;
  box-shadow: 0 0 0 2px #93c5fd; /* ring-blue-400 */
}

.btn-secondary {
  background-color: #e5e7eb; /* gray-200 */
  color: #111827; /* gray-900 */
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  transition: background-color 0.2s;
}
.btn-secondary:hover {
  background-color: #d1d5db; /* gray-300 */
}
.dark .btn-secondary {
  background-color: #374151; /* gray-700 */
  color: #f3f4f6; /* gray-100 */
}
.dark .btn-secondary:hover {
  background-color: #4b5563; /* gray-600 */
}

.btn-green {
  background-color: #16a34a; /* green-600 */
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  transition: background-color 0.2s;
}
.btn-green:hover {
  background-color: #15803d; /* green-700 */
}
.btn-green:focus {
  outline: none;
  box-shadow: 0 0 0 2px #86efac; /* ring-green-400 */
}