/* ==========================================================================
   Shop Garage – e-shop modul PublicMC: výpis kategorie, karta, detail produktu.
   Všechny třídy mají prefix .esh- a vše je pod kořenem .esh, nic globálního.
   Barvy a písmo přebírá z webu klienta (šablona shopgarage.cz: --ink, --red,
   --paper, Manrope); kompozice detailu podle detailu produktu enfieldshop.cz.
   Globální pravidla webu (h1–h4 velikosti, p{margin:0}, a{color:inherit},
   form label{display:block}) se zde přebíjejí specifičtějšími selektory.
   ========================================================================== */

.esh {
    --esh-ink: var(--ink, #191a1c);
    --esh-night: var(--night, #111214);
    --esh-paper: var(--paper, #f4f1eb);
    --esh-white: #fff;
    --esh-red: var(--red, #c92d26);
    --esh-red-dark: #ad211c;
    --esh-muted: var(--muted, #625f59);
    --esh-line: var(--line, #dcd8d1);
    --esh-line-strong: #8a857d; /* hranice polí 3,66:1 na bílé (WCAG 1.4.11 ≥ 3:1) */
    --esh-foto: #f1eee8;
    --esh-green: #1d6b35;
    --esh-amber: #8a5300;
    --esh-yellow: #ffe15a;
    --esh-focus: #e26438;
    --esh-gutter: var(--gutter, clamp(20px, 4.167vw, 80px));
    --esh-nav: var(--nav, 80px);
    --esh-s: var(--fzd, 0px);
    --esh-ease: cubic-bezier(.2, .65, .25, 1);

    display: block;
    width: 100%;
    color: var(--esh-ink);
    background: var(--esh-white);
    font-family: Manrope, "Inter", Arial, Helvetica, sans-serif;
    font-size: calc(15px + 15 * var(--esh-s));
    line-height: 1.6;
    text-align: left;
}

.esh *,
.esh *::before,
.esh *::after {
    box-sizing: border-box;
}

.esh img {
    display: block;
    max-width: 100%;
    height: auto;
}

.esh button,
.esh input,
.esh select,
.esh textarea {
    font: inherit;
    color: inherit;
}

.esh :focus-visible {
    outline: 3px solid var(--esh-focus);
    outline-offset: 3px;
}

.esh .esh-sr {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.esh .esh-obal {
    width: 100%;
    max-width: 2080px;
    margin: 0 auto;
    padding: 0 var(--esh-gutter) calc(64px + 32 * var(--esh-s));
}

.esh.esh-detail .esh-obal {
    max-width: 1880px;
}

/* ---------- Drobečková navigace (jako .re-breadcrumb webu) ---------- */
.esh .esh-drobky {
    padding: 22px 0 0;
    color: var(--esh-muted);
    font-size: calc(12px + 12 * var(--esh-s));
    line-height: 1.4;
}

.esh .esh-drobky ol {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-drobky li {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.esh .esh-drobky li + li::before {
    content: "/";
    margin: 0 9px;
    color: var(--esh-line-strong);
}

.esh .esh-drobky a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (hover: hover) {
    .esh .esh-drobky a:hover {
        color: var(--esh-red);
    }
}

.esh .esh-drobky [aria-current="page"] {
    overflow: hidden;
    max-width: 60vw;
    color: var(--esh-ink);
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---------- Společné prvky ---------- */
.esh .esh-nadtitulek {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
    color: var(--esh-red);
    font-size: calc(11px + 11 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .18em;
    line-height: 1.3;
    text-transform: uppercase;
}

.esh .esh-nadtitulek::before {
    content: "";
    width: 22px;
    height: 2px;
    background: var(--esh-red);
}

.esh .esh-nadtitulek--stred {
    justify-content: center;
}

.esh .esh-tlacitko {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 48px;
    padding: 12px 22px;
    border: 1px solid transparent;
    border-radius: 4px;
    color: #fff;
    background: var(--esh-red);
    font-size: calc(13px + 13 * var(--esh-s));
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s var(--esh-ease), color .18s var(--esh-ease), border-color .18s var(--esh-ease);
}

@media (hover: hover) {
    .esh .esh-tlacitko:hover {
        color: #fff;
        background: var(--esh-red-dark);
    }
}

.esh .esh-tlacitko--cerne {
    background: var(--esh-night);
}

@media (hover: hover) {
    .esh .esh-tlacitko--cerne:hover {
        background: #343438;
    }
}

.esh .esh-tlacitko--obrys {
    border-color: var(--esh-line-strong);
    color: var(--esh-ink);
    background: transparent;
}

@media (hover: hover) {
    .esh .esh-tlacitko--obrys:hover {
        color: var(--esh-ink);
        background: #e8e4dc;
    }
}

.esh .esh-pole {
    display: block;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid var(--esh-line-strong);
    border-radius: 4px;
    color: var(--esh-ink);
    background: #fff;
    font-size: 16px; /* na mobilu < 16 px by iOS při fokusu zvětšoval stránku */
    line-height: 1.3;
    box-shadow: none;
    appearance: auto;
}

@media (hover: hover) {
    .esh .esh-pole:hover {
        border-color: var(--esh-ink);
    }
}

.esh .esh-pole:focus-visible {
    border-color: var(--esh-ink);
    outline-offset: 1px;
}

.esh .esh-pole::placeholder {
    color: #6f6b64; /* placeholder 5,3:1 na bílé (WCAG 1.4.3) */
}

.esh .esh-pole--select {
    width: auto;
    min-width: 200px;
    padding-right: 34px;
    cursor: pointer;
}

.esh label.esh-pole__popisek,
.esh .esh-pole__popisek {
    display: block;
    margin: 0 0 5px;
    color: var(--esh-muted);
    font-size: calc(12px + 12 * var(--esh-s));
    font-weight: 700;
    letter-spacing: .06em;
    line-height: 1.3;
    text-transform: uppercase;
}

/* Ceny */
.esh .esh-cena {
    color: var(--esh-ink);
    font-weight: 800;
    white-space: nowrap;
}

.esh .esh-cena--akcni {
    color: var(--esh-red);
}

.esh .esh-cena-puvodni {
    color: var(--esh-muted);
    font-weight: 500;
    text-decoration: line-through;
    white-space: nowrap;
}

/* Dostupnost s barevnou tečkou */
.esh .esh-dostupnost {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--esh-muted);
    font-size: calc(13px + 13 * var(--esh-s));
    font-weight: 700;
    line-height: 1.35;
}

.esh .esh-dostupnost::before {
    content: "";
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #9a968f;
}

.esh .esh-dostupnost--skladem {
    color: var(--esh-green);
}

.esh .esh-dostupnost--skladem::before {
    background: #2e9a4f;
}

.esh .esh-dostupnost--do_3_dnu {
    color: var(--esh-amber);
}

.esh .esh-dostupnost--do_3_dnu::before {
    background: #e0a019;
}

.esh .esh-dostupnost--na_objednavku::before {
    background: #7a7670;
}

.esh .esh-dostupnost--nedostupne::before {
    background: var(--esh-red);
}

/* Štítky příznaků (novinka, akce, sleva, tip, doprodej, procenta slevy) */
.esh .esh-stitky {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-stitek {
    display: inline-block;
    margin: 0;
    padding: 5px 8px;
    border: 1px solid transparent;
    color: #fff;
    background: var(--esh-night);
    font-size: calc(10px + 10 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

.esh .esh-stitek--akce,
.esh .esh-stitek--sleva,
.esh .esh-stitek--procenta {
    background: var(--esh-red);
}

.esh .esh-stitek--tip {
    border-color: var(--esh-ink);
    color: var(--esh-ink);
    background: #fff;
}

.esh .esh-stitek--doprodej {
    color: var(--esh-ink);
    background: var(--esh-yellow);
}

/* Obsah z editoru (popis kategorie, popis produktu) */
.esh .esh-obsah {
    max-width: 78ch;
    color: #34332f;
    line-height: 1.7;
}

.esh .esh-obsah > * {
    margin-top: 0;
    margin-bottom: 0;
}

.esh .esh-obsah > * + * {
    margin-top: 14px;
}

.esh .esh-obsah h2,
.esh .esh-obsah h3,
.esh .esh-obsah h4 {
    margin-top: 28px;
    color: var(--esh-ink);
    font-size: calc(20px + 20 * var(--esh-s));
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.25;
}

.esh .esh-obsah h3,
.esh .esh-obsah h4 {
    font-size: calc(17px + 17 * var(--esh-s));
}

.esh .esh-obsah ul,
.esh .esh-obsah ol {
    padding-left: 1.3em;
}

.esh .esh-obsah ul {
    list-style: disc;
}

.esh .esh-obsah ol {
    list-style: decimal;
}

.esh .esh-obsah li + li {
    margin-top: 5px;
}

.esh .esh-obsah a {
    color: var(--esh-red);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.esh .esh-obsah {
    overflow-wrap: break-word;
}

.esh .esh-obsah img {
    height: auto;
}

.esh .esh-obsah iframe,
.esh .esh-obsah video {
    max-width: 100%;
}

/* Tabulky z editoru: na úzkém displeji se posouvají uvnitř, stránka nikdy do strany */
.esh .esh-obsah table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    font-size: .95em;
}

.esh .esh-obsah th,
.esh .esh-obsah td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--esh-line);
    text-align: left;
    vertical-align: top;
}

.esh .esh-obsah strong,
.esh .esh-obsah b {
    color: var(--esh-ink);
    font-weight: 800;
}

/* ==========================================================================
   Karta produktu (výpis i související)
   ========================================================================== */
.esh .esh-mrizka {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-mrizka__polozka {
    min-width: 0;
    margin: 0;
    padding: 0;
}

.esh .esh-karta {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
}

.esh .esh-karta__foto {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    background: var(--esh-foto);
}

.esh .esh-karta__foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .55s var(--esh-ease);
}

@media (hover: hover) {
    .esh .esh-karta:hover .esh-karta__foto img {
        transform: scale(1.045);
    }
}

.esh .esh-karta__bezfoto {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--esh-muted);
    font-size: 13px;
}

.esh .esh-karta__foto .esh-stitky {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    z-index: 2;
    pointer-events: none;
}

.esh .esh-karta__foto .esh-stitek--procenta {
    margin-left: auto;
}

.esh .esh-karta__zobrazit {
    position: absolute;
    right: 12px;
    bottom: 12px;
    left: 12px;
    z-index: 2;
    padding: 12px 14px;
    color: #fff;
    background: rgba(17, 18, 20, .94);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .2s var(--esh-ease), transform .2s var(--esh-ease);
    pointer-events: none;
}

.esh .esh-karta:focus-within .esh-karta__zobrazit {
    opacity: 1;
    transform: translateY(0);
}

/* R-034: efekty po najetí jen tam, kde zařízení umí najet (na dotyku by se „přilepily“) */
@media (hover: hover) {
    .esh .esh-karta:hover .esh-karta__zobrazit {
        opacity: 1;
        transform: translateY(0);
    }
}

.esh .esh-karta__info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 6px;
    padding: 13px 2px 0;
}

.esh .esh-karta__vyrobce {
    margin: 0;
    color: var(--esh-muted);
    font-size: calc(10.5px + 10.5 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.esh .esh-karta__nazev,
.esh h2.esh-karta__nazev,
.esh h3.esh-karta__nazev {
    margin: 0;
    color: var(--esh-ink);
    font-family: inherit;
    font-size: calc(13.5px + 13.5 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 1.35;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.esh .esh-karta__odkaz {
    color: inherit;
    text-decoration: none;
}

.esh .esh-karta__odkaz::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
}

.esh .esh-karta__odkaz:focus-visible {
    outline: none;
}

.esh .esh-karta__odkaz:focus-visible::after {
    outline: 3px solid var(--esh-focus);
    outline-offset: 4px;
}

@media (hover: hover) {
    .esh .esh-karta:hover .esh-karta__odkaz {
        color: var(--esh-red);
    }
}

.esh .esh-karta__cena {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    margin: 2px 0 0;
    font-size: calc(16px + 16 * var(--esh-s));
    line-height: 1.3;
}

.esh .esh-karta__cena .esh-cena-puvodni {
    font-size: calc(13px + 13 * var(--esh-s));
}

.esh .esh-karta .esh-dostupnost {
    margin-top: auto;
    padding-top: 2px;
    font-size: calc(12px + 12 * var(--esh-s));
}

.esh .esh-karta--nedostupne .esh-karta__foto img {
    opacity: .6;
}

/* ==========================================================================
   Výpis kategorie
   ========================================================================== */
.esh .esh-katalog__hlavicka {
    padding: 34px 0 26px;
}

.esh .esh-katalog__titulek,
.esh h1.esh-katalog__titulek {
    margin: 0;
    color: var(--esh-ink);
    font-family: inherit;
    font-size: clamp(34px, 4vw, 80px);
    font-weight: 700;
    letter-spacing: -.045em;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.esh .esh-katalog__popis {
    margin-top: 18px;
    color: var(--esh-muted);
    font-size: calc(16px + 16 * var(--esh-s));
}

.esh .esh-katalog__rozlozeni {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.esh .esh-katalog__bok,
.esh .esh-katalog__obsah {
    min-width: 0;
}

/* Panel filtrů – na mobilu sbalitelný (details), na desktopu stále otevřený */
.esh .esh-filtry {
    border: 1px solid var(--esh-line);
    border-radius: 4px;
    background: #fff;
}

.esh .esh-filtry__prepinac {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    padding: 12px 16px;
    font-size: calc(14px + 14 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    list-style: none;
    cursor: pointer;
}

.esh .esh-filtry__prepinac::-webkit-details-marker {
    display: none;
}

.esh .esh-filtry__prepinac::after {
    content: "+";
    margin-left: auto;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
}

.esh .esh-filtry[open] > .esh-filtry__prepinac::after {
    content: "−";
}

.esh .esh-filtry__znacka {
    padding: 3px 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--esh-red);
    font-size: 10px;
    letter-spacing: .08em;
}

.esh .esh-strom,
.esh .esh-filtry__form {
    padding: 4px 16px 18px;
}

.esh .esh-filtry[open] > .esh-strom {
    border-top: 1px solid var(--esh-line);
}

.esh .esh-strom + .esh-filtry__form {
    border-top: 1px solid var(--esh-line);
}

.esh .esh-bok__nadpis,
.esh h2.esh-bok__nadpis {
    margin: 16px 0 10px;
    color: var(--esh-ink);
    font-family: inherit;
    font-size: calc(12px + 12 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.esh .esh-strom__seznam {
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-strom__seznam .esh-strom__seznam {
    margin: 2px 0 6px 12px;
    padding-left: 10px;
    border-left: 1px solid var(--esh-line);
}

.esh .esh-strom__polozka {
    margin: 0;
    padding: 0;
}

.esh .esh-strom__odkaz {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 38px;
    padding: 7px 10px;
    border-radius: 4px;
    color: var(--esh-ink);
    font-size: calc(14.5px + 14.5 * var(--esh-s));
    line-height: 1.3;
    text-decoration: none;
}

@media (hover: hover) {
    .esh .esh-strom__odkaz:hover {
        color: var(--esh-red);
        background: var(--esh-paper);
    }
}

.esh .esh-strom__polozka.is-aktivni > .esh-strom__odkaz {
    color: var(--esh-ink);
    background: var(--esh-paper);
    box-shadow: inset 3px 0 0 var(--esh-red);
    font-weight: 800;
}

.esh .esh-strom__pocet {
    flex: 0 0 auto;
    min-width: 28px;
    padding: 1px 7px;
    border-radius: 999px;
    color: var(--esh-muted);
    background: var(--esh-paper);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.esh .esh-strom__polozka.is-aktivni > .esh-strom__odkaz .esh-strom__pocet {
    background: #fff;
}

.esh .esh-filtr {
    min-width: 0;
    margin: 0;
    padding: 12px 0 14px;
    border: 0;
    border-bottom: 1px solid var(--esh-line);
}

.esh .esh-filtr:last-of-type {
    border-bottom: 0;
}

.esh .esh-filtr__nadpis {
    display: block;
    margin: 0 0 8px;
    padding: 0;
    color: var(--esh-ink);
    font-size: calc(13px + 13 * var(--esh-s));
    font-weight: 800;
    line-height: 1.3;
}

.esh label.esh-volba,
.esh .esh-volba {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    margin: 0;
    padding: 4px 0;
    color: var(--esh-ink);
    font-size: calc(14.5px + 14.5 * var(--esh-s));
    line-height: 1.3;
    cursor: pointer;
}

.esh .esh-volba__pole {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--esh-red);
    cursor: pointer;
}

.esh .esh-volba__text {
    flex: 1 1 auto;
    min-width: 0;
}

@media (hover: hover) {
    .esh .esh-volba:hover .esh-volba__text {
        color: var(--esh-red);
    }
}

.esh .esh-volba__pocet {
    color: var(--esh-muted);
    font-size: 12px;
}

.esh .esh-cenarozsah {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 8px;
    align-items: end;
}

.esh .esh-cenarozsah__pomlcka {
    padding-bottom: 10px;
    color: var(--esh-muted);
}

.esh .esh-filtr__napoveda {
    margin: 8px 0 0;
    color: var(--esh-muted);
    font-size: 12px;
}

.esh .esh-filtry__akce {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    padding-top: 14px;
}

.esh .esh-filtry__akce .esh-tlacitko {
    flex: 1 1 auto;
}

.esh .esh-odkaz-zrusit {
    color: var(--esh-ink);
    font-size: 13px;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (hover: hover) {
    .esh .esh-odkaz-zrusit:hover {
        color: var(--esh-red);
    }
}

/* Lišta nad mřížkou: počet a řazení */
.esh .esh-lista {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px 20px;
    margin: 0 0 22px;
    padding: 0 0 16px;
    border-bottom: 1px solid var(--esh-line);
}

.esh .esh-lista__pocet {
    margin: 0;
    padding-bottom: 10px;
    color: var(--esh-muted);
    font-size: calc(14px + 14 * var(--esh-s));
}

.esh .esh-lista__pocet strong {
    color: var(--esh-ink);
}

.esh .esh-lista__razeni {
    display: flex;
    align-items: center;
    gap: 10px;
}

.esh .esh-lista__razeni .esh-pole__popisek {
    margin: 0;
}

.esh .esh-prazdne {
    padding: 48px 24px;
    border: 1px dashed var(--esh-line-strong);
    border-radius: 4px;
    background: var(--esh-paper);
    text-align: center;
}

.esh .esh-prazdne__text {
    margin: 0 0 16px;
    font-size: calc(17px + 17 * var(--esh-s));
    font-weight: 700;
}

/* Stránkování */
.esh .esh-strankovani {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 14px;
    margin: 44px 0 0;
    padding-top: 26px;
    border-top: 1px solid var(--esh-line);
}

.esh .esh-strankovani__cisla {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-strankovani__cisla li {
    margin: 0;
}

.esh .esh-strankovani__cislo,
.esh .esh-strankovani__vypustka {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 10px;
    border: 1px solid var(--esh-line);
    border-radius: 4px;
    color: var(--esh-ink);
    font-weight: 800;
    text-decoration: none;
}

.esh .esh-strankovani__vypustka {
    border-color: transparent;
}

@media (hover: hover) {
    .esh a.esh-strankovani__cislo:hover {
        border-color: var(--esh-ink);
    }
}

.esh .esh-strankovani__cislo.is-aktivni {
    border-color: var(--esh-night);
    color: #fff;
    background: var(--esh-night);
}

.esh .esh-strankovani__krok {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 6px;
    color: var(--esh-ink);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .06em;
    text-decoration: none;
    text-transform: uppercase;
}

@media (hover: hover) {
    .esh a.esh-strankovani__krok:hover {
        color: var(--esh-red);
    }
}

.esh .esh-strankovani__krok.is-neaktivni {
    color: #b3afa8;
}

.esh .esh-strankovani__info {
    flex: 1 0 100%;
    margin: 0;
    color: var(--esh-muted);
    font-size: 12px;
    text-align: center;
}

/* ==========================================================================
   Detail produktu (kompozice enfieldshop.cz: náhledy | galerie | panel)
   ========================================================================== */
.esh .esh-detail__hlavni {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    margin-top: 18px;
}

.esh .esh-galerie {
    grid-row: 1;
    display: flex;
    gap: 8px;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.esh .esh-galerie::-webkit-scrollbar {
    display: none;
}

.esh .esh-galerie__dlazdice {
    position: relative;
    display: block;
    flex: 0 0 100%;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    max-height: 72vh;
    background: var(--esh-foto);
    cursor: zoom-in;
    scroll-snap-align: start;
    scroll-margin-top: 16px; /* web má html{scroll-padding-top} pro svou lepkavou hlavičku */
}

.esh .esh-galerie__dlazdice img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .5s var(--esh-ease);
}

.esh .esh-galerie__dlazdice--prazdna {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--esh-muted);
    cursor: default;
}

.esh .esh-galerie__lupa {
    position: absolute;
    right: 14px;
    bottom: 14px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: var(--esh-ink);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
    font-size: 24px;
    line-height: 1;
}

.esh .esh-nahledy {
    grid-row: 2;
    display: flex;
    gap: 8px;
    min-width: 0;
    overflow-x: auto;
    padding: 2px;
    scrollbar-width: thin;
}

.esh .esh-nahled {
    position: relative;
    flex: 0 0 auto;
    width: 64px;
    height: 80px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--esh-line);
    border-radius: 0;
    background: var(--esh-foto);
    cursor: pointer;
}

.esh .esh-nahled img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.esh .esh-nahled::after {
    content: "";
    position: absolute;
    inset: -1px;
    border: 2px solid transparent;
    pointer-events: none;
}

.esh .esh-nahled.is-aktivni::after {
    border-color: var(--esh-ink);
}

@media (hover: hover) {
    .esh .esh-nahled:hover::after {
        border-color: var(--esh-ink);
    }
}

.esh .esh-nahled:focus-visible {
    outline-offset: 2px;
}

/* Panel s názvem a cenou */
.esh .esh-panel {
    grid-row: 3;
    min-width: 0;
    padding: 12px 0 8px;
    background: #fff;
}

.esh .esh-detail__hlavni--bez-nahledu .esh-panel {
    grid-row: 2;
}

.esh .esh-stitky--panel {
    margin: 0 0 14px;
}

.esh .esh-panel__znacka {
    margin: 0 0 8px;
    color: var(--esh-muted);
    font-size: calc(11px + 11 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .15em;
    line-height: 1.3;
    text-transform: uppercase;
}

.esh .esh-panel__nazev,
.esh h1.esh-panel__nazev {
    margin: 0 0 18px;
    color: var(--esh-ink);
    font-family: inherit;
    font-size: calc(24px + 24 * var(--esh-s));
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.12;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.esh .esh-udaje {
    margin: 0;
    padding: 0;
    font-size: calc(14px + 14 * var(--esh-s));
}

.esh .esh-udaje__radek {
    display: grid;
    grid-template-columns: minmax(96px, 38%) minmax(0, 1fr);
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--esh-line);
}

.esh .esh-udaje__radek:first-child {
    border-top: 1px solid var(--esh-line);
}

.esh .esh-udaje dt {
    margin: 0;
    color: var(--esh-muted);
    font-weight: 700;
}

.esh .esh-udaje dd {
    min-width: 0;
    margin: 0;
    color: var(--esh-ink);
    overflow-wrap: anywhere;
}

.esh .esh-udaje dd a {
    color: var(--esh-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (hover: hover) {
    .esh .esh-udaje dd a:hover {
        color: var(--esh-red);
    }
}

.esh .esh-udaje .esh-dostupnost {
    font-size: inherit;
}

.esh .esh-panel__kratky {
    margin: 18px 0 0;
    color: #4a4843;
    font-size: calc(15px + 15 * var(--esh-s));
    line-height: 1.6;
}

.esh .esh-cenobox {
    margin: 20px 0 0;
    padding: 18px 0;
    border-top: 1px solid var(--esh-line);
    border-bottom: 1px solid var(--esh-line);
}

.esh .esh-cenobox__cena {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 14px;
    margin: 0;
    line-height: 1.15;
}

.esh .esh-cena--velka {
    font-size: calc(30px + 30 * var(--esh-s));
    letter-spacing: -.02em;
}

.esh .esh-cenobox .esh-cena-puvodni {
    font-size: calc(17px + 17 * var(--esh-s));
}

.esh .esh-cenobox__sleva {
    display: inline-block;
    padding: 4px 9px;
    border-radius: 999px;
    color: #fff;
    background: var(--esh-red);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    white-space: nowrap;
}

.esh .esh-cenobox__dph {
    margin: 8px 0 0;
    color: var(--esh-muted);
    font-size: calc(13px + 13 * var(--esh-s));
}

.esh .esh-cenobox__omnibus {
    margin: 6px 0 0;
    color: var(--esh-muted);
    font-size: calc(12px + 12 * var(--esh-s));
}

.esh .esh-tlacitko--koupit {
    width: 100%;
    min-height: 54px;
    margin-top: 18px;
    font-size: calc(14px + 14 * var(--esh-s));
}

/* Záložky: popis / parametry / výrobce (bez JS se zobrazí pod sebou) */
.esh .esh-zalozky {
    margin-top: 56px;
    padding-top: 6px;
}

.esh .esh-zalozky__lista {
    display: flex;
    flex-wrap: wrap;
    gap: 0 28px;
    margin: 0 0 26px;
    border-bottom: 1px solid var(--esh-line);
}

.esh .esh-zalozky__lista[hidden] {
    display: none;
}

.esh .esh-zalozky__tab {
    min-height: 48px;
    margin: 0 0 -1px;
    padding: 10px 0;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    color: var(--esh-muted);
    background: transparent;
    font-size: calc(14px + 14 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
}

@media (hover: hover) {
    .esh .esh-zalozky__tab:hover {
        color: var(--esh-ink);
    }
}

.esh .esh-zalozky__tab[aria-selected="true"] {
    border-bottom-color: var(--esh-red);
    color: var(--esh-ink);
}

.esh .esh-zalozka {
    padding: 0 0 34px;
}

.esh .esh-zalozka[hidden] {
    display: none;
}

.esh .esh-zalozka__nadpis,
.esh h2.esh-zalozka__nadpis {
    margin: 0 0 18px;
    padding-top: 18px;
    border-top: 1px solid var(--esh-line);
    color: var(--esh-ink);
    font-family: inherit;
    font-size: calc(20px + 20 * var(--esh-s));
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.2;
}

.esh .esh-zalozky--js .esh-zalozka__nadpis {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.esh .esh-popis {
    font-size: calc(15.5px + 15.5 * var(--esh-s));
}

.esh .esh-parametry {
    width: 100%;
    max-width: 820px;
    border-collapse: collapse;
    font-size: calc(14.5px + 14.5 * var(--esh-s));
}

.esh .esh-parametry th,
.esh .esh-parametry td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--esh-line);
    text-align: left;
    vertical-align: top;
}

.esh .esh-parametry tr:first-child th,
.esh .esh-parametry tr:first-child td {
    border-top: 1px solid var(--esh-line);
}

.esh .esh-parametry th {
    width: 40%;
    color: var(--esh-muted);
    font-weight: 700;
}

.esh .esh-parametry tr:nth-child(even) {
    background: #faf8f4;
}

.esh .esh-vyrobce {
    max-width: 820px;
}

.esh .esh-vyrobce__nazev {
    margin: 0 0 14px;
    font-size: calc(18px + 18 * var(--esh-s));
    font-weight: 800;
}

.esh .esh-vyrobce__pozn {
    margin: 0;
    color: var(--esh-muted);
}

.esh .esh-vyrobce .esh-udaje {
    margin-bottom: 18px;
}

.esh .esh-odkaz-sipka {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid currentColor;
    color: var(--esh-ink);
    font-size: calc(13px + 13 * var(--esh-s));
    font-weight: 800;
    text-decoration: none;
}

@media (hover: hover) {
    .esh .esh-odkaz-sipka:hover {
        color: var(--esh-red);
    }
}

/* Související produkty */
.esh .esh-souvisejici {
    margin-top: 56px;
    padding-top: 56px;
    border-top: 1px solid var(--esh-line);
}

.esh .esh-souvisejici__nadpis,
.esh h2.esh-souvisejici__nadpis {
    margin: 0 0 34px;
    color: var(--esh-ink);
    font-family: inherit;
    font-size: clamp(28px, 3vw, 58px);
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1.08;
    text-align: center;
}

/* Lightbox (nativní <dialog>) – tmavá plocha, bílé ovládání */
.esh .esh-lightbox {
    position: fixed;
    inset: 0;
    width: 100vw;
    max-width: none;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    color: #fff;
    background: rgba(10, 10, 11, .97);
    overflow: hidden;
}

.esh .esh-lightbox::backdrop {
    background: rgba(0, 0, 0, .6);
}

.esh .esh-lightbox__plocha {
    position: absolute;
    inset: 64px 12px 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.esh .esh-lightbox__obrazek {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    cursor: zoom-in;
    transform-origin: 50% 50%;
    transition: transform .2s var(--esh-ease);
}

/* Přiblížení: 2,2× kolem bodu kliknutí, pohyb myši posouvá výřez (JS mění transform-origin) */
.esh .esh-lightbox--lupa .esh-lightbox__obrazek {
    transform: scale(2.2);
    cursor: zoom-out;
}

.esh .esh-lightbox__popis {
    position: absolute;
    right: 70px;
    bottom: 18px;
    left: 70px;
    margin: 0;
    color: #e9e5de;
    font-size: 13px;
    text-align: center;
}

.esh .esh-lightbox__tlacitko {
    position: absolute;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    color: #fff;
    background: rgba(0, 0, 0, .55);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

@media (hover: hover) {
    .esh .esh-lightbox__tlacitko:hover {
        background: rgba(255, 255, 255, .16);
    }
}

.esh .esh-lightbox__zavrit {
    top: 10px;
    right: 12px;
    font-size: 32px;
}

.esh .esh-lightbox__lupa {
    top: 10px;
    right: 70px;
}

.esh .esh-lightbox__predchozi,
.esh .esh-lightbox__dalsi {
    bottom: 8px;
}

.esh .esh-lightbox__predchozi {
    left: 12px;
}

.esh .esh-lightbox__dalsi {
    right: 12px;
}

/* ==========================================================================
   Větší obrazovky
   ========================================================================== */
@media (min-width: 640px) {
    .esh .esh-mrizka {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr));
        gap: 36px 16px;
    }

    .esh .esh-lightbox__plocha {
        inset: 72px 84px 72px;
    }

    .esh .esh-lightbox__predchozi,
    .esh .esh-lightbox__dalsi {
        top: 50%;
        bottom: auto;
        width: 56px;
        height: 56px;
        transform: translateY(-50%);
    }

    .esh .esh-lightbox__predchozi {
        left: 18px;
    }

    .esh .esh-lightbox__dalsi {
        right: 18px;
    }
}

@media (min-width: 900px) {
    /* Detail: náhledy vlevo, galerie dlaždic (hlavní přes celou šířku, další po dvou) */
    .esh .esh-detail__hlavni {
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 16px;
    }

    .esh .esh-detail__hlavni--bez-nahledu {
        grid-template-columns: minmax(0, 1fr);
    }

    .esh .esh-nahledy {
        position: sticky;
        top: calc(var(--esh-nav) + 20px);
        grid-column: 1;
        grid-row: 1;
        flex-direction: column;
        max-height: calc(100vh - var(--esh-nav) - 40px);
        overflow-x: hidden;
        overflow-y: auto;
    }

    .esh .esh-nahled {
        width: 68px;
        height: 86px;
    }

    .esh .esh-galerie {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-column: 2;
        grid-row: 1;
        gap: 12px;
        overflow: visible;
        scroll-snap-type: none;
    }

    .esh .esh-detail__hlavni--bez-nahledu .esh-galerie {
        grid-column: 1;
    }

    .esh .esh-galerie__dlazdice {
        max-height: none;
    }

    .esh .esh-galerie__dlazdice img {
        object-fit: cover;
    }

    .esh .esh-galerie__dlazdice--hlavni {
        grid-column: 1 / -1;
        aspect-ratio: auto;
        height: clamp(480px, 68vh, 900px);
    }

    .esh .esh-galerie__dlazdice--hlavni img {
        object-fit: contain;
    }

    /* Poslední fotka, která by zůstala v řadě sama, jde přes celou šířku (žádná díra v mřížce). */
    .esh .esh-galerie__dlazdice:nth-child(even):last-child {
        grid-column: 1 / -1;
        aspect-ratio: auto;
        height: clamp(420px, 60vh, 820px);
    }

    .esh .esh-galerie__dlazdice:nth-child(even):last-child img {
        object-fit: contain;
    }

    @media (hover: hover) {
        .esh .esh-galerie__dlazdice:hover img {
            transform: scale(1.02);
        }
    }

    .esh .esh-panel {
        grid-column: 2;
        grid-row: 2;
        max-width: 680px;
        padding-top: 24px;
    }

    .esh .esh-mrizka.esh-mrizka--souvisejici {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .esh .esh-detail__hlavni--bez-nahledu .esh-panel {
        grid-column: 1;
    }
}

@media (min-width: 1024px) {
    .esh .esh-pole {
        font-size: calc(14px + 14 * var(--esh-s));
    }

    /* Výpis: filtry vlevo, mřížka vpravo */
    .esh .esh-katalog__rozlozeni {
        grid-template-columns: 280px minmax(0, 1fr);
        gap: 40px;
    }

    .esh .esh-filtry {
        border: 0;
        background: transparent;
    }

    .esh .esh-filtry__prepinac {
        display: none;
    }

    .esh .esh-strom,
    .esh .esh-filtry__form {
        padding: 0 0 18px;
    }

    .esh .esh-filtry[open] > .esh-strom {
        border-top: 0;
    }

    .esh .esh-bok__nadpis,
    .esh h2.esh-bok__nadpis {
        margin-top: 0;
    }

    .esh .esh-strom + .esh-filtry__form {
        padding-top: 18px;
    }

    .esh .esh-strom__odkaz {
        padding-left: 12px;
    }
}

@media (min-width: 1200px) {
    /* Detail: náhledy | galerie | panel vpravo (sticky) – jako enfieldshop.cz */
    .esh .esh-detail__hlavni {
        grid-template-columns: 78px minmax(0, 1fr) minmax(360px, 420px);
        gap: 18px;
    }

    .esh .esh-detail__hlavni--bez-nahledu {
        grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
        gap: 28px;
    }

    .esh .esh-nahled {
        width: 76px;
        height: 96px;
    }

    .esh .esh-panel {
        position: sticky;
        top: calc(var(--esh-nav) + 20px);
        grid-column: 3;
        grid-row: 1;
        max-width: none;
        padding-top: 0;
        padding-left: 18px;
    }

    .esh .esh-mrizka.esh-mrizka--souvisejici {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 40px 18px;
    }

    .esh .esh-detail__hlavni--bez-nahledu .esh-panel {
        grid-column: 2;
        grid-row: 1;
    }

    .esh .esh-katalog__rozlozeni {
        grid-template-columns: 300px minmax(0, 1fr);
        gap: 48px;
    }
}

@media (min-width: 1800px) {
    .esh .esh-detail__hlavni {
        grid-template-columns: 84px minmax(0, 1fr) 480px;
        gap: 22px;
    }

    .esh .esh-detail__hlavni--bez-nahledu {
        grid-template-columns: minmax(0, 1fr) 480px;
        gap: 36px;
    }

    .esh .esh-nahled {
        width: 82px;
        height: 104px;
    }

    .esh .esh-panel {
        padding-left: 28px;
    }

    .esh .esh-katalog__rozlozeni {
        grid-template-columns: 340px minmax(0, 1fr);
        gap: 56px;
    }

    .esh .esh-mrizka {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: 44px 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .esh *,
    .esh *::before,
    .esh *::after {
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

@media print {
    .esh .esh-nahledy,
    .esh .esh-katalog__bok,
    .esh .esh-lista__razeni,
    .esh .esh-strankovani,
    .esh .esh-lightbox {
        display: none !important;
    }
}

/* ==========================================================================
   F4-13 doplněk (26. 9. 2026): ikonky příznaků s popiskem, cena se slevou,
   nákup a tlačítka Oblíbené · Porovnat · Hlídací pes, toast.
   Chování tlačítek dodávají moduly košík/oblíbené/porovnání/hlídací pes
   (háčky data-esh-*); tady jen vzhled a stavy is-aktivni / aria-pressed.
   ========================================================================== */
.esh .esh-svg {
    display: block;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
}

/* Ikonky příznaků: bez textu, popisek po najetí myší a po fokusu */
.esh .esh-ikony {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esh .esh-ikony > li {
    margin: 0;
    padding: 0;
}

.esh .esh-ikona {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #fff;
    background: var(--esh-night);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
    cursor: help;
}

.esh .esh-ikona .esh-svg {
    width: 16px;
    height: 16px;
}

.esh .esh-ikona--akce,
.esh .esh-ikona--sleva {
    background: var(--esh-red);
}

.esh .esh-ikona--doprodej {
    color: var(--esh-ink);
    background: var(--esh-yellow);
}

.esh .esh-ikona--tip {
    color: var(--esh-ink);
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--esh-ink), 0 1px 3px rgba(0, 0, 0, .12);
}

.esh .esh-ikona:focus-visible {
    outline-offset: 2px;
}

.esh [data-esh-tip]::after {
    content: attr(data-esh-tip);
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 6;
    padding: 6px 10px;
    border-radius: 4px;
    color: #fff;
    background: var(--esh-night);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1.3;
    text-transform: none;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-3px);
    transition: opacity .15s var(--esh-ease), transform .15s var(--esh-ease), visibility 0s linear .15s;
    /* R-034 (WCAG 1.4.13): popisek jde najet myší, proto bez pointer-events: none.
       Skrytý popisek (visibility: hidden) myš nezachytí, takže nic nepřekrývá. */
}

.esh [data-esh-tip]:focus-visible::after {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition-delay: 0s;
}

@media (hover: hover) {
    .esh [data-esh-tip]:hover::after {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        transition-delay: 0s;
    }
}

/* R-034: neviditelný můstek přes 8px mezeru mezi ikonkou a popiskem, aby najetí
   z ikonky na popisek nepřerušilo :hover (pseudoprvek patří k ikonce). */
@media (hover: hover) and (pointer: fine) {
    .esh [data-esh-tip]:hover::before {
        content: "";
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        height: 8px;
    }
}

/* R-034: dotyk – popisek po klepnutí (fokus), zmizí klepnutím jinam */
@media (hover: none) {
    .esh [data-esh-tip]:focus::after {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        transition-delay: 0s;
    }
}

/* R-034 (WCAG 1.4.13 „zavřitelný“): Esc skryje popisek bez posunu myši a fokusu.
   Třídu is-tip-zavreny přidává a po odchodu myši / fokusu odebírá eshop.js
   (kód v dukazy/R-034-potreby.md §1). Bez JS pravidlo nic nedělá. */
.esh .esh-ikona[data-esh-tip].is-tip-zavreny::after {
    opacity: 0;
    visibility: hidden;
    transition: none;
}

/* Karta: ikonky vlevo nahoře nad odkazem karty (aby šly najet myší) */
.esh .esh-karta__foto .esh-ikony {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 58px;
    z-index: 4;
    pointer-events: none;
}

.esh .esh-karta__foto .esh-ikona {
    pointer-events: auto;
}

.esh .esh-ikony--panel {
    margin: 0 0 14px;
}

/* Karta: srdíčko a porovnání v pravém horním rohu fotky */
.esh .esh-karta__akce {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.esh .esh-ikontl {
    position: relative;
    z-index: 4;
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 50%;
    color: var(--esh-ink);
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
    cursor: pointer;
    transition: color .18s var(--esh-ease), background-color .18s var(--esh-ease), transform .18s var(--esh-ease), opacity .18s var(--esh-ease);
}

@media (hover: hover) {
    .esh .esh-ikontl:hover {
        color: var(--esh-red);
        background: #fff;
    }
}

.esh .esh-ikontl:active {
    transform: scale(.94);
}

.esh .esh-ikontl:focus-visible {
    outline-offset: 2px;
}

.esh .esh-ikontl .esh-svg {
    width: 20px;
    height: 20px;
}

/* Srdíčko: obrys → plné v barvě webu */
.esh .esh-svg--srdce .esh-svg__vypln {
    fill: transparent;
    transition: fill .18s var(--esh-ease);
}

.esh .is-aktivni > .esh-svg--srdce,
.esh [aria-pressed="true"] > .esh-svg--srdce {
    color: var(--esh-red);
}

.esh .is-aktivni > .esh-svg--srdce .esh-svg__vypln,
.esh [aria-pressed="true"] > .esh-svg--srdce .esh-svg__vypln {
    fill: var(--esh-red);
}

/* Porovnání aktivní: tmavé tlačítko */
.esh .esh-ikontl--porovnat.is-aktivni,
.esh .esh-ikontl--porovnat[aria-pressed="true"] {
    color: #fff;
    background: var(--esh-night);
}

/* Hlídací pes aktivní: zvoneček plný */
.esh .esh-svg--pes .esh-svg__vypln {
    fill: transparent;
}

.esh .is-aktivni > .esh-svg--pes .esh-svg__vypln,
.esh [aria-pressed="true"] > .esh-svg--pes .esh-svg__vypln {
    fill: currentColor;
}

/* Karta: řádek ceny s tlačítkem košíku */
.esh .esh-karta__cenaradek {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 2px 0 0;
}

.esh .esh-karta__cenaradek .esh-karta__cena {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}

.esh .esh-ikontl--kosik {
    flex: 0 0 auto;
    color: #fff;
    background: var(--esh-red);
    box-shadow: none;
}

@media (hover: hover) {
    .esh .esh-ikontl--kosik:hover {
        color: #fff;
        background: var(--esh-red-dark);
    }
}

.esh .esh-ikontl--kosik.is-aktivni {
    background: var(--esh-green);
}

.esh .esh-procenta {
    display: inline-block;
    padding: 3px 7px;
    border-radius: 999px;
    color: #fff;
    background: var(--esh-red);
    font-size: calc(11.5px + 11.5 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 1.25;
    white-space: nowrap;
}

.esh .esh-procenta--velke {
    padding: 5px 11px;
    font-size: calc(15px + 15 * var(--esh-s));
    align-self: center;
}

.esh .esh-karta__akcedo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--esh-red);
    font-size: calc(12px + 12 * var(--esh-s));
    font-weight: 700;
    line-height: 1.3;
}

.esh .esh-karta__akcedo .esh-svg,
.esh .esh-cenobox__akce .esh-svg {
    width: 15px;
    height: 15px;
}

/* Detail: cena se slevou */
.esh .esh-cenobox__puvodni {
    margin: 8px 0 0;
    color: var(--esh-muted);
    font-size: calc(14px + 14 * var(--esh-s));
}

.esh .esh-cenobox__puvodni .esh-cena-puvodni {
    margin-left: 4px;
    font-size: calc(16px + 16 * var(--esh-s));
}

.esh .esh-cenobox__usetrite {
    margin: 6px 0 0;
    color: var(--esh-red);
    font-size: calc(15px + 15 * var(--esh-s));
    font-weight: 700;
}

.esh .esh-cenobox__usetrite strong {
    font-weight: 800;
}

.esh .esh-cenobox__usetrite-pr {
    color: var(--esh-muted);
    font-weight: 600;
}

.esh .esh-cenobox__akce {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 12px 0 0;
    padding: 9px 12px;
    border-left: 3px solid var(--esh-red);
    color: var(--esh-ink);
    background: #fbf1ef;
    font-size: calc(13.5px + 13.5 * var(--esh-s));
    line-height: 1.35;
}

.esh .esh-cenobox__akce .esh-svg {
    color: var(--esh-red);
}

.esh .esh-cenobox__akce strong {
    font-weight: 800;
}

.esh .esh-mnozstevni {
    width: 100%;
    margin: 14px 0 0;
    border-collapse: collapse;
    font-size: calc(13.5px + 13.5 * var(--esh-s));
}

.esh .esh-mnozstevni caption {
    padding: 0 0 6px;
    color: var(--esh-ink);
    font-size: calc(12px + 12 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .1em;
    text-align: left;
    text-transform: uppercase;
}

.esh .esh-mnozstevni th,
.esh .esh-mnozstevni td {
    padding: 7px 10px;
    border-top: 1px solid var(--esh-line);
    text-align: left;
}

.esh .esh-mnozstevni th {
    color: var(--esh-muted);
    font-weight: 700;
}

.esh .esh-mnozstevni td {
    color: var(--esh-ink);
    font-weight: 800;
    text-align: right;
}

.esh .esh-mnozstevni tr:nth-child(even) {
    background: #faf8f4;
}

/* Detail: výběr varianty (F4-09 doplní data a chování; bez variant se blok nevykreslí) */
.esh .esh-varianty {
    min-width: 0;
    margin: 18px 0 0;
    padding: 0;
    border: 0;
}

.esh .esh-varianty__nadpis {
    margin: 0 0 8px;
    padding: 0;
    color: var(--esh-ink);
    font-size: calc(12px + 12 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.esh .esh-varianty__volby {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.esh .esh-varianta {
    position: relative;
    display: inline-flex;
    margin: 0;
}

.esh .esh-varianta__vstup {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.esh .esh-varianta__nazev {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid var(--esh-line-strong);
    border-radius: 4px;
    color: var(--esh-ink);
    background: #fff;
    font-weight: 700;
    line-height: 1.2;
}

@media (hover: hover) {
    .esh .esh-varianta__vstup:hover + .esh-varianta__nazev {
        border-color: var(--esh-ink);
    }
}

.esh .esh-varianta__vstup:checked + .esh-varianta__nazev {
    border-color: var(--esh-ink);
    box-shadow: inset 0 0 0 1px var(--esh-ink);
}

.esh .esh-varianta__vstup:focus-visible + .esh-varianta__nazev {
    outline: 3px solid var(--esh-focus);
    outline-offset: 3px;
}

.esh .esh-varianta--nedostupna .esh-varianta__nazev {
    color: var(--esh-muted);
    background: #faf8f4;
    text-decoration: line-through;
}

/* Detail: nákup */
.esh .esh-nakup {
    margin: 18px 0 0;
}

.esh .esh-nakup__radek {
    display: flex;
    gap: 10px;
    align-items: stretch;
}

.esh .esh-mnozstvi {
    display: flex;
    flex: 0 0 auto;
    align-items: stretch;
    border: 1px solid var(--esh-line-strong);
    border-radius: 4px;
    background: #fff;
}

.esh .esh-mnozstvi:focus-within {
    border-color: var(--esh-ink);
}

.esh .esh-mnozstvi__krok {
    display: grid;
    place-items: center;
    width: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--esh-ink);
    background: transparent;
    cursor: pointer;
}

@media (hover: hover) {
    .esh .esh-mnozstvi__krok:hover {
        color: var(--esh-red);
    }
}

.esh .esh-mnozstvi__krok .esh-svg {
    width: 16px;
    height: 16px;
}

.esh .esh-mnozstvi__pole,
.esh input.esh-mnozstvi__pole {
    width: 48px;
    min-height: 52px;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--esh-ink);
    background: transparent;
    font-size: 16px;
    font-weight: 800;
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}

.esh .esh-mnozstvi__pole::-webkit-outer-spin-button,
.esh .esh-mnozstvi__pole::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.esh .esh-mnozstvi__pole:focus-visible {
    outline: none;
}

.esh .esh-nakup .esh-tlacitko--koupit {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    margin: 0;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.esh .esh-tlacitko--koupit .esh-svg {
    width: 20px;
    height: 20px;
}

.esh .esh-tlacitko--koupit.is-aktivni {
    background: var(--esh-green);
}

.esh .esh-nakup__pozn {
    margin: 0;
    padding: 12px 14px;
    border-radius: 4px;
    color: var(--esh-ink);
    background: var(--esh-paper);
    font-size: calc(14px + 14 * var(--esh-s));
}

.esh .esh-nakup__dalsi {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0 0;
}

.esh .esh-akcetl {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    min-height: 58px;
    margin: 0;
    padding: 8px 6px;
    border: 1px solid var(--esh-line);
    border-radius: 4px;
    color: var(--esh-ink);
    background: #fff;
    font-size: calc(11.5px + 11.5 * var(--esh-s));
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .18s var(--esh-ease), border-color .18s var(--esh-ease), background-color .18s var(--esh-ease);
}

@media (hover: hover) {
    .esh .esh-akcetl:hover {
        border-color: var(--esh-ink);
        color: var(--esh-ink);
    }
}

@media (hover: hover) {
    .esh .esh-akcetl:hover .esh-svg {
        color: var(--esh-red);
    }
}

.esh .esh-akcetl .esh-svg {
    width: 20px;
    height: 20px;
}

.esh .esh-akcetl__text {
    overflow-wrap: anywhere;
}

.esh .esh-akcetl__text--aktivni,
.esh .esh-akcetl.is-aktivni .esh-akcetl__text,
.esh .esh-akcetl[aria-pressed="true"] .esh-akcetl__text {
    display: none;
}

.esh .esh-akcetl.is-aktivni .esh-akcetl__text--aktivni,
.esh .esh-akcetl[aria-pressed="true"] .esh-akcetl__text--aktivni {
    display: inline;
}

.esh .esh-akcetl.is-aktivni,
.esh .esh-akcetl[aria-pressed="true"] {
    border-color: var(--esh-red);
    color: var(--esh-red);
    background: #fdf5f4;
}

.esh .esh-akcetl--porovnat.is-aktivni,
.esh .esh-akcetl--porovnat[aria-pressed="true"] {
    border-color: var(--esh-night);
    color: #fff;
    background: var(--esh-night);
}

.esh .esh-akcetl--porovnat.is-aktivni .esh-svg,
.esh .esh-akcetl--porovnat[aria-pressed="true"] .esh-svg {
    color: #fff;
}

.esh .esh-nakup--nedostupne .esh-akcetl--hlidat {
    border-color: var(--esh-red);
}

/* Toast (window.eshToast) – vpravo nahoře pod hlavičkou webu, nad plovoucími lištami */
.esh-toasty {
    position: fixed;
    top: calc(var(--nav, 80px) + 14px);
    right: 16px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    width: min(380px, calc(100vw - 24px));
    margin: 0;
    padding: 0;
    pointer-events: none;
}

.esh-toasty .esh-toast {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 13px 14px 13px 16px;
    border-left: 4px solid #2e9a4f;
    border-radius: 4px;
    color: #191a1c;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
    font-family: Manrope, "Inter", Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    text-align: left;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity .2s cubic-bezier(.2, .65, .25, 1), transform .2s cubic-bezier(.2, .65, .25, 1);
    pointer-events: auto;
}

.esh-toasty .esh-toast.is-videt {
    opacity: 1;
    transform: translateY(0);
}

.esh-toasty .esh-toast--chyba {
    border-left-color: var(--red, #c92d26);
}

.esh-toasty .esh-toast__znak {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #fff;
    background: #1d6b35; /* bílá ✓ 6,55:1 */
    font-size: 13px;
    line-height: 1;
}

.esh-toasty .esh-toast--chyba .esh-toast__znak {
    background: var(--red, #c92d26);
}

.esh-toasty .esh-toast__text {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding-top: 1px;
    color: #191a1c;
    overflow-wrap: anywhere;
}

.esh-toasty .esh-toast__zavrit {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 28px;
    height: 28px;
    margin: -4px -6px -4px 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #625f59;
    background: transparent;
    font-family: inherit;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

@media (hover: hover) {
    .esh-toasty .esh-toast__zavrit:hover {
        color: #191a1c;
        background: #f1eee8;
    }
}

.esh-toasty .esh-toast__zavrit:focus-visible {
    outline: 3px solid #e26438;
    outline-offset: 1px;
}

@media (max-width: 639px) {
    .esh-toasty {
        right: 12px;
        left: 12px;
        width: auto;
    }

    .esh .esh-karta__foto .esh-ikony {
        top: 8px;
        left: 8px;
        right: 56px;
        gap: 5px;
    }

    .esh .esh-ikona {
        width: 28px;
        height: 28px;
    }

    .esh .esh-ikona .esh-svg {
        width: 15px;
        height: 15px;
    }

    /* Popisek u ikonky v úzké kartě se zalomí, aby se neuřízl o okraj fotky */
    .esh .esh-karta__foto [data-esh-tip]::after {
        width: max-content;
        max-width: 120px;
        white-space: normal;
    }

    .esh .esh-karta__cenaradek {
        align-items: flex-end;
    }
}

@media (min-width: 640px) {
    .esh .esh-akcetl {
        flex-direction: row;
        gap: 8px;
        min-height: 48px;
    }
}

@media (min-width: 1024px) {
    /* Myš: rohová tlačítka karty menší a decentnější, plně vidět po najetí na kartu */
    .esh .esh-karta__akce .esh-ikontl {
        width: 40px;
        height: 40px;
        opacity: .88;
    }

    .esh .esh-karta__akce .esh-ikontl:focus-visible,
    .esh .esh-karta__akce .esh-ikontl.is-aktivni,
    .esh .esh-karta__akce .esh-ikontl[aria-pressed="true"] {
        opacity: 1;
    }

    @media (hover: hover) {
        .esh .esh-karta:hover .esh-karta__akce .esh-ikontl {
            opacity: 1;
        }
    }

    .esh .esh-ikontl--kosik {
        width: 40px;
        height: 40px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .esh-toasty .esh-toast {
        transition: none;
    }
}

@media print {
    .esh .esh-karta__akce,
    .esh .esh-ikontl,
    .esh .esh-nakup,
    .esh-toasty {
        display: none !important;
    }
}

/* R-007: ikonka příznaku je odkaz na výpis štítku (/obchod/stitek/<slug>/); leží nad odkazem karty (z-index 4 > 3) */
.esh a.esh-ikona,
.esh a.esh-ikona:link,
.esh a.esh-ikona:visited {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s var(--esh-ease), box-shadow .15s var(--esh-ease);
}

.esh a.esh-ikona--doprodej,
.esh a.esh-ikona--doprodej:link,
.esh a.esh-ikona--doprodej:visited,
.esh a.esh-ikona--tip,
.esh a.esh-ikona--tip:link,
.esh a.esh-ikona--tip:visited {
    color: var(--esh-ink);
}

@media (hover: hover) {
    .esh a.esh-ikona:hover {
        transform: scale(1.08);
        box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
    }
}

.esh a.esh-ikona:focus-visible {
    outline: 3px solid var(--esh-focus);
    outline-offset: 2px;
}

/* R-007: Slevy a Akce — řádek úspory na kartě „Ušetříte 998 Kč · 5 988 − 998 = 4 990 Kč“ */
.esh .esh-karta__usetrite {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 8px;
    margin: 6px 0 0;
    padding: 6px 10px;
    border-radius: 4px;
    color: var(--esh-red);
    background: rgba(201, 45, 38, .08);
    font-size: calc(13px + 13 * var(--esh-s));
    line-height: 1.35;
}

.esh .esh-karta__usetrite strong {
    font-weight: 800;
}

.esh .esh-karta__rovnice {
    color: var(--esh-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* ==========================================================================
   R-034 (27. 9. 2026): dotykové cíle ≥ 44 px (R-022 kap. 6 návrh 2, F5-29 kap. 4).
   Jen pro dotyk (pointer: coarse); na myši se nic nemění. Vzhled zůstává:
   malé kulaté prvky dostanou neviditelnou plochu pro klepnutí přes ::before,
   řádky filtrů a stromu kategorií jen vyšší min. výšku.
   ========================================================================== */
@media (pointer: coarse) {
    /* ikonky příznaků 30 px (+ 2 × 7 px = 44 px) */
    .esh .esh-ikona::before {
        content: "";
        position: absolute;
        inset: -7px;
    }

    /* zavření toastu 28 px (+ 2 × 8 px = 44 px) */
    .esh-toasty .esh-toast__zavrit {
        position: relative;
    }

    .esh-toasty .esh-toast__zavrit::before {
        content: "";
        position: absolute;
        inset: -8px;
    }

    /* volby filtru 36 px, strom kategorií 38 px */
    .esh label.esh-volba,
    .esh .esh-volba,
    .esh .esh-strom__odkaz {
        min-height: 44px;
    }

    /* krok množství −/+ (šířka už 44 px, výška podle pole) */
    .esh .esh-mnozstvi__krok {
        min-width: 44px;
        min-height: 44px;
    }
}

@media (pointer: coarse) and (max-width: 639px) {
    /* ikonky příznaků na mobilu 28 px (+ 2 × 8 px = 44 px) */
    .esh .esh-ikona::before {
        inset: -8px;
    }
}

/* R-031 (navazuje na R-034): plochy ikonek příznaků se nesmí překrývat (rozestup ≥ 2 × 8 px), drobečky 17 px
   => 45 px bez posunu řádku (padding se zápornou marginou), odkaz nad oddělovačem „/“ dalšího odkazu. */
@media (pointer: coarse) {
    .esh .esh-ikony,
    .esh .esh-karta__foto .esh-ikony {
        gap: 16px;
    }

    .esh .esh-drobky a {
        position: relative;
        z-index: 1;
        display: inline-block;
        padding: 14px 8px;
        margin: -14px -8px;
    }
}

/* F5-29: Prohlášení o přístupnosti přes celou šířku (jen .esh.esh-pristupnost), řádek textu max. 78ch.
   Článek je mřížka: úvod a stav souladu vedle sebe, známé nedostatky přes celou šířku (seznamy ve sloupcích),
   zbylé 4 sekce 2 × 2. Obal sekcí .esh-pristupnost__mrizka je jen seskupení bez sémantiky (display: contents),
   pořadí v DOM i pořadí čtení se nemění. Na úzkém displeji vše v jednom sloupci. */
.esh.esh-pristupnost .esh-pristupnost__clanek {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 46ch), 1fr));
    gap: 0 clamp(24px, 3vw, 72px);
    align-items: start;
}

.esh.esh-pristupnost .esh-pristupnost__mrizka {
    display: contents;
}

.esh.esh-pristupnost .esh-pristupnost__uvod,
.esh.esh-pristupnost .esh-pristupnost__sekce {
    min-width: 0;
}

.esh.esh-pristupnost .esh-pristupnost__sekce--nedostatky {
    grid-column: 1 / -1;
    max-width: none;
}

.esh.esh-pristupnost .esh-pristupnost__sekce--nedostatky > p {
    max-width: 78ch;
}

.esh.esh-pristupnost .esh-pristupnost__sekce--nedostatky > ul {
    columns: 2 58ch;
    column-gap: clamp(24px, 3vw, 72px);
}

.esh.esh-pristupnost .esh-pristupnost__sekce--nedostatky > ul > li {
    max-width: 78ch;
    break-inside: avoid;
}

@media (min-width: 1100px) {
    /* stav souladu vedle úvodu: zarovnat na úroveň prvního odstavce pod nadpisem */
    .esh.esh-pristupnost .esh-pristupnost__sekce--stav {
        align-self: end;
    }
}