/* Navigace varianta A (CDE „Útulnosti — hlavní navigace“, soubor „Hlavní navigace - redesign“, 1a).
   Obsah výhradně z kategorií administrace. Název = odkaz, šipka = samostatné tlačítko. Větev se 3. úrovní otevírá
   mega panel přes celou šířku (všechny skupiny najednou), ostatní větve kompaktní panel pod položkou.
   Aktivní větev má trvalou linku (35 %), otevřená položka plnou. */
.ut-navigation { display: flex; flex: 1 1 auto; min-width: 0; padding-left: 14px; border-left: 1px solid var(--ut-color-line); }
.ut-navigation__list { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ut-navigation__item { position: relative; display: flex; }
.ut-navigation__item--mega { position: static; }
.ut-navigation__row { position: relative; display: flex; align-items: center; }
.ut-navigation__link { display: flex; min-height: 44px; align-items: center; padding: 0 10px; color: var(--ut-color-ink); font-size: 16px; font-weight: var(--ut-font-weight-medium); line-height: normal; white-space: nowrap; text-decoration: none; transition: color .15s ease; }
.ut-navigation__item--mega .ut-navigation__link, .ut-navigation__item--drop .ut-navigation__link { padding-right: 2px; }
.ut-navigation__link:hover, .ut-navigation__item.is-open .ut-navigation__link, .ut-navigation__item.is-current .ut-navigation__link { color: var(--ut-color-clay); }
.ut-navigation__toggle { display: grid; width: 30px; height: 44px; place-items: center; margin-right: 4px; padding: 0; border: 0; border-radius: 6px; background: transparent; cursor: pointer; transition: background .15s ease; }
.ut-navigation__toggle:hover { background: #f3eadd; }
.ut-navigation__caret { display: block; width: 10px; height: 10px; fill: none; stroke: #8f7a66; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; }
.ut-navigation__item.is-open .ut-navigation__caret { transform: rotate(180deg); }
/* Linka sedí na spodní hraně hlavičky (padding 12px + 1px border). */
.ut-navigation__bar { position: absolute; right: 10px; bottom: -13px; left: 10px; height: 2px; border-radius: 2px; background: var(--ut-color-clay); opacity: 0; pointer-events: none; transition: opacity .15s ease; }
.ut-navigation__item.is-current .ut-navigation__bar { opacity: .35; }
.ut-navigation__item.is-open .ut-navigation__bar { opacity: 1; }

.ut-nav-panel[hidden] { display: none; }
.ut-nav-panel--mega { position: absolute; z-index: var(--ut-z-menu); top: 100%; right: 0; left: 0; border-top: 1px solid var(--ut-color-line); border-bottom: 1px solid var(--ut-color-line); background: var(--ut-color-surface); box-shadow: 0 24px 40px -30px rgb(60 45 30 / 45%); animation: ut-nav-drop .16s ease-out; }
/* 257px = začátek první položky navigace (20 + logo 180 + 18 + 14 + 1 + 14 + 10). */
.ut-nav-panel__inner { box-sizing: border-box; display: flex; flex-wrap: wrap; max-width: 85rem; gap: 28px 72px; margin: 0 auto; padding: 26px 20px 30px 257px; }
.ut-nav-panel__group { display: flex; min-width: 190px; flex-direction: column; }
.ut-nav-panel__heading { display: flex; min-height: 40px; align-items: center; margin-bottom: 6px; padding-bottom: 4px; border-bottom: 1px solid #efe6da; color: var(--ut-color-ink); font-size: 17px; font-weight: 600; line-height: normal; text-decoration: none; transition: color .15s ease; }
.ut-nav-panel__heading::after { content: "→" / ""; margin-left: 8px; color: var(--ut-color-clay); font-weight: var(--ut-font-weight-regular); transition: transform .15s ease; }
.ut-nav-panel__heading:hover::after { transform: translateX(3px); }
.ut-nav-panel__links { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.ut-nav-panel__links a { display: flex; min-height: 38px; align-items: center; color: #4a4239; font-size: 16px; line-height: normal; text-decoration: none; transition: color .15s ease; }
.ut-nav-panel__heading:hover, .ut-nav-panel__links a:hover, .ut-nav-panel__heading[aria-current], .ut-nav-panel__links a[aria-current] { color: var(--ut-color-clay); }
.ut-nav-panel--drop { position: absolute; z-index: var(--ut-z-menu); top: calc(100% + 13px); left: -6px; box-sizing: border-box; min-width: 250px; padding: 8px; border: 1px solid var(--ut-color-line); border-top: 0; border-radius: 0 0 12px 12px; background: var(--ut-color-surface); box-shadow: 0 24px 40px -26px rgb(60 45 30 / 45%); animation: ut-nav-drop .16s ease-out; }
.ut-nav-panel__list { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ut-nav-panel__item { display: flex; min-height: 44px; align-items: center; padding: 0 14px; border-radius: 8px; color: var(--ut-color-ink); font-size: 16.5px; line-height: normal; text-decoration: none; transition: background .15s ease; }
.ut-nav-panel__item:hover { background: #f3eadd; color: var(--ut-color-ink); }
.ut-nav-panel__item[aria-current] { color: var(--ut-color-clay); }
/* Ztmavení stránky pod otevřeným panelem (výchozí chování varianty A); klik zavře menu. */
.ut-nav-scrim { position: fixed; z-index: calc(var(--ut-z-header) - 1); inset: 0; background: rgb(44 39 34 / 14%); animation: ut-fade-in .16s ease-out; }
.ut-nav-scrim[hidden] { display: none; }
@keyframes ut-nav-drop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@keyframes ut-fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .ut-nav-panel--mega, .ut-nav-panel--drop, .ut-nav-scrim { animation: none; }
  .ut-navigation__link, .ut-navigation__toggle, .ut-navigation__caret, .ut-navigation__bar, .ut-nav-panel__item, .ut-nav-panel__heading::after { transition: none; }
}
/* CDE breakpoint: below 1060px the drawer replaces the desktop navigation. */
@media (max-width: 66.1875rem) { .ut-navigation, .ut-nav-panel, .ut-nav-scrim { display: none !important; } }

/* Functional fallback only: use the existing drawer if real category labels wrap out of the strip. */
.ut-header.ut-navigation-overflow .ut-navigation { display: none; }
.ut-header.ut-navigation-overflow .ut-header__menu { display: flex; }
.ut-header.ut-navigation-overflow ~ .ut-drawer { display: flex; }
.ut-header.ut-navigation-overflow ~ .ut-drawer-overlay { display: block; }