/* Stavy správania z assets/js/ui.js: plynulý posun na kotvy, zámok scrollu, zvýraznenie, aktívna sekcia. [F2-Funkcie]
   Nič z toho sa neprejaví v pokojovom stave stránky (zásada 1 : 1). */

/* slovo so spojovníkom, ktoré sa nesmie zalomiť (napr. „e-mailovej“) */
.nw{white-space:nowrap}

/* ---------- posun na kotvy ---------- */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
main [id]{scroll-margin-top:1.5rem}
#top{scroll-margin-top:6rem}          /* úvod pod hlavičkou: skok na #top = začiatok stránky */
#kontakt{scroll-margin-top:6.5rem}    /* záverečná výzva nemá vlastný horný okraj ako ostatné sekcie */
main [tabindex="-1"]:focus{outline:none}  /* sekcia dostane fokus po skoku na kotvu; obrys okolo celej sekcie netreba */

/* ---------- zámok scrollu pri otvorenom menu / dialógu ---------- */
/* scrollbar-gutter drží miesto po posuvníku, takže sa šírka (a mierka --vw) pod panelom nezmení */
html.menu-open,html.dialog-open{overflow:hidden;scrollbar-gutter:stable}

/* ---------- aktívna sekcia v navigácii ---------- */
.nav__links a{transition:color .2s}
.nav__links a:hover,.nav__links a[aria-current]{color:var(--ink)}
.nav__links a[aria-current]{text-decoration:underline .125rem var(--or);text-underline-offset:.5rem}

/* ---------- zvýraznenie dlaždice po kliknutí na záložku automatizácie ---------- */
.is-highlight{outline:.25rem solid var(--or);outline-offset:.375rem}
.win.is-highlight{outline-color:var(--lime)}
@media (prefers-reduced-motion:no-preference){
  .is-highlight{animation:ui-hl 1.8s cubic-bezier(.2,.8,.2,1) both}
  .win.is-highlight{animation-name:ui-hl-lime}
}
@keyframes ui-hl{
  0%{outline-color:rgba(255,106,43,0);outline-offset:1rem}
  18%{outline-color:var(--or);outline-offset:.375rem}
  70%{outline-color:var(--or)}
  100%{outline-color:rgba(255,106,43,0)}
}
@keyframes ui-hl-lime{
  0%{outline-color:rgba(200,241,105,0);outline-offset:1rem}
  18%{outline-color:var(--lime);outline-offset:.375rem}
  70%{outline-color:var(--lime)}
  100%{outline-color:rgba(200,241,105,0)}
}
