/* Rozbaľovacie menu v hlavičke.
   Čisté CSS: ponuku otvára :hover myšou a :focus-within klávesnicou aj
   dotykom. Skript tu byť nesmie - CSP webu je default-src 'self' bez
   'unsafe-inline' a vložený <script> prehliadač ticho zahodí.
   Súbor je spoločný pre úvodnú stránku, formulár, stiahnutie aj podstránky,
   preto sú farby zapísané aj s náhradou pre stránky bez premenných. */

.menu { display:flex; flex-wrap:wrap; align-items:center; gap:2px;
        margin:0 auto 0 18px; font-size:15px; }
.menu .skupina { position:relative; }
.menu button, .menu .polozka {
  font:inherit; color:#33414f; background:none; border:0; cursor:pointer;
  padding:8px 10px; border-radius:6px; text-decoration:none; display:inline-block; }
.menu button::after { content:"▾"; margin-left:5px; font-size:11px; color:#8a97a4; }
.menu button:hover, .menu .polozka:hover,
.menu .skupina:hover button, .menu .skupina:focus-within button {
  background:var(--alt,#f4f7fa); color:var(--pri,#0b3f6e); }
.menu .polozka:focus-visible, .menu button:focus-visible,
.menu .rozbal a:focus-visible { outline:2px solid var(--pri,#0b3f6e); outline-offset:1px; }

.menu .rozbal {
  display:none; position:absolute; left:0; top:100%; z-index:30; min-width:212px;
  background:#fff; border:1px solid var(--linka,#dde4ec); border-radius:8px;
  box-shadow:0 8px 24px rgba(11,32,51,.12); padding:6px; }
.menu .skupina:hover .rozbal, .menu .skupina:focus-within .rozbal { display:block; }
.menu .rozbal a { display:block; padding:8px 10px; border-radius:5px; color:#33414f;
                  text-decoration:none; white-space:nowrap; }
.menu .rozbal a:hover { background:var(--alt,#f4f7fa); color:var(--pri,#0b3f6e); }

/* Na úzkej obrazovke ide menu na vlastný riadok pod značku a prepínač jazykov.
   Ponuka zostáva rozbaľovacia - dotyk na <button> ho zaostrí a :focus-within
   ju otvorí, takže netreba skript ani jedenásť odkazov pod sebou. */
@media (max-width:880px) {
  .hlavicka { flex-wrap:wrap; }
  .menu { order:3; width:100%; margin:4px 0 0; }
}