/* =========================================================
   MOTYW "Czysta biel" w barwach banera Sportowej Ligi McDonald's
   Biel + żółć banera (#FFBB04), czerń, zieleń logo (#23502F).
   Czcionki: Archivo Expanded (nagłówki jak na banerze) + Plus Jakarta Sans.
   Włączony przez <html data-theme="c"> w index.html.
   ========================================================= */

/* ---------- Tokeny motywu ---------- */
html[data-theme="c"] {
  --bg: #F6F6F7; --card: #FFFFFF; --surface: #FFFFFF; --surface-2: #F1F1F3; --line: #E6E6EA;
  --ink: #111113; --ink-2: #3A3A40; --muted: #74747C;
  --primary: #111113; --primary-ink: #fff; --accent: #FFBB04; --accent-ink: #111;
  --green: #23502F;
  --link: #23502F; --points: #23502F;
  --nav-bg: rgba(255, 255, 255, .85); --nav-bg-solid: #FFFFFF; --nav-fg: #111113; --nav-active-bg: #F1F1F3;
  --head-bg: #FFBB04; --head-fg: #111113; --head-sub: #3D3000;
  --stats-bg: #FFFFFF; --stats-num: #23502F; --stats-fg: #3A3A40;
  --font-display: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif;
  --table-head-bg: #FFFFFF; --table-head-fg: #74747C; --hover: #FAFAFB;
  --footer-bg: #111113; --banner-bg: #111113;
  --hero-tint: linear-gradient(90deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0) 60%);
  --shadow: 0 1px 2px rgba(17, 17, 19, .04), 0 6px 18px rgba(17, 17, 19, .05);
  --shadow-lg: 0 20px 50px rgba(17, 17, 19, .14);
  --font-head: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body: "Plus Jakarta Sans", system-ui, sans-serif;
  --head-weight: 800; --head-spacing: -.03em;
}

/* ---------- Wspólne „nowoczesne” poprawki dla każdego motywu ---------- */
html[data-theme] { --radius: 20px; --radius-sm: 12px; }
html[data-theme] body { background: var(--bg); color: var(--ink); }
html[data-theme] a { color: var(--link); }

/* nagłówki: bez wersalików, ciaśniejsze odstępy */
html[data-theme] :is(h1, h2, h3, h4, .section__title, .hero__title, .podium__name, .mvp__name, .rule__title,
  .page-head h1, .admin__bar h1, .panel h2, .panel h3, .event-banner h3, .article__title, .article-card__title,
  .mvp-head h3, .login h1, .brand__title, .stat__num, .points, .pos-badge, .podium__medal) {
  font-family: var(--font-head); text-transform: none; letter-spacing: var(--head-spacing); font-weight: var(--head-weight);
}
html[data-theme] .section__title::before { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 25%, transparent); }
html[data-theme] .hero__title { font-size: clamp(2.1rem, 7vw, 4.4rem); line-height: 1; }
html[data-theme] .hero__title em { color: var(--accent); }

