/* app/assets/stylesheets/application.css */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* Tailwind base is loaded via tailwind.css — this file handles extras */

:root,
.theme-pickleball {
  --sport-brand: #7cff2b;
  --sport-brand-hover: #a3ff5c;
  --sport-brand-soft: rgb(124 255 43 / 0.14);
  --sport-brand-border-soft: rgb(124 255 43 / 0.34);
  --sport-surface: rgb(18 113 48 / 0.30);
  --sport-surface-2: rgb(97 255 66 / 0.14);
  --sport-brand-glow: rgb(124 255 43 / 0.42);
}

.theme-table-tennis {
  --sport-brand: #ef4444;
  --sport-brand-hover: #f87171;
  --sport-brand-soft: rgb(239 68 68 / 0.12);
  --sport-brand-border-soft: rgb(239 68 68 / 0.28);
  --sport-surface: rgb(127 29 29 / 0.28);
  --sport-surface-2: rgb(248 113 113 / 0.08);
  --sport-brand-glow: rgb(239 68 68 / 0.22);
}

.theme-tennis {
  --sport-brand: #22c55e;
  --sport-brand-hover: #4ade80;
  --sport-brand-soft: rgb(34 197 94 / 0.12);
  --sport-brand-border-soft: rgb(34 197 94 / 0.28);
  --sport-surface: rgb(21 128 61 / 0.25);
  --sport-surface-2: rgb(74 222 128 / 0.08);
  --sport-brand-glow: rgb(34 197 94 / 0.22);
}

.theme-header { border-bottom-color: var(--sport-brand); }
.theme-hero {
  background-color: #030712;
  background-image:
    radial-gradient(ellipse at 20% 50%, var(--sport-surface) 0%, transparent 60%),
    radial-gradient(circle at 85% 20%, var(--sport-surface-2) 0%, transparent 32%);
}

.theme-brand-text { color: var(--sport-brand); }
.theme-brand-text-hover:hover { color: var(--sport-brand); }
.theme-brand-border { border-color: var(--sport-brand); }
.theme-brand-border-hover:hover { border-color: var(--sport-brand); }
.theme-brand-soft { background-color: var(--sport-brand-soft); }
.theme-brand-border-subtle { border-color: var(--sport-brand-border-soft); }
.theme-brand-divider { background-color: var(--sport-brand-border-soft); }
.theme-brand-glow {
  text-shadow:
    0 0 10px var(--sport-brand-glow),
    0 0 24px color-mix(in srgb, var(--sport-brand) 28%, transparent);
}

.theme-button-primary {
  background-color: var(--sport-brand);
  color: #030712;
  box-shadow:
    0 16px 30px -18px var(--sport-brand),
    0 0 18px -6px var(--sport-brand-glow);
}

.theme-button-primary:hover {
  background-color: var(--sport-brand-hover);
}

.theme-input:focus {
  border-color: var(--sport-brand);
  box-shadow: 0 0 0 1px var(--sport-brand);
}

/* Remove number input spinners for score fields */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] { -moz-appearance: textfield; }

/* Smooth tab transitions */
[id^="tab-"] { animation: fadeIn 0.15s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; } }

/* Live score pulse on game cards */
.game-live { border-color: rgb(234 88 12) !important; }