/* ==========================================================================
   MAHL – dizajnové premenné a základné komponenty (v1, 13.10.2026)
   Zdroj pravdy pre farby a typografiu. Používa MAHL Stats, MAHL Bloky
   aj (neskôr) téma. Ak téma definuje rovnaké premenné, prepíšu tieto.
   ========================================================================== */

:root {
  /* Farby – z plagátov MAHL */
  --mahl-navy:        #202739;  /* text, panely, skóre */
  --mahl-navy-2:      #343D57;  /* hover na navy, linky v navy pätičke */
  --mahl-red:         #AF2421;  /* akcent, CTA, aktívny stav */
  --mahl-red-dark:    #8C1B19;  /* hover na červenej */
  --mahl-red-light:   #E0534E;  /* červená na navy pozadí (kontrast) */
  --mahl-white:       #FFFFFF;  /* sekcie, riadky */
  --mahl-bg:          #F0F0F0;  /* bledosivé pozadie stránky */
  --mahl-row:         #F7F7F7;  /* riadky na bielom pozadí */
  --mahl-line:        #DADDE3;  /* tenké deliace čiary */
  --mahl-outline:     #D2D5DB;  /* obrysový text „MAHL" na pozadí */
  --mahl-muted:       #5A6275;  /* meta texty, popisky */
  --mahl-text-2:      #3F4760;  /* bežný odsekový text */
  --mahl-on-navy:     #E4E7EE;  /* odkazy a text na navy (pätička) */
  --mahl-on-navy-2:   #C9CEDA;  /* tlmený text na navy (pätička) */
  --mahl-win:         #2E8B57;  /* kladný gólový rozdiel */
  --mahl-gold:        #B8913A;  /* 1. miesto */
  --mahl-silver:      #8C939F;  /* 2. miesto */
  --mahl-bronze:      #A86B3C;  /* 3. miesto */

  /* Typografia – web používa Barlow Condensed (plná slovenčina, OFL).
     DiamanteEF zostáva len na plagátoch (chýbajú mu Č Ď Ľ Ĺ Ň Ŕ Ť a nie je dostupná webová licencia). */
  --mahl-font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif; /* kurzíva 800–900, VEĽKÉ – nadpisy, priezviská */
  --mahl-font-meta:    'Barlow Condensed', 'Arial Narrow', sans-serif; /* kurzíva 500–600 meta riadky, 700 normal štítky */
  --mahl-font-body:    'Barlow', system-ui, sans-serif;

  /* Šikmý rez – charakteristický prvok plagátov */
  --mahl-skew:    18px;  /* veľké pásy (výsledky, riadky tabuľky) */
  --mahl-skew-sm: 10px;  /* tlačidlá, skóre box */

  /* Šírka obsahu – rovnaká hrana pre hlavičku, stránky, bloky aj pätičku */
  --mahl-wrap:   1320px;
  --mahl-gutter: 32px;   /* vodorovné odsadenie obsahu od okraja (mobil 16 px) */

  /* Hrúbky písma – NIKDY 800/900 (pôsobí ťažkopádne). Nadpisy 700, štítky/menu/tlačidlá 600. */
  --mahl-fw-display: 700;  /* nadpisy, mená, čísla, skóre (Barlow Condensed kurzíva) */
  --mahl-fw-strong:  600;  /* podnadpisy, štítky, menu, tlačidlá */
  --mahl-fw-meta:    500;  /* meta riadky */
  --mahl-fw-body:    400;  /* bežný text */

  /* Odsadenia */
  --mahl-space-1: 4px;
  --mahl-space-2: 8px;
  --mahl-space-3: 16px;
  --mahl-space-4: 24px;
  --mahl-space-5: 40px;
  --mahl-space-6: 64px;
  --mahl-section-pad: 88px;  /* zvislé odsadenie sekcie (tablet 64, mobil 48) */
  --mahl-card-pad:    28px;  /* vnútorné odsadenie karty (mobil 20) */
}
@media (max-width: 1023px) { :root { --mahl-section-pad: 64px; } }
@media (max-width: 679px)  { :root { --mahl-section-pad: 48px; --mahl-card-pad: 20px; --mahl-gutter: 16px; } }

