/* === Color theme: "Fairway & Sky" ===
   One cohesive palette instead of stock Bootstrap blue/green/red/yellow,
   same semantic roles as before (primary=Open Division, success=Mixed
   Division, danger=alerts/live, warning=pending, secondary=neutral/
   friendly, dark=navbar), just intentionally-chosen colors that relate to
   each other instead of generic framework defaults. Overriding Bootstrap's
   own CSS variables means every button, background, text, and border
   utility class across the whole site picks this up automatically - no
   template needs to change which class it uses, just what that class
   renders as. */
:root {
  --bs-primary:            #2E6F9E;
  --bs-primary-rgb:        46, 111, 158;
  --bs-secondary:          #707A72;
  --bs-secondary-rgb:      112, 122, 114;
  --bs-success:            #2F7A40;
  --bs-success-rgb:        47, 122, 64;
  --bs-info:               #3E8FB0;
  --bs-info-rgb:           62, 143, 176;
  --bs-warning:            #D99A2B;
  --bs-warning-rgb:        217, 154, 43;
  --bs-danger:             #C0392B;
  --bs-danger-rgb:         192, 57, 43;
  --bs-dark:               #16232B;
  --bs-dark-rgb:           22, 35, 43;
  --bs-light:              #F3F5F3;
  --bs-light-rgb:          243, 245, 243;
  --bs-body-bg:            #F3F5F3;
  --bs-link-color:         #2E6F9E;
  --bs-link-color-rgb:     46, 111, 158;
  --bs-link-hover-color:   #24597E;
  --bs-link-hover-color-rgb: 36, 89, 126;
}

/* Bootstrap's compiled CSS bakes a few hover/focus shades in directly
   rather than deriving them from the variables above at runtime (no Sass
   build step here) - patched by hand so hover states stay in-palette. */
.btn-primary:hover, .btn-primary:focus { background-color: #24597E; border-color: #24597E; }
.btn-success:hover, .btn-success:focus { background-color: #245F32; border-color: #245F32; }
.btn-danger:hover,  .btn-danger:focus  { background-color: #9C2E23; border-color: #9C2E23; }
.btn-warning:hover, .btn-warning:focus { background-color: #C08A26; border-color: #C08A26; }
.btn-info:hover,    .btn-info:focus    { background-color: #35798F; border-color: #35798F; }

/* -- General -- */
body {
  background: var(--bs-body-bg);
  font-family: 'Segoe UI', system-ui, sans-serif;
}

.container-fluid {
  max-width: 1400px;
}

/* -- Navbar -- */
.navbar-brand {
  letter-spacing: 0.5px;
}

/* -- Cards -- */
.card {
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
  border-radius: 8px;
}

.card-header {
  font-size: .95rem;
}

/* -- Dashboard stat boxes -- */
.stat-box {
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 10px 6px;
}

.stat-num {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}

.stat-lbl {
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #6c757d;
  letter-spacing: 0.5px;
  margin-top: 2px;
}

/* -- Match cards (knockout) -- */
.match-card {
  transition: box-shadow .15s;
}

.match-card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
}

/* -- Score input -- */
.score-input:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb),.15);
}

/* -- Player badges -- */
.player-badge {
  font-size: .8rem;
  padding: .35em .65em;
}

/* -- Tables -- */
.table th {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: #495057;
}

/* -- Round Robin result colours -- */
.result-win   { color: var(--bs-success); font-weight: 600; }
.result-draw  { color: var(--bs-warning); font-weight: 600; }
.result-loss  { color: var(--bs-danger); }

/* -- Standings position badges -- */
.pos-1 { background: #ffc107; color: #000; }
.pos-2 { background: #adb5bd; color: #fff; }
.pos-3 { background: #cd7f32; color: #fff; }

/* -- Print -- */
@media print {
  .navbar, .btn, .alert-dismissible .btn-close,
  button, .no-print { display: none !important; }
  body { background: white; }
  .card { box-shadow: none; border: 1px solid #ccc; }
  .d-print-block { display: block !important; }
}

/* -- Responsive tweaks -- */
@media (max-width: 576px) {
  .stat-num { font-size: 1.3rem; }
  h2 { font-size: 1.3rem; }
}

/* -- Bracket connector lines (visual) -- */
.bracket-col {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

/* -- Animations -- */
.fade-in {
  animation: fadeIn .3s ease-in;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* -- Active nav -- */
.nav-link.active {
  background: rgba(255,255,255,.15);
  border-radius: 4px;
}