/* ==========================================================================
   Lake Hoops - Standings Page Styles
   ========================================================================== */

body {
  padding: 28px;
}

/* Lake Stevens Row Highlight
   ========================================================================== */
tbody tr.lake-stevens {
  background: #f3ecff;
}

/* Value Colors
   ========================================================================== */
.positive {
  color: var(--color-success);
  font-weight: bold;
}

.negative {
  color: var(--color-error);
  font-weight: bold;
}

.neutral {
  color: #95a5a6;
}

/* Streak Indicators
   ========================================================================== */
.win-streak {
  color: var(--color-success);
}

.lose-streak {
  color: var(--color-error);
}

/* Tiebreaker Badge
   ========================================================================== */
.tiebreaker {
  font-size: 0.7rem;
  color: var(--color-primary);
  margin-left: 4px;
  opacity: 0.7;
}

/* Insights Grid
   ========================================================================== */
.insights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

/* Insight Card
   ========================================================================== */
.insight-card {
  background: #f9f7ff;
  padding: 16px;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.insight-card h3 {
  margin: 0 0 8px;
  font-size: 0.95rem;
  color: #6b5b7b;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.insight-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-primary);
}

.insight-label {
  font-size: 0.85rem;
  color: #8b7b9b;
  margin-top: 4px;
}

/* Rank Badge
   ========================================================================== */
.rank-badge {
  display: inline-block;
  background: var(--color-primary);
  color: #fff;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  margin-left: 6px;
}

/* Responsive
   ========================================================================== */
@media (max-width: 750px) {
  body {
    padding: 18px;
  }
}