/* ==========================================================================
   PragoSan — tenký doplněk k Tailwindu (base.css)
   Linkuje se AŽ ZA CDN. Jen to, co utility neumí vyjádřit:
   plynulý scroll, skrytí scrollbaru, mintová „vlnka" (brandová signatura),
   focus-visible stavy. Vše ostatní řeší Tailwind utility.
   ========================================================================== */

/* Plynulé scrollování na kotvy (menu → sekce), s ohledem na sticky hlavičku */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 72px; /* výška sticky hlavičky */
}

/* Skrytí scrollbaru u horizontálně scrollovatelných lišt
   (pilulky Kategorie, taby Produktu, filmový pás Přehled) */
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

/* --------------------------------------------------------------------------
   Brandová vlnka „Vltava" — 1:1 tvar z Figmy (komponenta „podtrzeni",
   viewBox 0 0 140 6, 10 vln). Používá se jako podtržení aktivních prvků.
   Dvě barevné varianty:
   - .wave-underline  → mint  #99c9be (aktivní kategorie / tab; dle briefu)
   - .nav-wave        → tmavá #3c3c3b (hover / aktivní položka nav; dle Figmy)
   -------------------------------------------------------------------------- */

/* Mintová vlnka pod aktivními kategoriemi a taby */
.wave-underline {
  position: relative;
}
.wave-underline::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -7px;
  height: 6px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='6' viewBox='0 0 140 6' fill='none'><path d='M140 4.5C136.659 4.5 134.913 3.6 133.378 2.79C132.023 2.1 130.849 1.5 128.351 1.5C125.853 1.5 124.679 2.1 123.324 2.79C121.789 3.57 120.043 4.47 116.702 4.5C113.361 4.5 111.615 3.63 110.049 2.85C108.695 2.16 107.28 1.59 105.023 1.59C102.765 1.59 101.35 2.16 99.9957 2.85C98.4605 3.63 96.6846 4.5 93.3434 4.5C90.0021 4.5 88.2563 3.6 86.7211 2.79C85.3666 2.1 84.1926 1.5 81.6943 1.5C79.1959 1.5 78.0219 2.1 76.6674 2.79C75.1322 3.57 73.3864 4.47 70.0451 4.5C66.7039 4.5 64.9581 3.63 63.3928 2.85C62.0383 2.16 60.6235 1.59 58.3659 1.59C56.1084 1.59 54.6936 2.16 53.3391 2.85C51.8039 3.63 50.028 4.5 46.6867 4.5C43.3455 4.5 41.5997 3.6 40.0645 2.79C38.71 2.1 37.536 1.5 35.0376 1.5C32.5392 1.5 31.3653 2.1 30.0107 2.79C28.4756 3.57 26.7297 4.47 23.3885 4.5C20.0473 4.5 18.3014 3.63 16.7362 2.85C15.3816 2.16 13.9669 1.59 11.7093 1.59C9.45173 1.59 8.03698 2.16 6.68243 2.85C5.08708 3.63 3.34122 4.5 0 4.5' stroke='%2399c9be' stroke-width='3' stroke-miterlimit='10'/></svg>") repeat-x center / 140px 6px;
}

/* Tmavá vlnka pod položkami hlavní navigace — jen na hover / aktivní */
.nav-wave {
  position: relative;
}
.nav-wave::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -9px;
  height: 6px;
  opacity: 0;
  transition: opacity .18s ease;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='6' viewBox='0 0 140 6' fill='none'><path d='M140 4.5C136.659 4.5 134.913 3.6 133.378 2.79C132.023 2.1 130.849 1.5 128.351 1.5C125.853 1.5 124.679 2.1 123.324 2.79C121.789 3.57 120.043 4.47 116.702 4.5C113.361 4.5 111.615 3.63 110.049 2.85C108.695 2.16 107.28 1.59 105.023 1.59C102.765 1.59 101.35 2.16 99.9957 2.85C98.4605 3.63 96.6846 4.5 93.3434 4.5C90.0021 4.5 88.2563 3.6 86.7211 2.79C85.3666 2.1 84.1926 1.5 81.6943 1.5C79.1959 1.5 78.0219 2.1 76.6674 2.79C75.1322 3.57 73.3864 4.47 70.0451 4.5C66.7039 4.5 64.9581 3.63 63.3928 2.85C62.0383 2.16 60.6235 1.59 58.3659 1.59C56.1084 1.59 54.6936 2.16 53.3391 2.85C51.8039 3.63 50.028 4.5 46.6867 4.5C43.3455 4.5 41.5997 3.6 40.0645 2.79C38.71 2.1 37.536 1.5 35.0376 1.5C32.5392 1.5 31.3653 2.1 30.0107 2.79C28.4756 3.57 26.7297 4.47 23.3885 4.5C20.0473 4.5 18.3014 3.63 16.7362 2.85C15.3816 2.16 13.9669 1.59 11.7093 1.59C9.45173 1.59 8.03698 2.16 6.68243 2.85C5.08708 3.63 3.34122 4.5 0 4.5' stroke='%233c3c3b' stroke-width='3' stroke-miterlimit='10'/></svg>") repeat-x center / 140px 6px;
}
.nav-wave:hover::after,
.nav-wave[aria-current="page"]::after {
  opacity: 1;
}

/* --------------------------------------------------------------------------
   Shrinking header — nahoře vyšší (víc prostoru kolem loga),
   po scrollu (.is-compact) se plynule zúží na kompaktní výšku.
   Vlnka (tab) je přilepená pod headerem (top-full) → drží se v obou stavech.
   -------------------------------------------------------------------------- */
.hdr-inner { height: 96px; transition: height .28s ease; }
.hdr-logo  { height: 60px; transition: height .28s ease; }
.is-compact .hdr-inner { height: 60px; }
.is-compact .hdr-logo  { height: 40px; }

/* Dělící vlna v sekci Produkt (přechod gradient → cobalt info pruh).
   Tvar 1:1 z Figma node 98:888, fill cobalt #648187. PEVNÉ MĚŘÍTKO:
   background-size 1440px → amplituda i vlnová délka konstantní (žádný stretch),
   repeat-x pokryje libovolnou šířku. Nad vlnou průsvitné → prosvítá gradient sekce. */
.produkt-wave {
  height: 24px;
  background-image: url("img/produkt-wave.svg");
  background-repeat: repeat-x;
  background-position: top left;
  background-size: 1440px 24px;
}

/* Přístupné focus stavy — viditelný prstenec pro klávesovou navigaci */
:focus-visible {
  outline: 2px solid #b2dcd8;
  outline-offset: 2px;
  border-radius: 2px;
}

/* Skrytí obsahu jen vizuálně (dostupné pro čtečky) */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}