/* Fonty – self-hosted (Barlow, Barlow Condensed © The Barlow Project Authors, SIL OFL 1.1 – fonts/OFL-LICENSE.txt).
   Žiadne Google Fonts CDN (GDPR). Rozdelené na latin + latin-ext, prehliadač stiahne latin-ext len pri slovenských znakoch. */
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 500; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-500-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 500; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-500-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 600; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-600-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 600; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-600-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-700-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-700-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: var(--mahl-fw-display); font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-800-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: var(--mahl-fw-display); font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-800-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 900; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-ext-900-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 900; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-condensed-latin-900-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-ext-400-italic.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-400-italic.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-ext-600-normal.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/barlow/barlow-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* ---------- Typografia ---------- */
.mahl-display { font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-display); text-transform: uppercase; line-height: .9; }
.mahl-meta    { font-family: var(--mahl-font-meta);    font-style: italic; font-weight: var(--mahl-fw-meta); text-transform: uppercase; }
.mahl-first-name { font-family: var(--mahl-font-meta); font-style: italic; font-weight: var(--mahl-fw-strong); text-transform: uppercase; letter-spacing: .34em; }
.mahl-num     { font-variant-numeric: tabular-nums; }

/* Krátka červená linka pod nadpisom */
.mahl-rule { width: 56px; height: 4px; background: var(--mahl-red); border: 0; margin: 0; }

/* Obrysový text na pozadí (MAHL, číslo dresu) */
.mahl-outline-text { color: transparent; -webkit-text-stroke: 1.5px var(--mahl-outline); }

/* ---------- Štítky (dátum / kolo / divízia) ---------- */
.mahl-tag { display: inline-flex; align-items: center; height: 38px; padding: 0 14px;
  font-family: var(--mahl-font-meta); font-weight: var(--mahl-fw-strong); font-size: 22px; color: #fff; background: var(--mahl-navy); }
.mahl-tag--red { background: var(--mahl-red); }

/* ---------- Tlačidlá a odkazy ---------- */
.mahl-btn { display: inline-flex; align-items: center; min-height: 50px; padding: 0 28px; text-decoration: none;
  font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-strong); font-size: 20px; text-transform: uppercase;
  clip-path: polygon(var(--mahl-skew-sm) 0, 100% 0, calc(100% - var(--mahl-skew-sm)) 100%, 0 100%); }
.mahl-btn--red  { background: var(--mahl-red);  color: #fff; } .mahl-btn--red:hover  { background: var(--mahl-red-dark); color: #fff; }
.mahl-btn--navy { background: var(--mahl-navy); color: #fff; } .mahl-btn--navy:hover { background: var(--mahl-navy-2); color: #fff; }
.mahl-more { font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-strong); font-size: 19px; text-transform: uppercase;
  color: var(--mahl-navy); border-bottom: 3px solid var(--mahl-red); padding-bottom: 2px; text-decoration: none; }

/* ---------- Šikmý pás (riadok zápasu / tabuľky) ---------- */
.mahl-band { background: var(--mahl-white);
  clip-path: polygon(var(--mahl-skew) 0, 100% 0, calc(100% - var(--mahl-skew)) 100%, 0 100%); }
.mahl-band--light { background: var(--mahl-row); }

/* Navy box so skóre / časom */
.mahl-score { display: flex; align-items: center; justify-content: center; background: var(--mahl-navy); color: #fff;
  font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-display); font-variant-numeric: tabular-nums;
  clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%); }

