/* ============================================================
   SMIK - nový vzhled hlavičky (vodorovná lišta místo levého sloupce)
   Připojuje se jen na stránky, které už jsou převedené.
   Staré stránky tenhle soubor nelinkují, takže je nemůže ovlivnit.
   ============================================================ */

#hlavicka {
  border-bottom: 2px solid #FF6666;
  padding: 8px 0 10px 0;
  margin-bottom: 18px;
}

#hlavicka a.logo { display: inline-block; vertical-align: middle; margin: 0 22px 4px 0; }
#hlavicka a.logo img { display: block; width: 120px; height: auto; border: 0; }

#hlavicka .menu { display: inline; }

#hlavicka .menu a,
#hlavicka .menu strong {
  display: inline-block;
  vertical-align: middle;
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 1;
  text-decoration: none;
  color: #000;
  border: 2px solid #FF6666;
  background: #FFF2F2;
  padding: 7px 14px;
  margin: 0 5px 4px 0;
  white-space: nowrap;
}

#hlavicka .menu a:hover { background: #FFD9D9; }

/* položka odpovídající zobrazené stránce */
#hlavicka .menu strong { background: #FF6666; color: #000000; font-weight: normal; }

#obsah { }

/* ---- velikost písma obsahu ----
   Dřív: úvodní stránka 14 px vlastním blokem, ostatní 8 pt (asi 10,7 px) ze styles.css.
   Teď jednotně 14 px na všech převedených stránkách.
   Ověřeno: tabulka výsledků naroste z 606 na 710 px, historie z 579 na 742 px,
   obojí se na počítači vejde (dostupných je asi 970 px). */
#obsah, #obsah p, #obsah li, #obsah td, #obsah th,
#obsah em, #obsah b, #obsah strong, #obsah big { font-size: 14px; }

/* ---- široké tabulky na mobilu ----
   Bez tohohle si mobil roztáhne celou stránku podle nejširší tabulky
   a všechno zmenší. Takhle se posouvá jen tabulka, stránka zůstane v šířce displeje. */
@media (max-width: 700px) {
  #obsah table { display: block; overflow-x: auto; max-width: 100%; }
}

/* ---- hamburger menu na mobilu, bez JavaScriptu ----
   Rozbalování obstarává skryté zaškrtávací políčko: klepnutí na "Menu"
   ho zaškrtne a CSS pak menu zobrazí. Na počítači se nic z toho neukazuje. */
#hlavicka .prepinac { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
#hlavicka .hamburger { display: none; }

@media (max-width: 700px) {
  #hlavicka { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
  #hlavicka a.logo { margin: 0; }

  #hlavicka .hamburger {
    display: inline-block;
    cursor: pointer;
    font-family: Verdana, Arial, sans-serif;
    font-size: 15px;
    line-height: 1;
    border: 2px solid #FF6666;
    background: #FFF2F2;
    padding: 9px 14px;
    user-select: none;
    -webkit-user-select: none;
  }
  #hlavicka .prepinac:checked + .hamburger { background: #FF6666; color: #000000; }
  #hlavicka .prepinac:focus-visible + .hamburger { outline: 2px solid #000; outline-offset: 2px; }

  #hlavicka .menu { display: none; flex-basis: 100%; margin-top: 10px; }
  #hlavicka .prepinac:checked ~ .menu { display: block; }

  #hlavicka .menu a,
  #hlavicka .menu strong {
    display: block;
    margin: 0 0 4px 0;
    padding: 12px 14px;
    font-size: 15px;
    text-align: left;
  }
}

/* ---- obrázky a videa nesmí být širší než displej ----
   Starší stránky mají pevné šířky (banner 468 px, YouTube 560–640 px). */
#obsah img { max-width: 100%; height: auto; }
#obsah iframe { max-width: 100%; height: auto; aspect-ratio: 16 / 9; }

/* ---- šířka stránky na počítači ----
   Všechny stránky mají stejně široký sloupec, aby hlavička a logo
   neskákaly při přechodu mezi stránkami.
   860 px: tabulka historie potřebuje bez zalamování asi 760 px,
   text vychází zhruba na 113 znaků na řádek. */
#hlavicka, #obsah { max-width: 860px; margin-left: auto; margin-right: auto; }

/* Na výsledcích a historii se tabulky roztáhnou na celou šířku sloupce.
   Na mobilu zůstávají zhuštěné s posouváním. */
body.siroka #obsah table:has(th) { width: 100%; }

/* ---- seznam novinek (úvodní stránka a archiv) ----
   Bez odrážek, datum tučně a odsazené mezerou místo tří  . */
#obsah ul.novinky { list-style: none; padding-left: 0; margin-left: 0; }
#obsah ul.novinky li { margin: 0 0 12px 0; }
#obsah ul.novinky em { font-style: normal; font-weight: bold; margin-right: 0.5em; }

/* ---- výrazné odkazy (archiv novinek, anglická verze) ----
   Vypadají jako položky menu, aby bylo jasné, že jsou klikací. */
#obsah p.dalsi { margin: 16px 0 0 0; }
#obsah a.tlacitko {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.3;
  color: #000;
  text-decoration: none;
  border: 2px solid #FF6666;
  background: #FFF2F2;
  padding: 9px 16px;
}
#obsah a.tlacitko:hover { background: #FFD9D9; }
#obsah a.tlacitko .jazyk {
  display: inline-block;
  background: #FF6666;
  color: #000000;
  font-size: 12px;
  line-height: 1;
  padding: 3px 6px;
  margin-right: 4px;
  vertical-align: 1px;
}

/* ---- úvodní stránka: rámeček letošního ročníku ---- */
#obsah .sezona { border: 2px solid #FF6666; background: #FFF2F2; padding: 12px 16px 14px; margin: 18px 0; text-align: center; }
#obsah .sezona h2 { margin: 0 0 4px; font-size: 22px; }
#obsah .sezona h2 a { color: navy; text-decoration: none; }
#obsah .sezona p { margin: 0; }
#obsah .sezona p.kdy { margin-bottom: 10px; }
#obsah .sezona p.odkazy { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 20px; font-size: 15px; }
#obsah .sezona p.odkazy a { white-space: nowrap; }

/* ---- úvodní stránka: text o SMIKu na mobilu zkrácený na 5 řádků ----
   Rozbalení bez JavaScriptu přes skryté zaškrtávací políčko. */
#obsah .uvod-prepinac { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
#obsah .uvod-vice { display: none; }
@media (max-width: 700px) {
  #obsah p.uvod { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; margin-bottom: 4px; }
  #obsah .uvod-prepinac:checked ~ p.uvod { display: block; -webkit-line-clamp: none; }
  #obsah .uvod-vice { display: inline-block; cursor: pointer; font-family: Verdana, Arial, sans-serif; font-size: 14px; color: #0000EE; text-decoration: underline; }
  #obsah .uvod-vice .mene { display: none; }
  #obsah .uvod-prepinac:checked ~ .uvod-vice .vice { display: none; }
  #obsah .uvod-prepinac:checked ~ .uvod-vice .mene { display: inline; }
  #obsah .uvod-prepinac:focus-visible ~ .uvod-vice { outline: 2px solid #000; outline-offset: 2px; }
}

/* ---- výsledky v bloku <pre> na počítači ----
   Nejširší výsledky (2025) mají 117 znaků, při 13 px by přesáhly sloupec 860 px.
   Na mobilu zůstává výchozí velikost, tam se blok stejně posouvá. */
@media (min-width: 701px) {
  #obsah pre { font-size: 12px; }
}