/* Mobilní navigace po vzoru oveckarna.cz ve stylu Útulností: celoobrazovkový panel (na tabletu max. 480 px zprava),
   úrovně jako obrazovky s „Zpět“, řádky se šipkou otevírají podúroveň, název kategorie nahoře vede na výpis.
   Production keeps Escape, focus trap/return and scroll lock. */
.ut-drawer-overlay { position: fixed; z-index: var(--ut-z-drawer); inset: 0; background: rgb(44 39 34 / 40%); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
.ut-drawer-overlay.is-open { opacity: 1; visibility: visible; }
.ut-drawer { position: fixed; z-index: calc(var(--ut-z-drawer) + 1); inset: 0 0 0 auto; display: flex; width: 100%; max-width: 480px; flex-direction: column; background: var(--ut-color-canvas); box-shadow: 0 0 60px rgb(44 39 34 / 30%); transform: translateX(105%); visibility: hidden; transition: transform .24s cubic-bezier(.2, .7, .2, 1), visibility 0s linear .24s; }
.ut-drawer.is-open { transform: translateX(0); visibility: visible; transition: transform .24s cubic-bezier(.2, .7, .2, 1), visibility 0s; }
.ut-drawer__screens { position: relative; flex: 1; min-height: 0; overflow: hidden; }
.ut-drawer__screen { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--ut-color-canvas); }
.ut-drawer__screen[hidden] { display: none; }
.ut-drawer__screen.is-forward { animation: ut-drawer-forward .22s cubic-bezier(.2, .7, .2, 1); }
.ut-drawer__screen.is-back { animation: ut-drawer-back .22s cubic-bezier(.2, .7, .2, 1); }
.ut-drawer__head { display: flex; min-height: 64px; flex: none; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 10px 20px; border-bottom: 1px solid var(--ut-color-line); }
.ut-drawer__logo { display: flex; align-items: center; }
.ut-drawer__logo img { display: block; width: auto; height: 32px; object-fit: contain; }
.ut-drawer__back { display: inline-flex; min-height: 44px; align-items: center; gap: 10px; margin-left: -8px; padding: 0 12px 0 8px; border: 0; border-radius: 999px; background: transparent; color: var(--ut-color-ink); font: inherit; font-size: 15px; font-weight: var(--ut-font-weight-medium); letter-spacing: .06em; line-height: normal; text-transform: uppercase; cursor: pointer; }
.ut-drawer__back svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ut-drawer__close { display: grid; width: 44px; height: 44px; flex: none; place-items: center; padding: 0; border: 0; border-radius: 999px; background: var(--ut-color-sand); cursor: pointer; }
.ut-drawer__close svg { width: 14px; height: 14px; fill: none; stroke: var(--ut-color-ink); stroke-width: 1.8; stroke-linecap: round; }
.ut-drawer__scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding-bottom: 28px; }
.ut-drawer__search-wrap { padding: 16px 20px 6px; }
.ut-drawer__search { display: flex; box-sizing: border-box; width: 100%; min-height: 50px; align-items: center; justify-content: space-between; gap: 10px; padding: 0 6px 0 18px; border: 1px solid #d9ccba; border-radius: 999px; background: var(--ut-color-surface); color: #8a8074; font: inherit; font-size: 16px; line-height: normal; text-align: left; cursor: pointer; }
.ut-drawer__search svg { box-sizing: border-box; width: 38px; height: 38px; flex: none; padding: 10px; border-radius: 999px; background: var(--ut-color-ink); fill: none; stroke: var(--ut-color-canvas); stroke-width: 2; }
.ut-drawer__promo { padding: 14px 20px 14px; border-bottom: 1px solid #efe6da; }
.ut-drawer__sale { display: inline-flex; min-height: 40px; align-items: center; padding: 0 14px; border-radius: 6px; background: rgb(158 95 67 / 12%); color: var(--ut-color-clay); font-size: 16.5px; font-weight: 600; line-height: normal; text-decoration: none; }
.ut-drawer__sale[aria-current] { background: var(--ut-color-clay); color: var(--ut-color-surface); }
.ut-drawer__list { margin: 0; padding: 0; list-style: none; }
.ut-drawer__list li { border-bottom: 1px solid #efe6da; }
.ut-drawer__row { display: flex; box-sizing: border-box; width: 100%; min-height: 64px; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; border: 0; background: transparent; color: var(--ut-color-ink); font: inherit; font-size: 17.5px; font-weight: var(--ut-font-weight-medium); line-height: 1.3; text-align: left; text-decoration: none; cursor: pointer; transition: background .15s ease; }
.ut-drawer__row span { min-width: 0; overflow-wrap: anywhere; }
@media (hover: hover) { .ut-drawer__row:hover { background: #f3eadd; } .ut-drawer__back:hover { background: var(--ut-color-sand); } .ut-drawer__title:hover { color: var(--ut-color-clay); } }
.ut-drawer__row:active { background: #f3eadd; }
.ut-drawer__row--leaf { min-height: 56px; font-size: 17px; font-weight: var(--ut-font-weight-regular); }
.ut-drawer__row.is-current { color: var(--ut-color-clay); }
.ut-drawer__arrow { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ut-drawer__title { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 16px; margin: 16px 20px 8px; padding: 12px 18px; border-radius: 10px; background: var(--ut-color-sand); color: var(--ut-color-ink); font-family: var(--ut-font-display); font-size: 26px; font-weight: var(--ut-font-weight-regular); line-height: 1.15; text-decoration: none; }
.ut-drawer__title span { min-width: 0; overflow-wrap: anywhere; }
.ut-drawer__title svg { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--ut-color-clay); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ut-drawer__title[aria-current] { color: var(--ut-color-clay); }
.ut-drawer__utility { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; padding: 14px 20px 0; }
.ut-drawer__utility a { display: flex; min-height: 48px; align-items: center; color: #4a4239; font-size: 16.5px; line-height: normal; text-decoration: none; }
@keyframes ut-drawer-forward { from { transform: translateX(100%); } to { transform: none; } }
@keyframes ut-drawer-back { from { transform: translateX(-100%); } to { transform: none; } }
body.ut-drawer-open, html:has(body.ut-drawer-open) { overflow: hidden; }
@media (min-width: 66.25rem) { .ut-drawer, .ut-drawer-overlay { display: none; } }
@media (prefers-reduced-motion: reduce) { .ut-drawer, .ut-drawer-overlay, .ut-drawer__row { transition: none; } .ut-drawer__screen.is-forward, .ut-drawer__screen.is-back { animation: none; } }