/* 3.9.2 — jednotná odezva odkazových karet v obsahu magazínu.
   Mění se pouze barva a neprostorový obrys. Rozměry, poloha, obrázky
   a čitelnost textu zůstávají stabilní. Menu, FAQ a obsah článku mají
   vlastní ovládání; tato pravidla do nich nezasahují. */

:root {
  --vnb-card-hover-line: #B9BEDF;
  --vnb-card-hover-ring: 0 0 0 1px rgba(59, 63, 216, .08);
  --vnb-link-hover-paper: #F7F8FD;
  --vnb-link-response: .16s ease;
}

/* Výslovný seznam komponent, nikoli plošné rušení transformací:
   např. svislé vycentrování šipky .sit__ar zůstává zachované. */
main :is(.card, .hcard, .fl, .rcard, .path, .sit__a,
  .series-nav__link, .kit__a, .gstep, .chapters__a,
  .series-index__link),
main :is(.card, .hcard, .fl, .rcard, .path, .sit__a,
  .series-nav__link, .kit__a, .gstep, .chapters__a,
  .series-index__link):is(:hover, :focus-within, :active) {
  transform: none;
  translate: none;
  scale: none;
  rotate: none;
  transition: border-color var(--vnb-link-response),
    background-color var(--vnb-link-response),
    box-shadow var(--vnb-link-response), color var(--vnb-link-response);
}

main :is(.hcard img, .card__im img, .fl__im img, .rcard__im img),
main :is(.hcard, .card, .fl, .rcard):is(:hover, :focus-within, :active) img {
  transform: none;
  translate: none;
  scale: none;
  rotate: none;
  transition: none;
}

main :is(.card, .fl, .rcard, .path, .sit__a, .series-nav__link, .hcard),
main :is(.card, .fl, .rcard, .path, .sit__a, .series-nav__link, .hcard):is(:hover, :focus-within) {
  box-shadow: none;
}

main :is(.card__t a, .fl__t a, .rcard__n a, .path__t, .sit__t) {
  transition: color var(--vnb-link-response);
}

/* Hero potřebuje obrys nad fotografií; samostatný ::before nezmění
   rozměry ani původní tmavý překryv a nebrání kliknutí na odkaz. */
main .hcard::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
  transition: box-shadow var(--vnb-link-response);
}

/* Řádky uvnitř panelů zůstávají na svém místě i při změně stavu. */
main .side li > a,
main .widget:not(.widget--dynamic) > ul:not(.facts) > li > a {
  border-radius: 8px;
  transform: none;
  translate: none;
  scale: none;
  transition: background-color var(--vnb-link-response), color var(--vnb-link-response);
}

@media (hover: hover) and (pointer: fine) {
  main :is(.card, .fl, .rcard, .path:not(.path--soon), .sit__a, .series-nav__link):hover {
    border-color: var(--vnb-card-hover-line);
    box-shadow: var(--vnb-card-hover-ring);
  }

  main .card:hover .card__t a,
  main .fl:hover .fl__t a,
  main .rcard:hover .rcard__n a,
  main .path:not(.path--soon):hover .path__t,
  main .sit__a:hover .sit__t {
    color: var(--brand-dk);
  }

  main .hcard:hover::before {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .48);
  }

  main :is(.kit__a, .gstep:not(.gstep--soon), .chapters__a,
    .series-nav__link, .series-index__link):hover,
  main .side li > a:hover,
  main .widget:not(.widget--dynamic) > ul:not(.facts) > li > a:hover {
    background-color: var(--vnb-link-hover-paper);
    color: var(--brand-dk);
    text-decoration: none;
  }

  /* Aktuální stránka zůstává rozeznatelná i pod kurzorem. */
  main .series-index__link[aria-current="page"]:hover {
    background-color: var(--brand-wk);
  }
}

/* Klávesnice: obrys celé karty je čitelný také u odkazů, jejichž
   klikací plocha je protažená přes kartu pomocí pseudo-elementu. */
main :is(.card, .fl, .rcard):has(:focus-visible),
main :is(.path:not(.path--soon), .sit__a, .series-nav__link):focus-visible {
  border-color: var(--brand);
  box-shadow: none;
  outline: 3px solid var(--brand);
  outline-offset: 3px;
}

main .hcard:has(:focus-visible) {
  outline: 3px solid var(--brand);
  outline-offset: 3px;
}

main .hcard:has(:focus-visible)::before {
  box-shadow: inset 0 0 0 2px #FFF;
}

main .card:has(:focus-visible) .card__t a,
main .fl:has(:focus-visible) .fl__t a,
main .rcard:has(:focus-visible) .rcard__n a {
  color: var(--brand-dk);
}

main :is(.kit__a, .gstep:not(.gstep--soon), .chapters__a,
  .series-index__link):focus-visible,
main .side li > a:focus-visible,
main .widget:not(.widget--dynamic) > ul:not(.facts) > li > a:focus-visible {
  background-color: var(--vnb-link-hover-paper);
  color: var(--brand-dk);
}

main .series-index__link[aria-current="page"]:focus-visible {
  background-color: var(--brand-wk);
}

/* Dotykový prohlížeč nesmí po klepnutí ponechat starší :hover
   ze základního CSS. Viditelný fokus klávesnice platí i na tabletu. */
@media (hover: none), (pointer: coarse) {
  main :is(.card, .fl, .rcard, .path, .sit__a, .series-nav__link):hover:not(:has(:focus-visible)):not(:focus-visible) {
    border-color: var(--line);
    box-shadow: none;
  }

  main .card:hover:not(:has(:focus-visible)) .card__t a,
  main .fl:hover:not(:has(:focus-visible)) .fl__t a,
  main .rcard:hover:not(:has(:focus-visible)) .rcard__n a {
    color: inherit;
  }

  main .hcard:hover { box-shadow: none; }
  main .rcard:hover .rcard__a { color: var(--brand); }
  main .sit__a:hover .sit__ar { color: var(--line-2); }
  main .kit__a:hover:not(:focus-visible),
  main .gstep:hover:not(:focus-visible),
  main .chapters__a:hover:not(:focus-visible),
  main .series-index__link:hover:not(:focus-visible) {
    background-color: transparent;
    color: inherit;
  }
  main .series-nav__link:hover:not(:focus-visible) { background-color: var(--card); color: inherit; }
  main .gstep:hover { border-top-color: var(--line-2); }
  main .gstep.is-done:hover { border-top-color: var(--ok); }
  main .series-index__link[aria-current="page"]:hover {
    background-color: var(--brand-wk);
    color: var(--brand-dk);
  }
  main .side li > a:hover:not(:focus-visible),
  main .widget:not(.widget--dynamic) > ul:not(.facts) > li > a:hover:not(:focus-visible) { color: inherit; }
}

@media (prefers-reduced-motion: reduce) {
  main :is(.card, .hcard, .fl, .rcard, .path, .sit__a, .series-nav__link,
    .kit__a, .gstep, .chapters__a, .series-index__link,
    .card__t a, .fl__t a, .rcard__n a, .path__t, .sit__t),
  main :is(.card, .hcard, .fl, .rcard, .path, .sit__a, .series-nav__link,
    .kit__a, .gstep, .chapters__a, .series-index__link):is(:hover, :focus-within, :active),
  main .hcard::before,
  main .side li > a,
  main .widget:not(.widget--dynamic) > ul:not(.facts) > li > a { transition: none; }
}

@media print {
  main .hcard::before { display: none; }
  main :is(.card, .hcard, .fl, .rcard, .path, .sit__a, .series-nav__link) {
    box-shadow: none;
    outline: none;
  }
}