/* Navy panel so štatistikami (Hráč kola) – rez len vpravo */
.mahl-stat-panel { background: var(--mahl-navy); color: #fff; display: flex; gap: 28px; padding: 18px 60px 18px 24px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 34px) 100%, 0 100%); }

/* Nadpis sekcie s navy čiarou (bloky v štatistikách) */
.mahl-h3 { font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-display); text-transform: uppercase;
  font-size: 34px; line-height: .9; margin: 0; padding-bottom: 10px; border-bottom: 3px solid var(--mahl-navy); }

/* Pod-navigácia (záložky) */
.mahl-subnav { display: flex; gap: 2px; flex-wrap: wrap; }
.mahl-subnav a { min-height: 46px; display: flex; align-items: center; padding: 0 16px; text-decoration: none;
  font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-strong); font-size: 19px; text-transform: uppercase;
  color: var(--mahl-navy); background: var(--mahl-white); }
.mahl-subnav a.is-active, .mahl-subnav a[aria-current] { background: var(--mahl-navy); color: #fff; }

/* ---------- Rozbaľovací zoznam (filtre) ----------
   <label class="mahl-field"><span class="mahl-field__label">Sezóna</span><select>…</select></label>
   Popisok sedí na hornom ráme, šípka vpravo. Odoslanie po zmene rieši skript stránky (bez tlačidla „Zobraziť"). */
.mahl-field { position: relative; display: inline-flex; flex-direction: column; min-width: 220px; margin: 0; }
.mahl-field__label { position: absolute; top: -8px; left: 12px; z-index: 1; padding: 0 6px; line-height: 16px;
  font-family: var(--mahl-font-meta); font-style: italic; font-weight: var(--mahl-fw-meta); font-size: 13px;
  text-transform: uppercase; letter-spacing: .04em; color: var(--mahl-muted);
  background: linear-gradient(to bottom, transparent 50%, var(--mahl-field-bg, var(--mahl-white)) 50%); }
.mahl-field select, .mahl-field input { appearance: none; -webkit-appearance: none; width: 100%; min-height: 52px; margin: 0;
  padding: 10px 48px 6px 18px; border: 1px solid var(--mahl-line); border-radius: 0; background: var(--mahl-field-bg, var(--mahl-white));
  font-family: var(--mahl-font-display); font-style: italic; font-weight: var(--mahl-fw-strong); font-size: 20px; line-height: 1.1;
  text-transform: uppercase; color: var(--mahl-navy); cursor: pointer; }
.mahl-field::after { content: ""; position: absolute; right: 20px; top: 50%; width: 9px; height: 9px; margin-top: -6px;
  border-right: 2px solid var(--mahl-navy); border-bottom: 2px solid var(--mahl-navy); transform: rotate(45deg); pointer-events: none; }
.mahl-field select:hover, .mahl-field input:hover { border-color: var(--mahl-muted); }
.mahl-field select:focus, .mahl-field input:focus { outline: none; border-color: var(--mahl-navy); box-shadow: inset 0 0 0 1px var(--mahl-navy); }
.mahl-field select:focus-visible, .mahl-field input:focus-visible { outline: 2px solid var(--mahl-red); outline-offset: 2px; }
/* textové pole (hľadanie): bez šípky, bežné písmo */
.mahl-field--text::after { display: none; }
/* vyššia špecifickosť – prebije štýly formulárov témy (Blocksy) */
.mahl-field input[type] { height: auto; background: var(--mahl-field-bg, var(--mahl-white)); border: 1px solid var(--mahl-line); box-shadow: none; }
.mahl-field--text input { padding-right: 18px; font-family: var(--mahl-font-body); font-style: normal; font-size: 17px; text-transform: none; cursor: text; }
/* tlačidlo „Zobraziť" len bez JavaScriptu; formulár s textovým poľom (hľadanie) si ho nechá */
.mahl-js .js-mahl-autosubmit:not(.has-text) .mahl-field-submit { display: none; }
@media (max-width: 679px) {
  .mahl-field { min-width: 0; }
  .mahl-field select { padding-right: 40px; padding-left: 14px; font-size: 17px; }
  .mahl-field::after { right: 16px; }
}
