/* ── shadcn-inspired reusable classes ── */

.shad-input {
  display: flex;
  height: 2.5rem;
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  padding: 0 0.75rem;
  font-size: 0.875rem;
  color: #111827;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.shad-input::placeholder { color: #9ca3af; }
.shad-input:focus {
  border-color: #111827;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #111827;
}

.shad-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  padding: 0 1.25rem;
  border-radius: 0.5rem;
  border: none;
  background: #111827;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, transform 0.1s;
}
.shad-btn-primary:hover { background: #1f2937; }
.shad-btn-primary:active { transform: scale(0.98); }
.shad-btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }

.shad-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.25rem;
  padding: 0 1rem;
  border-radius: 0.5rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s;
}
.shad-btn-outline:hover { background: #f9fafb; border-color: #d1d5db; }

.shad-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  padding: 0 0.75rem;
  border-radius: 0.375rem;
  border: none;
  background: transparent;
  color: #6b7280;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.shad-btn-ghost:hover { background: #f3f4f6; color: #111827; }

.shad-btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  padding: 0 0.75rem;
  border-radius: 0.375rem;
  border: none;
  background: #fef2f2;
  color: #dc2626;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.shad-btn-danger:hover { background: #fee2e2; }

/* ── Badges ── */
.badge-upcoming { background: rgba(16,185,129,0.12); color: #34d399; }
.badge-live { background: rgba(239,68,68,0.15); color: #f87171; animation: pulse-badge 1.5s ease-in-out infinite; }
.badge-finished { background: rgba(156,163,175,0.15); color: #9ca3af; }

@keyframes pulse-badge { 0%,100% { opacity: 1; } 50% { opacity: 0.6; } }

/* ── Spinner removal ── */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; appearance: textfield; }

/* ── Confetti canvas ── */
#confetti-canvas { width: 100vw; height: 100vh; }

/* ── Select styling ── */
.shad-select {
  display: flex;
  height: 2.5rem;
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  padding: 0 0.75rem;
  font-size: 0.875rem;
  color: #111827;
  outline: none;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.shad-select:focus {
  border-color: #111827;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #111827;
}

/* ── Form message variants ── */
.msg-success { background: #f0fdf4; border: 1px solid #bbf7d0; color: #16a34a; }
.msg-error { background: #fef2f2; border: 1px solid #fecaca; color: #dc2626; }
.msg-warning { background: #fffbeb; border: 1px solid #fde68a; color: #d97706; }

/* ── Admin tabs ── */
.admin-tab {
  flex: 1;
  padding: 0.5rem 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #9ca3af;
  background: transparent;
  border: none;
  border-radius: 0.375rem;
  cursor: pointer;
  transition: all 0.15s;
}
.admin-tab.active { background: #111827; color: #fff; }
.admin-tab:not(.active):hover { color: #374151; background: #f3f4f6; }

/* ── Bottom nav tabs ── */
.nav-tab { color: #9ca3af; }
.nav-tab.active { color: #111827; }
.nav-tab:not(.active):hover { color: #6b7280; }

/* ── Smooth page bg transition ── */
body { transition: background-color 0.5s ease; }
