/*
 * LigaHub — small plain-CSS overlay on top of Tabler (no preprocessor, no
 * Tailwind/@apply, no build step). Header, navbar, profile and footer use
 * native Tabler components/classes and need NO custom CSS here. This file only
 * keeps: a form-field shim for Django's default {{ form.as_p }}, icon alignment,
 * and a few content helpers (hero, stat cards, standings emphasis).
 */

/* --- Brand theme: indigo as the primary/action colour ------------------- */
/* Tabler 1.4.0 buttons/links/badges read these CSS variables, so recolouring
   the theme is just an override — no SCSS rebuild, no manual per-component
   repainting. Stays a light theme; only the accent moves to indigo (#735dff). */
:root {
  --tblr-primary: #735dff;
  --tblr-primary-rgb: 115, 93, 255;
  --tblr-primary-darken: #5a45e0; /* hover/active */
  --tblr-primary-lt: #ece9ff; /* soft tint for bg-primary-lt / avatars */
  --tblr-link-color: #735dff;
  --tblr-link-hover-color: #5a45e0;
}

/* --- Avatars ------------------------------------------------------------- */
/* Tabler draws a faint inset ring on every avatar — it defines
   --tblr-avatar-box-shadow ON the .avatar selector (not :root) and applies it via
   box-shadow. We show real logos / clean monograms, so drop the ring: null both
   the variable and the property at the same scope. No stacked avatar lists are
   used, so nothing relies on the ring for separation. */
.avatar {
  --tblr-avatar-box-shadow: none;
  box-shadow: none;
}

/* --- Icons (Tabler webfont) alignment ----------------------------------- */
.ti {
  vertical-align: -0.125em;
  line-height: 1;
}

/* --- Form field shim ----------------------------------------------------- */
/* Style bare inputs rendered by Django forms as Tabler-like .form-control. */
form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]),
form select,
form textarea {
  display: block;
  width: 100%;
  max-width: 28rem;
  padding: 0.4375rem 0.75rem;
  margin-top: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.4285714;
  color: #182433;
  background-color: #fff;
  border: 1px solid #dadfe5;
  border-radius: 4px;
  appearance: auto;
}

form input[type="file"] {
  margin-top: 0.25rem;
}

form p {
  margin-bottom: 1rem;
}

form label {
  font-weight: 500;
}

/* Django's default validation lists. */
ul.errorlist {
  margin: 0.25rem 0 0;
  padding-left: 1rem;
  color: #d63939;
  font-size: 0.8125rem;
  list-style: disc;
}

.helptext {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8125rem;
  color: #667382;
}

/* --- Inline action groups (list rows with edit/remove buttons) ---------- */
.row-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  align-items: center;
}

.row-actions form {
  margin: 0;
}

/* --- Public hero -------------------------------------------------------- */
.hero {
  padding: 4rem 1rem;
  text-align: center;
}
.hero-title {
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 0.75rem;
}
.hero-lead {
  font-size: 1.125rem;
  color: #667382;
  max-width: 42rem;
  margin: 0 auto 1.5rem;
}

/* --- Summary / stat cards ----------------------------------------------- */
.stat-card .stat-value {
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.1;
}
.stat-card .stat-label {
  color: #667382;
  text-transform: uppercase;
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
  margin-bottom: 0.25rem;
}

/* --- Standings table emphasis ------------------------------------------- */
.standings-table tbody tr:first-child {
  font-weight: 600;
}
.standings-table tbody tr:first-child td:first-child {
  border-left: 3px solid var(--tblr-primary, #4263eb);
}
/* Group stage: a green left stripe marks the rows advancing to the playoff
   (defined after the leader rule so it wins for a qualifying leader row). */
.standings-table tbody tr.lh-qualifies td:first-child {
  border-left: 3px solid var(--tblr-green, #2fb344);
}

/* --- Misc rhythm -------------------------------------------------------- */
.page-body .card + .card {
  margin-top: 1.25rem;
}
/* Inside a .space-y stack the flex gap already spaces cards; cancel the generic
   adjacent-card margin so it doesn't double up (e.g. the public leagues list). */
.page-body .space-y > .card + .card {
  margin-top: 0;
}
.feature-card .ti {
  font-size: 1.75rem;
  color: var(--tblr-primary, #4263eb);
}

/* Brand logo mark (inline SVG, no background). currentColor → brand colour so it
   tracks --tblr-primary; the adjacent wordmark keeps the link's own text colour. */
.brand-icon {
  color: var(--tblr-primary, #735dff);
  vertical-align: -0.2em;
}

/* --- Match row (mobile alignment) -------------------------------------- */
/* Flex children holding team names need min-width:0 so .text-truncate can
   shrink long names ("Красная Пресня") instead of pushing the row off-screen. */
.min-w-0 { min-width: 0; }
/* Score column: a min-width keeps scores aligned across rows ("10:10" fits),
   but it grows for a playoff row that also shows a penalty badge (пен. 5:4)
   instead of clipping it. A touch narrower on very small phones. */
.match-score { min-width: 4rem; }
@media (max-width: 480px) { .match-score { min-width: 3.25rem; } }
/* Footer link rows: breathing room when they wrap to several lines on mobile
   (items are display:inline, so line-height — not row-gap — adds the space). */
.footer .list-inline { line-height: 2; }

/* Bracket accent presets — recolor winner/active cells (also carried into PNG). */
[data-bracket-grid][data-accent="blue"] .list-group-item.active { border-left-color: #066fd1; background-color: rgba(6, 111, 209, 0.12); }
[data-bracket-grid][data-accent="green"] .list-group-item.active { border-left-color: #2fb344; background-color: rgba(47, 179, 68, 0.14); }
[data-bracket-grid][data-accent="red"] .list-group-item.active { border-left-color: #d63939; background-color: rgba(214, 57, 57, 0.12); }
[data-bracket-grid][data-accent="orange"] .list-group-item.active { border-left-color: #f76707; background-color: rgba(247, 103, 7, 0.14); }