/* navbar: szkło + blur */
html[data-theme] .navbar {
  background: var(--nav-bg); color: var(--nav-fg);
  -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--nav-fg) 10%, transparent);
}
html[data-theme] .brand { color: var(--nav-fg); }
html[data-theme] .brand__title { font-size: 1.05rem; }
html[data-theme] .brand__sub { color: var(--accent); }
html[data-theme="c"] .brand__sub { color: var(--muted); }
html[data-theme] .brand__logo { box-shadow: none; }
html[data-theme] .nav-toggle span { background: var(--nav-fg); }
html[data-theme] .nav { background: var(--nav-bg-solid); }
html[data-theme] .nav a {
  color: var(--nav-fg); font-family: var(--font-body); text-transform: none; letter-spacing: 0; font-weight: 600;
  border-bottom-color: color-mix(in srgb, var(--nav-fg) 10%, transparent);
}
html[data-theme] .nav a.is-active { color: var(--accent); }
html[data-theme="c"] .nav a.is-active { color: var(--primary); }
@media (min-width: 860px) {
  html[data-theme] .nav { background: none; }
  html[data-theme] .nav a:hover { background: var(--nav-active-bg); }
  html[data-theme] .nav a.is-active { background: var(--nav-active-bg); }
  html[data-theme] .nav__admin { background: var(--accent); color: var(--accent-ink) !important; }
  html[data-theme="c"] .nav__admin { background: var(--ink); color: #fff !important; }
  html[data-theme] .nav__admin.is-active { box-shadow: none; }
}

/* hero */
html[data-theme] .carousel::after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, .7) 100%), var(--hero-tint);
}
html[data-theme] .carousel__dot.is-active, html[data-theme] .carousel__progress { background: var(--accent); }
html[data-theme] .carousel__arrow:hover { background: var(--accent); color: var(--accent-ink); }
html[data-theme] .hero .tag { background: var(--accent); color: var(--accent-ink); }
html[data-theme] .hero__caption a { color: #fff; text-decoration-color: var(--accent); }

/* przyciski, tagi */
html[data-theme] .btn--primary { background: var(--primary); color: var(--primary-ink); }
html[data-theme] .btn--primary:hover { filter: brightness(1.08); background: var(--primary); }
html[data-theme] .btn--yellow { background: var(--accent); color: var(--accent-ink); }
html[data-theme] .btn--ghost { color: var(--ink); border-color: var(--line); }
html[data-theme] .hero .btn--ghost { color: #fff; }
html[data-theme] .btn--danger { border-color: color-mix(in srgb, #DA291C 35%, transparent); }
html[data-theme] .tag { background: var(--surface-2); color: var(--ink); letter-spacing: .02em; text-transform: none; font-size: .78rem; }
html[data-theme] .tag--red { background: var(--primary); color: var(--primary-ink); }
html[data-theme] .tag--dark { background: var(--ink); color: var(--bg); }

/* statystyki */
html[data-theme] .stats { background: var(--stats-bg); border-bottom: 1px solid var(--line); }
html[data-theme] .stats__grid { background: var(--line); }
html[data-theme] .stat { background: var(--stats-bg); padding: 20px 12px; }
html[data-theme] .stat__num { color: var(--stats-num); font-size: 2.2rem; }
html[data-theme] .stat__label { color: var(--stats-fg); text-transform: none; letter-spacing: 0; font-weight: 500; }

/* karty i powierzchnie */
html[data-theme] .card { background: var(--card); border: 1px solid var(--line); }
html[data-theme] :is(.chip, .search, .tab, .empty, .admin-list li, .person-row, .pdf-chip,
  .field input, .field select, .field textarea, .input) {
  background: var(--surface); border-color: var(--line); color: var(--ink);
}
html[data-theme] .chip.is-active, html[data-theme] .filters a.chip.is-active { background: var(--ink); color: var(--bg); border-color: var(--ink); }
html[data-theme] .filters a.chip { color: var(--ink); }
html[data-theme] .tab.is-active { background: var(--primary); color: var(--primary-ink); }
html[data-theme] .dropzone { background: var(--surface-2); border-color: color-mix(in srgb, var(--accent) 70%, var(--line)); }
html[data-theme] .dropzone strong { color: var(--link); }
html[data-theme] .photo-field label { color: var(--link); }

/* ranking */
html[data-theme] .ranking th { background: var(--table-head-bg); color: var(--table-head-fg); font-family: var(--font-body); letter-spacing: .04em; border-bottom: 1px solid var(--line); }
html[data-theme] .ranking td { border-bottom-color: var(--line); }
html[data-theme] .ranking tbody tr:hover { background: var(--hover); }
html[data-theme] .pos-badge { background: var(--surface-2); color: var(--ink-2); }
html[data-theme] .points { color: var(--points); }
html[data-theme] .bar { background: var(--surface-2); }
html[data-theme] .bar__fill { background: linear-gradient(90deg, var(--accent), var(--green, var(--primary))); }

/* nagłówki podstron */
html[data-theme] .page-head { background: var(--head-bg); color: var(--head-fg); padding: 48px 0 40px; }
html[data-theme="c"] .page-head { border-bottom: 1px solid var(--line); }
html[data-theme] .page-head p { color: var(--head-sub); }
html[data-theme] .page-head::after { border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
html[data-theme="c"] .page-head::after { border-color: rgba(255, 255, 255, .35); }

/* ostatni turniej */
html[data-theme] .event-banner { background: var(--banner-bg); }
html[data-theme] .podium__item { border-top-width: 4px; }

/* regulaminy */
html[data-theme] .rule { border-left-color: var(--line); }
html[data-theme] .rule[open] { border-left-color: var(--accent); }
html[data-theme] .rule summary::after { background: var(--surface-2); }
html[data-theme] .rule[open] summary::after { background: var(--primary); color: var(--primary-ink); }
html[data-theme] .rich h3 { color: var(--points); text-transform: none; }
html[data-theme] .rule__scoring { background: var(--surface-2); border-color: var(--line); }
html[data-theme] .score-table th { border-bottom-color: var(--line); }
html[data-theme] .score-table td { border-bottom-color: var(--line); }

/* stopka */
html[data-theme] .footer { background: var(--footer-bg); border-top: 4px solid var(--accent); }
html[data-theme] .footer__brand { text-transform: none; letter-spacing: 0; font-family: var(--font-head); }

/* =========================================================
   Styl banera ligi: szerokie wersaliki z rozstrzelonymi literami
   ========================================================= */
html[data-theme="c"] :is(.brand__title, .hero__title, .page-head h1, .section__title, .footer__brand span, .league-banner__title) {
  font-family: var(--font-display); font-stretch: 125%; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
}
html[data-theme="c"] .brand__text { min-width: 0; }
html[data-theme="c"] .brand__title { font-size: clamp(.68rem, 2.4vw, .95rem); letter-spacing: .08em; line-height: 1.15; }
html[data-theme="c"] .brand__sub { font-size: clamp(.55rem, 1.8vw, .68rem); letter-spacing: .32em; font-weight: 600; margin-top: 2px; }
html[data-theme="c"] .brand__logo { border-radius: 10px; }
html[data-theme="c"] .footer__brand img { border-radius: 7px; }
@media (min-width: 860px) and (max-width: 1100px) {
  html[data-theme="c"] .brand__sub { display: none; }
  html[data-theme="c"] .nav a { padding: 8px 10px; }
}

html[data-theme="c"] .hero__title { font-size: clamp(1.7rem, 6vw, 3.9rem); line-height: 1.02; letter-spacing: .04em; }
html[data-theme="c"] .hero__slogan {
  display: block; margin: 0 0 14px; color: #fff; font-weight: 600; letter-spacing: .38em; font-size: clamp(.7rem, 2.2vw, 1rem);
}
html[data-theme="c"] .section__title { font-size: clamp(1.15rem, 3.4vw, 1.7rem); letter-spacing: .06em; }
html[data-theme="c"] .section__title::before { width: 8px; height: 26px; border-radius: 3px; box-shadow: none; background: var(--accent); }
html[data-theme="c"] .page-head h1 { font-size: clamp(1.6rem, 6vw, 2.8rem); }
html[data-theme="c"] .page-head { border-bottom: 0; }

html[data-theme="c"] .nav a.is-active { color: var(--ink); box-shadow: inset 0 -3px 0 var(--accent); }
@media (min-width: 860px) {
  html[data-theme="c"] .nav a.is-active { box-shadow: inset 0 0 0 2px var(--accent); background: #fff8e0; }
}
html[data-theme="c"] .stats { border-top: 6px solid var(--accent); }
html[data-theme="c"] .tag--red { background: var(--green); color: #fff; }
html[data-theme="c"] .event-banner { background: var(--ink); border-left: 8px solid var(--accent); }

html[data-theme="c"] .footer__brand span { font-size: .9rem; }
html[data-theme="c"] .footer__slogan { color: var(--accent); letter-spacing: .38em; font-size: .78rem; font-weight: 600; }

/* ---------- Baner ligi na stronie głównej ---------- */
.league-banner { display: block; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); background: #FFBB04; }
.league-banner img { width: 100%; height: auto; display: block; }

/* ---------- Drużyny ---------- */
.teams-grid { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 680px) { .teams-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .teams-grid { grid-template-columns: repeat(3, 1fr); } }
.team-card { display: flex; flex-direction: column; }
.team-card__kit { background: #fff; padding: 8px; border-bottom: 1px solid var(--line); cursor: zoom-in; border: 0; width: 100%; }
.team-card__kit img { width: 100%; aspect-ratio: 5 / 4; object-fit: contain; }
.team-card__body { padding: 16px 18px 18px; display: grid; gap: 4px; border-top: 1px solid var(--line); }
.team-card__name { font-family: var(--font-display); font-stretch: 125%; font-weight: 800; font-size: 1.15rem; letter-spacing: .04em; margin: 0; text-transform: uppercase; }
.team-card__owner { color: var(--muted); font-size: .9rem; margin: 0; }
.team-card__pts { margin-top: 6px; font-size: .85rem; color: var(--ink-2); }
.team-card__pts strong { color: var(--points); font-size: 1.1rem; }
.admin-kit { display: flex; align-items: center; gap: 6px; }
.admin-kit img { width: 40px; height: 32px; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.admin-kit label { font-size: .75rem; font-weight: 700; color: var(--link); cursor: pointer; white-space: nowrap; }
.admin-kit input { display: none; }
/* „McDONALD'S” – zapis jak na banerze (bez zamiany „c” na wielką literę) */
html[data-theme="c"] :is(.brand__title, .hero__title, .footer__brand span) { text-transform: none; }
html[data-theme="c"] .nav a { white-space: nowrap; }
@media (min-width: 860px) and (max-width: 1100px) {
  html[data-theme="c"] .nav { gap: 0; }
  html[data-theme="c"] .nav a { font-size: .88rem; padding: 8px 9px; }
  html[data-theme="c"] .nav__admin { margin-left: 4px; }
}
/* ---------- Najbliższy turniej: plakat + informacje ---------- */
.upcoming { display: grid; gap: 18px; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 760px) { .upcoming { grid-template-columns: minmax(260px, 380px) 1fr; } }
.upcoming--no-poster { grid-template-columns: 1fr; }
.upcoming__poster {
  padding: 0; border: 0; cursor: zoom-in; border-radius: var(--radius); overflow: hidden; background: #111;
  box-shadow: var(--shadow-lg); transition: transform .2s; justify-self: center; width: 100%; max-width: 420px;
}
.upcoming__poster:hover { transform: translateY(-3px) rotate(-.4deg); }
.upcoming__poster img { width: 100%; height: auto; aspect-ratio: 848 / 1264; object-fit: cover; }
.upcoming__info {
  background: var(--ink); color: #fff; border-radius: var(--radius); padding: 24px;
  display: flex; flex-direction: column; gap: 18px; border-top: 8px solid var(--accent);
  background-image: radial-gradient(120% 80% at 100% 0%, rgba(255, 187, 4, .16), transparent 60%);
}
.upcoming__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
html[data-theme] .upcoming__info .tag { background: var(--accent); color: var(--accent-ink); }
.upcoming__countdown {
  font-family: var(--font-display); font-stretch: 125%; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--accent); font-size: clamp(1rem, 2.6vw, 1.35rem);
}
.upcoming__title { margin: 0; font-size: clamp(1.3rem, 3vw, 1.8rem); color: #fff; }
.upcoming__facts { margin: 0; display: grid; gap: 10px; grid-template-columns: 1fr; }
@media (min-width: 520px) { .upcoming__facts { grid-template-columns: repeat(3, auto); justify-content: start; column-gap: 32px; } }
.upcoming__facts dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .18em; color: #a9a9b2; font-weight: 700; }
.upcoming__facts dd { margin: 2px 0 0; font-weight: 700; font-size: 1.1rem; }
.upcoming__facts dd span { font-weight: 500; color: #c9c9cf; font-size: .9rem; }
.upcoming__label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .18em; color: #a9a9b2; font-weight: 700; margin-bottom: 8px; }
.upcoming__teams ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.upcoming__teams li span { white-space: nowrap; }
.upcoming__teams li {
  display: flex; align-items: center; gap: 10px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px; padding: 8px 10px; font-weight: 800; letter-spacing: .02em;
}
.upcoming__teams img { width: 44px; height: 36px; object-fit: contain; background: #fff; border-radius: 6px; }
.upcoming__note { margin: 0; color: #c9c9cf; font-size: .92rem; }
.upcoming__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: auto; }
html[data-theme] .upcoming__info .btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .35); }
html[data-theme] .upcoming__info .btn--ghost:hover { border-color: #fff; }
.event-banner__poster { padding: 0; border: 0; cursor: zoom-in; border-radius: 8px; overflow: hidden; width: 56px; flex: 0 0 56px; }
.event-banner__poster img { width: 56px; height: 84px; object-fit: cover; }