/**
 * Jaga Shop - vylepsenia pokladne.
 *
 * Vacsina pravidiel je ohranicena triedou .jaga-chk na <html>, ktoru pridava
 * skript - tie totiz oblekaju veci, ktore skript sam vyrobi.
 *
 * Karty platobnych metod su vynimka: kresli ich samotne CSS (selektory
 * body#checkout ...), lebo skript sa nacitava az na konci stranky a zakaznik
 * by do vtedy videl povodny vzhlad. Preto musia byt farby definovane na
 * :root, nie az na .jaga-chk - inak by sa bez skriptu nepouzili ani ramiky.
 */

:root {
    --jaga-accent: #d510ce;
    --jaga-muted: #767676;
    --jaga-line: #e3e3e6;
}

/* ------------------------------------------------- horny pasik */

/*
 * "Politika pouzivania udajov" a "Kontaktujte nas" su dva samostatne bloky
 * vedla seba a tema medzi ne nedava nic - text sa cital ako jedno slovo
 * ("...udajovKontaktujte nas"). Pridavame medzeru a tenku deliacu ciarku.
 * Len od 992 px vyssie, nizsie je cely pasik skryty.
 */
@media (min-width: 992px) {
    #header .header-nav .left-nav {
        gap: 26px;
    }

    #header .header-nav #_desktop_policy_link {
        position: relative;
    }

    #header .header-nav #_desktop_policy_link::after {
        position: absolute;
        top: 50%;
        right: -13px;
        width: 1px;
        height: 12px;
        margin-top: -6px;
        background: #d8d8d8;
        content: "";
    }
}

/* ------------------------------------------------- vyhladavanie */

/*
 * Tlacidlo vyhladavania bolo len bledosive svg v bielom poli - na ciernej
 * liste ho prakticky nebolo vidiet. Vsade z neho robime ruzove tlacidlo.
 */
#header .search-widget button[type="submit"] {
    border: 0;
    background: var(--jaga-accent);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
}

#header .search-widget button[type="submit"] svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

#header .search-widget button[type="submit"] svg path {
    fill: #fff;
}

#header .search-widget input[type="text"]:focus {
    border-color: var(--jaga-accent);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(213, 16, 206, .15);
}

/* Nazov tlacidla doplna skript (je prelozeny). Bez neho ostane samotna lupa. */
#header .search-widget .jaga-search-label {
    display: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
}

@media (max-width: 991px) {
    /* Na mobile je pole trvalo v hlavicke - z lupy robime len ruzove kolieko. */
    #header .search-widget button[type="submit"] {
        top: 4px;
        right: 4px;
        width: 38px;
        height: 38px;
        padding: 0;
        border-radius: 50%;
    }

    #header .search-widget input[type="text"] {
        padding-right: 52px;
    }
}

@media (min-width: 992px) {
    /*
     * Po kliknuti na lupu sa doteraz cez menu prelozilo siroke biele pole -
     * vyzeralo to ako chyba a menu zmizlo. Teraz sa pod hlavickou vysunie
     * cisty pas: menu ostava vidno a pole ma vlastne tlacidlo.
     */
    #header .search-widget.dropdown-menu {
        top: 100% !important;
        right: 0 !important;
        left: 0 !important;
        width: 100%;
        margin: 0;
        padding: 16px 24px;
        border: 0;
        border-radius: 0 0 14px 14px;
        background: #fff;
        box-shadow: 0 16px 30px rgba(0, 0, 0, .16);
    }

    #header .search-widget.dropdown-menu form {
        position: relative;
        display: flex;
        gap: 10px;
        align-items: center;
    }

    #header .search-widget.dropdown-menu input[type="text"] {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
        height: 48px;
        padding: 0 20px;
        border: 1px solid #d7d7db;
        border-radius: 24px;
        font-size: 15px;
    }

    #header .search-widget.dropdown-menu button[type="submit"] {
        position: static;
        flex: 0 0 auto;
        width: auto;
        height: 48px;
        padding: 0 26px;
        border-radius: 24px;
    }

    #header .search-widget .jaga-search-label {
        display: inline;
    }
}

/* ------------------------------------------------- kosik v hlavicke */

.jaga-chk .cart-action .jaga-min-note {
    margin-top: 7px;
    font-size: 12px;
    line-height: 17px;
    color: #a3372f;
    text-align: center;
}

.jaga-chk a.jaga-cta-off,
.jaga-chk a.jaga-cta-off:hover,
.jaga-chk a.jaga-cta-off:focus {
    background: #e0e0e0 !important;
    border-color: #d2d2d2 !important;
    color: #555 !important;
}

/* Stará nadstavba pokladne (adresy, zbalené kroky, platobné metódy, súhrn)
 * je od verzie 1.3.0 preč — pokladňu kreslí views/css/checkout.css. */

/* ------------------------------------------------- potvrdenie objednavky */
/*
 * Kazde pravidlo je tu dvakrat: raz s .jaga-oc (plati vzdy) a raz s
 * .jaga-oc #main (vyssia specificita, aby prebilo pravidla temy typu
 * "#content h3" alebo "#order-details dd"). Generovane, needitovat rucne -
 * zdroj je /home/claude/mod/oc-section.css.
 */

.jaga-oc {
    --jaga-accent: #d510ce;
    --jaga-oc-accent: #a8009f;
    --jaga-line: #e3e3e6;
}

.jaga-oc .jaga-oc-off{
    display: none !important;
}


/* Nespoliehame sa na reset temy - vlastne bloky si sirku pocitaju samy. */
.jaga-oc [class^="jaga-oc-"],
.jaga-oc [class*=" jaga-oc-"]{
    box-sizing: border-box;
}


.jaga-oc #content-hook_order_confirmation,
.jaga-oc #content.page-order-confirmation{
    border: 0;
    box-shadow: none;
    background: transparent;
}


.jaga-oc #content-hook_order_confirmation > .card-block,
.jaga-oc #content.page-order-confirmation > .card-block{
    padding-left: 0;
    padding-right: 0;
}


.jaga-oc .jaga-oc-hero{
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid var(--jaga-line);
    border-radius: 6px;
    background: #fff;
    padding: 20px 22px;
}


.jaga-oc .jaga-oc-check{
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #e3f5e9;
    color: #14764a;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    line-height: 1;
}


.jaga-oc .jaga-oc-htx{
    flex: 1 1 260px;
}


.jaga-oc .jaga-oc-htx h1{
    display: block;
    margin: 0 0 4px;
    font-size: 25px;
    line-height: 31px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc .jaga-oc-htx p{
    display: block;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    color: #5d5d5d;
    word-break: break-word;
}


.jaga-oc .jaga-oc-ref{
    display: block;
    margin-left: auto;
    flex: 0 0 auto;
    border: 1px solid #ecd0eb;
    background: #fdf5fd;
    border-radius: 6px;
    padding: 9px 18px;
    text-align: center;
}


.jaga-oc .jaga-oc-ref span{
    display: block;
    font-size: 11px;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #6b6b6b;
}


.jaga-oc .jaga-oc-ref strong{
    font-size: 19px;
    font-weight: 700;
    color: var(--jaga-oc-accent);
    letter-spacing: .04em;
}


.jaga-oc .jaga-oc-note{
    display: block;
    margin-top: 16px;
    border: 1px solid var(--jaga-line);
    border-left: 3px solid var(--jaga-oc-accent);
    border-radius: 5px;
    background: #fbfbfc;
    padding: 15px 19px;
}


.jaga-oc .jaga-oc-note h2{
    display: block;
    margin: 0 0 9px;
    font-size: 15px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc .jaga-oc-note p{
    display: block;
    margin: 0 0 7px;
    font-size: 14px;
    line-height: 21px;
    color: #3f3f3f;
}


.jaga-oc .jaga-oc-note p:last-child{
    margin-bottom: 0;
}


.jaga-oc .jaga-oc-card{
    display: block;
    border: 1px solid var(--jaga-line);
    border-radius: 6px;
    background: #fff;
    padding: 17px 19px;
    margin-bottom: 16px;
}


.jaga-oc .jaga-oc-card > h3{
    display: block;
    margin: 0 0 13px;
    font-size: 15px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc .jaga-oc-line{
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 11px 0;
    border-top: 1px solid #f1f1f3;
}


.jaga-oc .jaga-oc-line:first-of-type{
    border-top: 0;
    padding-top: 0;
}


.jaga-oc .jaga-oc-thumb{
    display: block;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border: 1px solid #eee;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}


.jaga-oc .jaga-oc-thumb img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}


.jaga-oc .jaga-oc-nm{
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 19px;
    color: #1f1f1f;
}


.jaga-oc .jaga-oc-unit{
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #6e6e6e;
}


.jaga-oc .jaga-oc-dl-link{
    display: block;
    margin-top: 4px;
    font-size: 13px;
}


.jaga-oc .jaga-oc-sum{
    display: block;
    flex: 0 0 auto;
    min-width: 86px;
    text-align: right;
    font-size: 14px;
    font-weight: 600;
    color: #1f1f1f;
}


.jaga-oc .jaga-oc-tot{
    display: block;
    margin-top: 6px;
    border-top: 1px solid var(--jaga-line);
    padding-top: 12px;
}


.jaga-oc .jaga-oc-tr{
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 0;
    font-size: 14px;
    color: #444;
}


.jaga-oc .jaga-oc-tr .jaga-oc-v{
    white-space: nowrap;
}


.jaga-oc .jaga-oc-tr.jaga-oc-dim .jaga-oc-v{
    color: #6e6e6e;
    white-space: normal;
    text-align: right;
}


.jaga-oc .jaga-oc-tr.jaga-oc-big{
    margin-top: 9px;
    padding-top: 11px;
    border-top: 1px solid var(--jaga-line);
    font-size: 18px;
    font-weight: 700;
    color: #111;
}


.jaga-oc .jaga-oc-tr.jaga-oc-big .jaga-oc-v{
    color: var(--jaga-oc-accent);
}


.jaga-oc .jaga-oc-dl{
    display: block;
    margin: 0;
    font-size: 14px;
}


.jaga-oc .jaga-oc-dl dt{
    display: block;
    margin: 12px 0 0;
    font-size: 11.5px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #6e6e6e;
    font-weight: 600;
}


.jaga-oc .jaga-oc-dl dt:first-child{
    margin-top: 0;
}


.jaga-oc .jaga-oc-dl dd{
    display: block;
    margin: 3px 0 0;
    color: #1f1f1f;
    line-height: 20px;
}


.jaga-oc .jaga-oc-dl dd em{
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    font-style: normal;
    line-height: 18px;
    color: #616161;
}


.jaga-oc .jaga-oc-addr{
    display: block;
    font-size: 14px;
    line-height: 21px;
    color: #2e2e2e;
}


.jaga-oc .jaga-oc-same{
    display: block;
    color: #6e6e6e;
}


.jaga-oc .jaga-oc-btns{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}


.jaga-oc .jaga-oc-btns a.jaga-oc-btn-p,
.jaga-oc .jaga-oc-btns a.jaga-oc-btn-s{
    display: block;
    flex: 1 1 140px;
    padding: 11px 14px;
    border-radius: 5px;
    text-align: center;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
}


.jaga-oc .jaga-oc-btns a.jaga-oc-btn-p{
    background: var(--jaga-oc-accent);
    color: #fff;
}


.jaga-oc .jaga-oc-btns a.jaga-oc-btn-s{
    background: #fff;
    color: #3d3d3d;
    border: 1px solid #d8d8dc;
}

.jaga-oc #main .jaga-oc-off{
    display: none !important;
}


/* Nespoliehame sa na reset temy - vlastne bloky si sirku pocitaju samy. */
.jaga-oc #main [class^="jaga-oc-"],
.jaga-oc #main [class*=" jaga-oc-"]{
    box-sizing: border-box;
}


.jaga-oc #main #content-hook_order_confirmation,
.jaga-oc #main #content.page-order-confirmation{
    border: 0;
    box-shadow: none;
    background: transparent;
}


.jaga-oc #main #content-hook_order_confirmation > .card-block,
.jaga-oc #main #content.page-order-confirmation > .card-block{
    padding-left: 0;
    padding-right: 0;
}


.jaga-oc #main .jaga-oc-hero{
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid var(--jaga-line);
    border-radius: 6px;
    background: #fff;
    padding: 20px 22px;
}


.jaga-oc #main .jaga-oc-check{
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #e3f5e9;
    color: #14764a;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    line-height: 1;
}


.jaga-oc #main .jaga-oc-htx{
    flex: 1 1 260px;
}


.jaga-oc #main .jaga-oc-htx h1{
    display: block;
    margin: 0 0 4px;
    font-size: 25px;
    line-height: 31px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc #main .jaga-oc-htx p{
    display: block;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    color: #5d5d5d;
    word-break: break-word;
}


.jaga-oc #main .jaga-oc-ref{
    display: block;
    margin-left: auto;
    flex: 0 0 auto;
    border: 1px solid #ecd0eb;
    background: #fdf5fd;
    border-radius: 6px;
    padding: 9px 18px;
    text-align: center;
}


.jaga-oc #main .jaga-oc-ref span{
    display: block;
    font-size: 11px;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #6b6b6b;
}


.jaga-oc #main .jaga-oc-ref strong{
    font-size: 19px;
    font-weight: 700;
    color: var(--jaga-oc-accent);
    letter-spacing: .04em;
}


.jaga-oc #main .jaga-oc-note{
    display: block;
    margin-top: 16px;
    border: 1px solid var(--jaga-line);
    border-left: 3px solid var(--jaga-oc-accent);
    border-radius: 5px;
    background: #fbfbfc;
    padding: 15px 19px;
}


.jaga-oc #main .jaga-oc-note h2{
    display: block;
    margin: 0 0 9px;
    font-size: 15px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc #main .jaga-oc-note p{
    display: block;
    margin: 0 0 7px;
    font-size: 14px;
    line-height: 21px;
    color: #3f3f3f;
}


.jaga-oc #main .jaga-oc-note p:last-child{
    margin-bottom: 0;
}


.jaga-oc #main .jaga-oc-card{
    display: block;
    border: 1px solid var(--jaga-line);
    border-radius: 6px;
    background: #fff;
    padding: 17px 19px;
    margin-bottom: 16px;
}


.jaga-oc #main .jaga-oc-card > h3{
    display: block;
    margin: 0 0 13px;
    font-size: 15px;
    font-weight: 700;
    color: #1f1f1f;
    text-transform: none;
    letter-spacing: 0;
}


.jaga-oc #main .jaga-oc-line{
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 11px 0;
    border-top: 1px solid #f1f1f3;
}


.jaga-oc #main .jaga-oc-line:first-of-type{
    border-top: 0;
    padding-top: 0;
}


.jaga-oc #main .jaga-oc-thumb{
    display: block;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border: 1px solid #eee;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}


.jaga-oc #main .jaga-oc-thumb img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}


.jaga-oc #main .jaga-oc-nm{
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 19px;
    color: #1f1f1f;
}


.jaga-oc #main .jaga-oc-unit{
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #6e6e6e;
}


.jaga-oc #main .jaga-oc-dl-link{
    display: block;
    margin-top: 4px;
    font-size: 13px;
}


.jaga-oc #main .jaga-oc-sum{
    display: block;
    flex: 0 0 auto;
    min-width: 86px;
    text-align: right;
    font-size: 14px;
    font-weight: 600;
    color: #1f1f1f;
}


.jaga-oc #main .jaga-oc-tot{
    display: block;
    margin-top: 6px;
    border-top: 1px solid var(--jaga-line);
    padding-top: 12px;
}


.jaga-oc #main .jaga-oc-tr{
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 0;
    font-size: 14px;
    color: #444;
}


.jaga-oc #main .jaga-oc-tr .jaga-oc-v{
    white-space: nowrap;
}


.jaga-oc #main .jaga-oc-tr.jaga-oc-dim .jaga-oc-v{
    color: #6e6e6e;
    white-space: normal;
    text-align: right;
}


.jaga-oc #main .jaga-oc-tr.jaga-oc-big{
    margin-top: 9px;
    padding-top: 11px;
    border-top: 1px solid var(--jaga-line);
    font-size: 18px;
    font-weight: 700;
    color: #111;
}


.jaga-oc #main .jaga-oc-tr.jaga-oc-big .jaga-oc-v{
    color: var(--jaga-oc-accent);
}


.jaga-oc #main .jaga-oc-dl{
    display: block;
    margin: 0;
    font-size: 14px;
}


.jaga-oc #main .jaga-oc-dl dt{
    display: block;
    margin: 12px 0 0;
    font-size: 11.5px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #6e6e6e;
    font-weight: 600;
}


.jaga-oc #main .jaga-oc-dl dt:first-child{
    margin-top: 0;
}


.jaga-oc #main .jaga-oc-dl dd{
    display: block;
    margin: 3px 0 0;
    color: #1f1f1f;
    line-height: 20px;
}


.jaga-oc #main .jaga-oc-dl dd em{
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    font-style: normal;
    line-height: 18px;
    color: #616161;
}


.jaga-oc #main .jaga-oc-addr{
    display: block;
    font-size: 14px;
    line-height: 21px;
    color: #2e2e2e;
}


.jaga-oc #main .jaga-oc-same{
    display: block;
    color: #6e6e6e;
}


.jaga-oc #main .jaga-oc-btns{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}


.jaga-oc #main .jaga-oc-btns a.jaga-oc-btn-p,
.jaga-oc #main .jaga-oc-btns a.jaga-oc-btn-s{
    display: block;
    flex: 1 1 140px;
    padding: 11px 14px;
    border-radius: 5px;
    text-align: center;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
}


.jaga-oc #main .jaga-oc-btns a.jaga-oc-btn-p{
    background: var(--jaga-oc-accent);
    color: #fff;
}


.jaga-oc #main .jaga-oc-btns a.jaga-oc-btn-s{
    background: #fff;
    color: #3d3d3d;
    border: 1px solid #d8d8dc;
}

@media (max-width: 767px) {
    .jaga-oc .jaga-oc-hero,
    .jaga-oc #main .jaga-oc-hero {
        padding: 18px 16px;
        gap: 14px;
    }

    .jaga-oc .jaga-oc-htx h1,
    .jaga-oc #main .jaga-oc-htx h1 {
        font-size: 21px;
        line-height: 27px;
    }

    .jaga-oc .jaga-oc-ref,
    .jaga-oc #main .jaga-oc-ref {
        margin-left: 0;
        width: 100%;
    }

    .jaga-oc .jaga-oc-note,
    .jaga-oc .jaga-oc-card,
    .jaga-oc #main .jaga-oc-note,
    .jaga-oc #main .jaga-oc-card {
        padding-left: 16px;
        padding-right: 16px;
    }
}

/* ------------------------------------------------- hlavne menu */
/*
 * Vsetko je ohranicene na .jaga-menu (triedu pridava skript) a na #amegamenu,
 * co je pocitacova verzia menu. Mobilne menu (#mobile-amegamenu) sa nemeni.
 * Selektory maju zamerne vyssiu specificitu, nez pravidla temy.
 *
 * Pozor: panel (.adropdown) je absolutne umiestneny voci polozke menu a modul
 * mu dopocitava "left" v prehliadaci. Preto sa na .amenu-item nesmie menit
 * position ani vonkajsie okraje - panel by sa posunul mimo obrazovku.
 */

/* 1. Uzsie rozostupy - lista ma pevnu sirku 730 px a sedem poloziek
      sa do nej pri povodnych 18 px po bokoch uz nezmesti.
      Na jagashop.at je navyse na liste 40 px odsadenia zlava a nemecke
      nazvy su dlhsie, preto sa uberá aj tam. Po zmene ostava na
      najtesnejsom obchode este vyse 50 px rezervy. */
/* Ruzova z loga obchodu. Na jednom mieste, nech sa da zmenit naraz. */
.jaga-menu #amegamenu {
    --jaga-menu-accent: #dd3499;
}

.jaga-menu #amegamenu .anav-top {
    padding-left: 12px;
}

.jaga-menu #amegamenu .anav-top .amenu-item .amenu-link {
    padding-left: 10px;
    padding-right: 10px;
}

.jaga-menu #amegamenu.fixed-menu .anav-top .amenu-item .amenu-link {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* 2. Podkategorie prestavaju byt schovane. Pravidlo plati aj vtedy, keby
      tema triedu "collapsed" po nas znovu pridala. */
.jaga-menu #amegamenu .category-tree-menu .category-item.collapsed > .category-item {
    display: block;
}

.jaga-menu #amegamenu .category-tree-menu .category-item.collapsed > .category-item.level-3 {
    display: inline-block;
}

.jaga-menu #amegamenu .adropdown .collapse-icons {
    display: none;
}

/* 3. Skupina sa musi ukladat pod seba. Tema to ma nastavene len pre
      panely acontent-1 a acontent-2; pri acontent-5 by sa podkategorie
      rozliali do riadku a panel by prerastol sirku obrazovky. */
.jaga-menu #amegamenu .adropdown .category-item.level-1 {
    flex-direction: column;
    margin: 0 0 16px;
}

/* Uroven 2 je blok, nie flex - vdaka tomu sa pod nou vedia polozky
   tretej urovne rozliat do riadku namiesto odsadeneho stlpca. */
.jaga-menu #amegamenu .adropdown .category-item.level-2 {
    display: block;
    margin: 0;
}

/* 4. Vyrovnane stlpce.
      Panel nema urcenu sirku - je absolutne umiestneny a sirku si berie
      podla obsahu. Preto sa stlpce NEROBIA cez column-count: pri sirke
      podla obsahu je to kruhove a vysledok sa neda predvidat; navyse modul
      menu paneli pri malej obrazovke nastavuje pevnu vysku a viacstlpcovy
      obsah by sa vtedy lamal do stlpcov vpravo, teda mimo panel.

      Namiesto toho skript rozdeli bloky do troch skutocnych stlpcov (rovnako
      sirokych ako doteraz), takze sirka panelu ostava presne taka, aka bola.
      Medzera medzi stlpcami je odsadenie blokov - nastavujeme si ho sami,
      nech nezavisi na teme. */
.jaga-menu #amegamenu .adropdown .jaga-menu-col,
.jaga-menu #amegamenu .adropdown .jaga-menu-all {
    box-sizing: border-box;
}

.jaga-menu #amegamenu .adropdown.jaga-cols-1 .jaga-menu-col {
    width: 100%;
}

.jaga-menu #amegamenu .adropdown.jaga-cols-2 .jaga-menu-col {
    width: 50%;
}

.jaga-menu #amegamenu .adropdown.jaga-cols-3 .jaga-menu-col {
    width: 33.3333%;
}

.jaga-menu #amegamenu .adropdown .jaga-menu-col > .dropdown-content {
    width: 100%;
    margin: 0;
    padding-left: 15px;
    padding-right: 15px;
}

/* Zaloha pre pripad, ze by sa stlpce nepodarilo vytvorit: bloky ostavaju
   priamymi detmi panelu a plati povodne delenie na tretiny. */
.jaga-menu #amegamenu .adropdown.jaga-cols-1 > .dropdown-content {
    width: 100%;
}

.jaga-menu #amegamenu .adropdown.jaga-cols-2 > .dropdown-content {
    width: 50%;
}

.jaga-menu #amegamenu .adropdown.jaga-cols-3 > .dropdown-content {
    width: 33.3333%;
}

/* 5. Nadpis skupiny: tucny, s kratkou farebnou linkou namiesto sedej ciary
      cez cely stlpec. */
.jaga-menu #amegamenu .adropdown .category-item.level-1 > .category-title {
    position: relative;
    margin: 0 0 11px;
    padding-bottom: 9px;
    border-bottom: 0;
    font-size: 12.5px;
    line-height: 17px;
    font-weight: 700;
    letter-spacing: .07em;
}

.jaga-menu #amegamenu .adropdown .category-item.level-1 > .category-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 26px;
    height: 3px;
    border-radius: 2px;
    background: var(--jaga-menu-accent, #dd3499);
}

.jaga-menu #amegamenu .adropdown .category-title > a {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.jaga-menu #amegamenu .adropdown .category-item.level-1 > .category-title > a {
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #1a1a1e;
}

/* 6. Podkategorie ako kompaktny zoznam. */
.jaga-menu #amegamenu .adropdown .category-item.level-2 > .category-title,
.jaga-menu #amegamenu .adropdown .category-item.level-2 > .h5 {
    margin: 0;
    padding: 3px 0;
    line-height: 18px;
}

.jaga-menu #amegamenu .adropdown .category-item.level-2 > .category-title > a,
.jaga-menu #amegamenu .adropdown .category-item.level-2 > .h5 > a {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    color: #5a5a62;
}

.jaga-menu #amegamenu .adropdown .category-item.level-2 > .category-title > a:hover,
.jaga-menu #amegamenu .adropdown .category-item.level-2 > .h5 > a:hover {
    color: var(--jaga-menu-accent, #dd3499);
}

/* 7. Tretia uroven ako male stitky. Odsadeny zoznam pod polozkou vyzeral
      ako chyba v zarovnani, nie ako zamer. */
.jaga-menu #amegamenu .adropdown .category-item.level-3 {
    display: inline-block;
    vertical-align: top;
    margin: 2px 4px 2px 0;
}

/* Odsadenie zlava hovori, ze stitky patria k polozke nad nimi, nie pod. */
.jaga-menu #amegamenu .adropdown .category-item.level-2 > .category-item.level-3:first-of-type {
    margin-left: 10px;
}

.jaga-menu #amegamenu .adropdown .category-item.level-2.has-children {
    padding-bottom: 6px;
}

.jaga-menu #amegamenu .adropdown .category-item.level-3 > .category-title,
.jaga-menu #amegamenu .adropdown .category-item.level-3 > .h5 {
    margin: 0;
    padding: 0;
    line-height: 1;
}

.jaga-menu #amegamenu .adropdown .category-item.level-3 > .category-title > a,
.jaga-menu #amegamenu .adropdown .category-item.level-3 > .h5 > a {
    display: inline-block;
    padding: 5px 9px;
    border: 1px solid #dcdce3;
    border-radius: 20px;
    background: #f5f5f7;
    font-size: 11px;
    line-height: 1;
    font-weight: 500;
    color: #5f5f68;
}

.jaga-menu #amegamenu .adropdown .category-item.level-3 > .category-title > a:hover,
.jaga-menu #amegamenu .adropdown .category-item.level-3 > .h5 > a:hover {
    border-color: var(--jaga-menu-accent, #dd3499);
    color: var(--jaga-menu-accent, #dd3499);
}

/* 8. Rozbalene panely su vyssie. Nech sa vzdy zmestia na obrazovku,
      aby sa zakaznik dostal aj na posledny odkaz. */
.jaga-menu #amegamenu .adropdown {
    max-height: calc(100vh - 150px);
    overflow-y: auto;

    /* Panel je flex s zalamovanim. Ked mu modul menu nastavi vacsiu pevnu
       vysku, nez je obsah, zvysok vysky by sa rozdelil medzi riadky a patka
       by odplavala do stredu prazdneho miesta. */
    align-content: flex-start;
    border-top: 3px solid var(--jaga-menu-accent, #dd3499);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .14);
}

/* Dekoracna vrstva panelu nema urcene left/top, takze stoji az za odsadenim
   panelu (25 px zlava, 15 px zhora), pritom je siroka a vysoka 100 %. Panel
   tak pretekal o tych 25 px do sirky a mohol ukazat vodorovny posuvnik.
   Vrstva je prazdna (ziadna farba ani obrazok), len ju treba prisat na roh. */
.jaga-menu #amegamenu .adropdown .dropdown-bgimage {
    left: 0;
    top: 0;
}

/* 9. Patka panelu: pocet podkategorii vlavo, tlacidlo vpravo. */
.jaga-menu #amegamenu .adropdown .jaga-menu-all {
    display: flex;
    flex: 0 0 100%;
    width: 100%;
    clear: both;
    align-items: center;

    /* Uzke panely (444 px) maju na patku malo miesta. Nech sa radsej tlacidlo
       zalomi pod pocet, nez aby roztiahlo cely panel - jeho sirku si modul
       menu odmeriava a podla nej panel posuva do stranky. */
    flex-wrap: wrap;
    gap: 8px 12px;
    margin: 2px 0 0;
    padding: 13px 15px 4px;
    border-top: 1px solid #ededf0;
}

.jaga-menu #amegamenu .adropdown .jaga-menu-all .jaga-menu-count {
    min-width: 0;
    font-size: 12px;
    line-height: 16px;
    color: #6f6f79;
}

.jaga-menu #amegamenu .adropdown .jaga-menu-all > a {
    flex: 0 1 auto;
    min-width: 0;
    margin-left: auto;
    padding: 10px 18px;
    border-radius: 22px;
    background: var(--jaga-menu-accent, #dd3499);
    font-size: 11.5px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
}

.jaga-menu #amegamenu .adropdown .jaga-menu-all > a::after {
    content: " \2192";
}

.jaga-menu #amegamenu .adropdown .jaga-menu-all > a:hover {
    background: #c22a85;
    color: #fff;
}

/* 10. Otvorena polozka je vidiet aj na liste. Podciarknutie je na odkaze,
       ktory uz od temy ma position: relative - na polozke sa position menit
       nesmie, panel sa umiestnuje voci nej. */
.jaga-menu #amegamenu .anav-top .amenu-item > .amenu-link::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 3px;
    background: var(--jaga-menu-accent, #dd3499);
    opacity: 0;
    transition: opacity .15s ease;
}

.jaga-menu #amegamenu .anav-top .amenu-item:hover > .amenu-link::after,
.jaga-menu #amegamenu .anav-top .amenu-item:focus-within > .amenu-link::after {
    opacity: 1;
}

/* 11. Barber - vlastny svet za oddelovacom. Oddelovac je na odkaze, nie na
       polozke, aby sa nezmenil bod, voci ktoremu sa umiestnuje panel. */
.jaga-menu #amegamenu .anav-top .amenu-item.jaga-mi-barber > .amenu-link {
    border-left: 1px solid rgba(255, 255, 255, .22);
    padding-left: 16px;
    color: #e8c07d;
    font-weight: 600;
    letter-spacing: .1em;
}

.jaga-menu #amegamenu .anav-top .amenu-item.jaga-mi-barber > .amenu-link:hover {
    color: #ffd79a;
}

.jaga-menu #amegamenu .anav-top .amenu-item.jaga-mi-barber > .amenu-link::after {
    left: 16px;
    background: #e8c07d;
}

/* Tmavy panel Barbera - farbu pozadia nastavuje samotny modul menu. */
.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown {
    border-top-color: #e8c07d;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-1 > .category-title::after {
    background: #e8c07d;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-1 > .category-title > a {
    color: #f2e6cf;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-2 > .category-title > a,
.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-2 > .h5 > a {
    color: #b4b4bb;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-2 > .category-title > a:hover,
.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-2 > .h5 > a:hover {
    color: #ffd79a;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-3 > .category-title > a,
.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-3 > .h5 > a {
    border-color: #33333a;
    background: #1d1d22;
    color: #b4b4bb;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-3 > .category-title > a:hover,
.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .category-item.level-3 > .h5 > a:hover {
    border-color: #e8c07d;
    color: #ffd79a;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .jaga-menu-all {
    border-top-color: #33333a;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .jaga-menu-all .jaga-menu-count {
    color: #a9a9b2;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .jaga-menu-all > a {
    background: #e8c07d;
    color: #1a1a1e;
}

.jaga-menu #amegamenu .amenu-item.jaga-mi-barber .adropdown .jaga-menu-all > a:hover {
    background: #ffd79a;
    color: #1a1a1e;
}

/* ------------------------------------------------- sekcia "O nas" na titulke */
/*
 * Titulka koncila dvoma slabymi blokmi - "O nas" a sivym newsletterom - a
 * medzi nimi prazdnym miestom. Skript z nich robi jeden tmavy zaverecny pas
 * a tieto pravidla ho oblekaju. Vsetko je ohranicene na .jaga-ab, teda na
 * blok, ktoremu skript triedu prida; bez skriptu plati stary vzhlad temy.
 */
.jaga-ab {
    --jaga-ab-accent: #dd3499;

    box-sizing: border-box;
    padding: 48px 52px;
    border-radius: 16px;
    background-color: #141416;
    background-image: radial-gradient(900px 340px at 88% -10%, rgba(221, 52, 153, .20), transparent 60%);
    color: #fff;
}

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

/*
 * Tema cely blok "O nas" centruje (.an_abous_us { text-align: center }).
 * Pas ma text zarovnany vlavo - dve triedy naraz prebiju temu bez !important.
 */
.an_abous_us.jaga-ab,
.jaga-ab .jaga-ab-story,
.jaga-ab .jaga-ab-stat,
.jaga-ab .block_newsletter,
.jaga-ab .block_newsletter-desc,
.jaga-ab .jaga-ab-gdpr {
    text-align: left;
}

/*
 * Nemecke slozeniny ("Friseurbedarfsgrosshandelsunternehmen...") sa na uzkej
 * obrazovke nezalomia samy a vytlacili by cely pas do strany. Preto v pase
 * povolujeme zlomenie slova - inde na webe to nechavame tak, ako je.
 */
.jaga-ab .jaga-ab-kick,
.jaga-ab .jaga-ab-h,
.jaga-ab .jaga-ab-p,
.jaga-ab .jaga-ab-cta,
.jaga-ab .jaga-ab-stat b,
.jaga-ab .jaga-ab-stat span,
.jaga-ab .block_newsletter h2,
.jaga-ab .block_newsletter p,
.jaga-ab .jaga-ab-gdpr label {
    overflow-wrap: break-word;
    word-break: break-word;
}

.jaga-ab-top {
    display: flex;
    gap: 56px;
    align-items: stretch;
}

.jaga-ab-story {
    flex: 1 1 auto;
    min-width: 0;
}

.jaga-ab-logo {
    display: block;
    width: auto;
    height: 42px;
    margin: 0 0 22px;
}

.jaga-ab .jaga-ab-kick {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-size: 11px;
    line-height: 1.35;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--jaga-ab-accent, #dd3499);
}

.jaga-ab .jaga-ab-kick::after {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 2px;
    background: var(--jaga-ab-accent, #dd3499);
    opacity: .55;
}

.jaga-ab .jaga-ab-h {
    margin: 0 0 16px;
    font-size: 28px;
    line-height: 1.24;
    font-weight: 700;
    letter-spacing: -.01em;
    text-transform: none;
    color: #fff;
}

.jaga-ab .jaga-ab-p {
    margin: 0 0 12px;
    font-size: 15px;
    line-height: 1.75;
    font-weight: 400;
    color: #a7a7b0;
}

.jaga-ab .jaga-ab-p b,
.jaga-ab .jaga-ab-p strong {
    font-weight: 600;
    color: #fff;
}

.jaga-ab .jaga-ab-p a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.jaga-ab .jaga-ab-p a:hover,
.jaga-ab .jaga-ab-p a:focus {
    color: var(--jaga-ab-accent, #dd3499);
}

.jaga-ab .jaga-ab-cta {
    display: inline-block;
    margin-top: 16px;
    padding: 14px 26px;
    border-radius: 26px;
    background: var(--jaga-ab-accent, #dd3499);
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
}

.jaga-ab .jaga-ab-cta::after {
    content: " \2192";
}

.jaga-ab .jaga-ab-cta:hover,
.jaga-ab .jaga-ab-cta:focus {
    background: #ea52ab;
    color: #fff;
    text-decoration: none;
}

.jaga-ab-stats {
    flex: 0 0 340px;
    align-self: flex-start;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

/* Ked sa niektore cislo nepodari zistit, nech posledna dlazdica nevisi sama. */
.jaga-ab-stats > .jaga-ab-stat:nth-child(3):last-child {
    grid-column: 1 / -1;
}

.jaga-ab-stat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px 18px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;
    background: rgba(255, 255, 255, .045);
}

.jaga-ab-stat b {
    display: block;
    font-size: 27px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -.02em;
    color: #fff;
}

.jaga-ab-stat span {
    display: block;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.45;
    color: #9a9aa4;
}

.jaga-ab-hr {
    height: 1px;
    margin: 40px 0 30px;
    background: rgba(255, 255, 255, .10);
}

/* Newsletter je presunuty cely - prepisujeme len jeho vzhlad. */
.jaga-ab .block_newsletter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px 48px;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;

    /* Modul si so sebou moze niest triedy mriezky (col-lg-6 a spol.).
       Samotna sirka 100 % by ich neprebila - max-width ano. */
    width: 100%;
    max-width: none;
    flex-basis: 100%;
    float: none;
}

.jaga-ab .block_newsletter > .row {
    margin-left: 0;
    margin-right: 0;
}

/* Hlaska modulu po prihlaseni (aj chybova) ma byt cez celu sirku. */
.jaga-ab .block_newsletter .alert {
    flex: 0 0 100%;
    width: 100%;
    margin: 0;
    padding: 12px 16px;
    border: 0;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5;
}

/*
 * Basis "auto" by znamenal sirku celeho textu - popis newslettera je dlhy,
 * takze by formular spadol pod nadpis. Pevny mensi basis ich necha vedla seba
 * a text sa zalomi.
 */
.jaga-ab .block_newsletter-desc {
    flex: 1 1 260px;
    min-width: 0;
}

.jaga-ab .block_newsletter .block-newsletter-title,
.jaga-ab .block_newsletter h2 {
    margin: 0 0 6px;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: #fff;
}

.jaga-ab .block_newsletter-desc p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: #9a9aa4;
}

.jaga-ab .block_newsletter-form {
    flex: 0 0 470px;
}

.jaga-ab .block_newsletter form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.jaga-ab .block_newsletter .input-wrapper {
    flex: 1 1 auto;
    min-width: 0;
}

.jaga-ab .block_newsletter input[type="text"],
.jaga-ab .block_newsletter input[type="email"] {
    width: 100%;
    height: 50px;
    padding: 0 18px;
    border: 1px solid #33333a;
    border-radius: 25px;
    background: #1d1d22;
    font-size: 14px;
    color: #fff;
}

.jaga-ab .block_newsletter input[type="text"]::placeholder,
.jaga-ab .block_newsletter input[type="email"]::placeholder {
    color: #7a7a84;
}

.jaga-ab .block_newsletter input[type="text"]:focus,
.jaga-ab .block_newsletter input[type="email"]:focus {
    border-color: var(--jaga-ab-accent, #dd3499);
}

/* Na tmavom pozadi by systemovy ramcek nebolo vidiet - kreslime vlastny. */
.jaga-ab a:focus-visible,
.jaga-ab button:focus-visible,
.jaga-ab input:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.jaga-ab .block_newsletter button[type="submit"],
.jaga-ab .block_newsletter .btn-primary {
    flex: 0 0 auto;
    float: none;
    height: 50px;
    padding: 0 28px;
    border: 0;
    border-radius: 25px;
    background: var(--jaga-ab-accent, #dd3499);
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
}

.jaga-ab .block_newsletter button[type="submit"]:hover,
.jaga-ab .block_newsletter .btn-primary:hover {
    background: #ea52ab;
    color: #fff;
}

/* Suhlas so spracovanim udajov - presunuty z pätky dovnutra formulara. */
.jaga-ab .gdpr-newsletter,
.jaga-ab .jaga-ab-gdpr {
    flex: 0 0 100%;
    width: 100%;
}

.jaga-ab .jaga-ab-gdpr .container,
.jaga-ab .jaga-ab-gdpr .row,
.jaga-ab .jaga-ab-gdpr [class^="col-"],
.jaga-ab .jaga-ab-gdpr [class*=" col-"] {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.jaga-ab .jaga-ab-gdpr label {
    display: block;
    margin: 2px 0 0;

    /* Zalomeny druhy riadok ma zacinat pod textom, nie pod zaskrtavatkom. */
    padding-left: 25px;
    text-indent: -23px;
    font-size: 12.5px;
    line-height: 1.55;
    font-weight: 400;
    color: #9a9aa4;
}

/*
 * Tema zaskrtavatko schovava (opacity: 0, position: absolute) a namiesto neho
 * kresli vlastny stvorcek. Kym bolo pole mimo formulara, nevadilo to. Vnutri
 * formulara je ale povinne - a prehliadac vie hlasku ukazat len pri poli,
 * ktore je naozaj vidiet. Preto tu vraciame skutocne zaskrtavatko.
 */
.jaga-ab .jaga-ab-gdpr input[type="checkbox"] {
    position: static;
    width: 15px;
    height: 15px;
    margin: 0 8px 0 0;
    opacity: 1;
    vertical-align: -2px;
    accent-color: var(--jaga-ab-accent, #dd3499);
}

.jaga-ab .jaga-ab-gdpr input[type="checkbox"] + span {
    display: none;
}

.jaga-ab .jaga-ab-gdpr a {
    color: #b4b4bb !important;
    text-decoration: underline;
}

/* Ked sa obsah nedal rozlozit, aspon nech je v pisme celeho webu. */
.jaga-ab-plain .an_abous_us-text-wrap,
.jaga-ab-plain .an_abous_us-text-wrap p {
    font-family: inherit;
    font-size: 15px;
    line-height: 1.75;
}

@media (max-width: 991px) {
    .jaga-ab {
        padding: 32px 22px;
    }

    .jaga-ab-top {
        flex-direction: column;
        gap: 30px;
    }

    .jaga-ab-stats {
        flex: 1 1 auto;
        width: 100%;
    }

    .jaga-ab .block_newsletter {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
    }

    /*
     * V stlpci plati flex-basis na vysku - 260px by z popisu urobilo prazdny
     * blok vysoky ako dlan. Preto sa tu basis vracia na obsah.
     */
    .jaga-ab .block_newsletter-desc,
    .jaga-ab .block_newsletter-form {
        flex: 0 0 auto;
    }
}

@media (max-width: 575px) {
    .jaga-ab .jaga-ab-h {
        font-size: 22px;
    }

    /* Na mobile nema zmysel male tlacidlo vpravo - cely riadok sa lepsie trafi. */
    .jaga-ab .block_newsletter button[type="submit"],
    .jaga-ab .block_newsletter .btn-primary {
        flex: 1 1 100%;
        float: none;
    }
}

@media (max-width: 359px) {
    .jaga-ab-stats {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
 * Pas pod hlavickou (#custom-text) - "vlasova linka"
 * ------------------------------------------------------------
 * Modul ps_customtext vypisuje vetu s natvrdo zapisanymi
 * inline stylmi (color, background-color, font-size). Inline
 * styl porazi kazdy selektor, takze sa musi prebit cez
 * !important - inac by ostala 28px tucna ruzova.
 *
 * Cele je to v CSS, ktore sa nacita v hlavicke stranky, takze
 * pas je spravny uz pri prvom vykresleni a nikde nepreblikne.
 * ============================================================ */
/* ============================================================
 * PAS POD HLAVICKOU - "Velkoobchod pre nechty, ..."
 *
 * Centrovanie a vysku drzi obal #custom-text (flex), samotny
 * nadpis ostava normalny blok. Je to dolezite: keby bol flexom
 * nadpis, prehliadac by zahodil medzeru medzi <b>Velkoobchod</b>
 * a zvyskom vety a vysli by slova zlepene.
 *
 * Temu nastavuje #custom-text padding 3.125rem a neskorsie
 * pravidlo 0.5rem (= 7px pri root 14px) plus margin-bottom, a
 * v zlucenom balicku prichadza ZA tymto suborom - preto
 * !important, inac by pas nemal 36px ale 50px.
 * ============================================================ */
#custom-text {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 36px;
    padding: 0 16px !important;
    margin-bottom: 0 !important;
    background: #fff;
}

#custom-text h1,
#custom-text p {
    display: block;
    margin: 0;
    padding: 0;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.35;
    color: #55555e;
    letter-spacing: .13em;
    text-transform: uppercase;
    text-align: center;
}

/*
 * Vlasova linka pod textom: ruzova v strede, do stratena na
 * oboch koncoch. Jedina ozdoba celeho pasu.
 */
#custom-text::after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 420px;
    max-width: 70%;
    height: 1px;
    background: linear-gradient(90deg,
        rgba(221, 52, 153, 0) 0%,
        #dd3499 50%,
        rgba(221, 52, 153, 0) 100%);
    transform: translateX(-50%);
    content: "";
}

/*
 * Inline farby a velkosti z editora sa zahodia. Vynimka je
 * <b>/<strong> okolo prveho slova - to ostava ruzove.
 */
#custom-text h1 span,
#custom-text p span,
#custom-text h1 font,
#custom-text p font {
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    background: none !important;
    background-color: transparent !important;
}

#custom-text h1 b,
#custom-text h1 strong,
#custom-text p b,
#custom-text p strong {
    font-size: inherit !important;
    font-weight: 700 !important;
    color: #dd3499 !important;
    background: none !important;
    background-color: transparent !important;
}

/*
 * Ked je cela veta este v starom zapise (jeden <strong> okolo
 * vsetkeho), nesmie zruzoviet cela - vtedy plati siva.
 */
#custom-text h1 > span > strong,
#custom-text p > span > strong {
    color: inherit !important;
    font-weight: 500 !important;
}

#custom-text h1 > span > strong > b,
#custom-text h1 > span > strong > strong,
#custom-text p > span > strong > b,
#custom-text p > span > strong > strong {
    color: #dd3499 !important;
    font-weight: 700 !important;
}

@media (max-width: 767px) {
    #custom-text {
        min-height: 34px;
        padding: 4px 14px !important;
    }

    #custom-text h1,
    #custom-text p {
        font-size: 10.5px;
        letter-spacing: .1em;
    }

    #custom-text::after {
        max-width: 84%;
    }
}

/* ============================================================
 * ZORADENIE V BLOKU "NOVINKY / NAJPREDAVANEJSIE" NA TITULKE
 *
 * Tema tu necha systemovu rozbalovacku tak, ako ju vykresli
 * prehliadac. Skript vedla nej postavi tri tlacidla a doplni
 * obalu triedu .jaga-hp-done - az potom sa povodna rozbalovacka
 * schova. Ked by skript nedobehol, ostane presne taka, aka je
 * dnes, a zakaznik o nic nepride.
 * ============================================================ */
.an_homeproducts-sort.jaga-hp-done > span,
.an_homeproducts-sort.jaga-hp-done > select {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.an_homeproducts-sort.jaga-hp-done {
    margin-left: auto;
}

.jaga-hp-sort {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
}

.jaga-hp-sort b {
    margin-right: 12px;
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.2;
    color: #9a9aa4;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.jaga-hp-sort .jaga-hp-btn {
    box-sizing: border-box;
    margin: 0;
    padding: 7px 13px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    color: #70707a;
    letter-spacing: .05em;
    text-transform: uppercase;
    background: none;
    border: 1px solid transparent;
    border-radius: 2px;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
    -webkit-appearance: none;
    appearance: none;
}

.jaga-hp-sort .jaga-hp-btn:hover,
.jaga-hp-sort .jaga-hp-btn:focus {
    color: #1a1a1e;
    border-color: #e6e6ea;
    text-decoration: none;
}

.jaga-hp-sort .jaga-hp-btn:focus-visible {
    outline: 2px solid #dd3499;
    outline-offset: 1px;
}

/* Zvolene zoradenie. Dve pravidla: druhe je specifickejsie, aby
   prebilo pripadne tlacidlove pravidla temy typu "#content button". */
.jaga-hp-sort .jaga-hp-btn.jaga-hp-on,
.an_homeproducts .jaga-hp-sort .jaga-hp-btn.jaga-hp-on {
    color: #fff !important;
    background: #dd3499 !important;
    border-color: #dd3499 !important;
}

@media (max-width: 767px) {
    .an_homeproducts-sort.jaga-hp-done {
        width: 100%;
        margin-left: 0;
    }

    .jaga-hp-sort {
        justify-content: flex-start;
    }

    .jaga-hp-sort b {
        width: 100%;
        margin: 0 0 6px;
    }

    .jaga-hp-sort .jaga-hp-btn {
        padding: 7px 11px;
        font-size: 11.5px;
    }
}

/* ==================================================================
   Prepinac "Novinky / Najpredavanejsie produkty" na titulke
   ==================================================================

   Pismo Cinzel lezi priamo v module - nie na serveroch Google. Nic sa
   nesahuje na cudzi server, takze z toho nevznika ziadna otazka okolo
   GDPR a stranka nezavisi na cudzom vypadku. Nacitavaju sa dva subory,
   dokopy 22 kB, a len pre tieto dva napisy.

   Cesta je zamerne absolutna od korena. PrestaShop spaja CSS do jedneho
   baliku v adresari temy, kde by relativna cesta k modulu uz ukazovala
   inam. Vsetky tri obchody bezia na tom istom serveri, takze jedna
   cesta plati pre .sk, .cz aj .at.

   font-display: swap znamena, ze napis je citatelny hned v Montserrate
   a po dotiahnuti pisma sa prekresli. Nikdy nie je prazdne miesto.

   Cinzel je pod licenciou SIL Open Font License 1.1, jej plne znenie je
   v tom istom adresari (LICENSE-Cinzel-OFL.txt).
   ------------------------------------------------------------------ */
@font-face {
    font-family: 'JagaCinzel';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/modules/jagacheckout/views/fonts/cinzel-400-latext.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'JagaCinzel';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/modules/jagacheckout/views/fonts/cinzel-400-lat.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Tema kresli za zalozkami sivu linku cez celu sirku
   (.an_homeproducts-tabs-list::before) a nazvy na nej lezia na bielom
   podklade. V novom vzhlade linku nahradzaju dve ruzove ciarky pod
   otvorenou zalozkou, takze povodna sa skryva. */
.an_homeproducts-tabs .an_homeproducts-tabs-list::before {
    display: none;
}

/* Zaloha je zamerne Montserrat - kym sa pismo dotiahne, napis vyzera
   presne tak, ako vyzeral doteraz.

   Farba ma !important preto, ze tema si ju sama takto vynucuje
   (.an_homeproducts-tab { color: ... !important }) a bez toho by nase
   pravidlo neplatilo. Vsetko ostatne prebijame len specifickostou. */
.an_homeproducts-tabs-list .an_homeproducts-tab {
    position: relative;
    margin: 0 22px;
    padding: 0 2px 15px;
    font-family: 'JagaCinzel', 'Montserrat', serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .13em;
    text-transform: uppercase;
    white-space: nowrap;
    color: #a0a0aa !important;
    transition: color .18s ease;
}

.an_homeproducts-tabs-list .an_homeproducts-tab:hover,
.an_homeproducts-tabs-list .an_homeproducts-tab:focus {
    color: #55555e !important;
    text-decoration: none;
}

.an_homeproducts-tabs-list .an_homeproducts-tab:focus-visible {
    outline: 2px solid #dd3499;
    outline-offset: 3px;
}

/* Otvorena zalozka: cierny text a pod nim dve ruzove linky nad sebou -
   dlhsia hore, kratsia dole. Kresli ich sam prvok, takze v stranke
   nepribuda ziadna dalsia znacka. */
.an_homeproducts-tabs-list .an_homeproducts-tab.active,
.an_homeproducts-tabs-list .an_homeproducts-tab.active:hover,
.an_homeproducts-tabs-list .an_homeproducts-tab.active:focus {
    color: #1a1a1e !important;
}

.an_homeproducts-tabs-list .an_homeproducts-tab.active::after {
    position: absolute;
    bottom: 4px;
    left: 50%;
    width: 58px;
    height: 1px;
    background: #dd3499;
    transform: translateX(-50%);
    content: "";
}

.an_homeproducts-tabs-list .an_homeproducts-tab.active::before {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 20px;
    height: 1px;
    background: #dd3499;
    transform: translateX(-50%);
    content: "";
}

/* Na mobile sa obe zalozky vedla seba nezmestia - "Najpredavanejsie
   produkty" by sa zalamovali v polovici slova. Preto tam kazda dostane
   vlastny riadok; ruzove ciarky ostavaju v strede pod nazvom. */
@media (max-width: 767px) {
    .an_homeproducts-tabs-list .an_homeproducts-tab {
        display: block;
        margin: 0 auto 14px;
        padding: 0 2px 12px;
        font-size: 16px;
        letter-spacing: .1em;
    }

    .an_homeproducts-tabs-list .an_homeproducts-tab:last-child {
        margin-bottom: 0;
    }

    .an_homeproducts-tabs-list .an_homeproducts-tab.active::after {
        bottom: 3px;
        width: 42px;
    }

    .an_homeproducts-tabs-list .an_homeproducts-tab.active::before {
        width: 15px;
    }
}

/* ==================================================================
   Bocne menu na mobile
   ==================================================================

   Na mobile je toto jedine menu, ktore zakaznik ma - hlavne menu z
   titulky sa do sirky telefonu nezmesti. Preto tu plati to iste
   pravidlo ako na titulke: jeden odstup zlava, jedna velkost pisma,
   jasne oddelovace a dost velke plochy na prst (48-50 px).

   Vsetko je zavesene na triede .jaga-mm, ktoru na obal dava skript.
   Ked by skript nedobehol, menu ostane presne take, ake ho kresli
   tema - nic sa nerozpadne.
   ------------------------------------------------------------------ */
@media (max-width: 991px) {

/* --- panel ----------------------------------------------------- */
#mobile_top_menu_wrapper.jaga-mm {
    display: flex;
    flex-direction: column;
    width: 325px;
    max-width: 88%;
    padding: 0;
}

.jaga-mm .mobile-menu-header {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    min-height: 56px;
    padding: 0 10px;
    border-bottom: 1px solid #ededf1;
}

.jaga-mm .megamenu_mobile-btn-back,
.jaga-mm .megamenu_mobile-btn-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    cursor: pointer;
}

.jaga-mm .jaga-mm-title {
    margin-left: 4px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #1a1a1e;
}

/* Poradie blokov: kategorie, ucet, oblubene, kontakt a dole jazyk.
   Tema ich ma v inom poradi a patku nikde nedrzi pri spodku. */
.jaga-mm .js-top-menu-bottom {
    display: flex;
    flex: 1 1 auto;
}

.jaga-mm .mobile-menu-fixed {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    width: 100%;
}

.jaga-mm .jaga-mm-lab.is-cats { order: 0; }
.jaga-mm .mobile-amega-menu { order: 1; }
.jaga-mm .jaga-mm-lab.is-acc { order: 2; }
.jaga-mm #_mobile_user_info { order: 3; }
.jaga-mm #_mobile_an_wishlist-nav { order: 4; }
.jaga-mm #_mobile_clientservice { order: 5; }
.jaga-mm #_mobile_contactslink { order: 6; }

.jaga-mm .mobile-lang-and-cur {
    order: 7;
    margin-top: auto;
}

/* Nic z toho, co pridavame, nema byt podciarknute - na niektorych
   podstrankach tema odkazom podciarknutie vracia. */
.jaga-mm a,
.jaga-mm a:hover,
.jaga-mm a:focus {
    text-decoration: none;
}

.jaga-mm .jaga-mm-lab {
    padding: 20px 18px 8px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #a0a0aa;
}

/* --- 1. uroven: kategorie -------------------------------------- */
.jaga-mm ul.anav-mobile,
.jaga-mm ul.anav-mobile > li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.jaga-mm .mobile_item_wrapper {
    position: relative;
    border-bottom: 1px solid #f1f1f4;
}

.jaga-mm .mobile_item_wrapper > .amenu-link {
    display: flex;
    align-items: center;
    min-height: 50px;
    margin: 0;
    padding: 0 46px 0 18px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #1a1a1e;
}

.jaga-mm .mobile_item_wrapper > .amenu-link:hover,
.jaga-mm .mobile_item_wrapper > .amenu-link:focus {
    color: #dd3499;
    text-decoration: none;
}

/* Sipka vpravo otvara podmenu. Dostava celu pravu stranu riadku,
   aby sa do nej dalo trafit prstom. */
.jaga-mm .mobile_item_wrapper > .mobile-toggler {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 100%;
    margin: 0;
    padding: 0;
}

.jaga-mm .mobile-toggle-plus {
    display: none !important;
}

/* --- 2. a 3. uroven -------------------------------------------- */
/* Podmenu Barberu ma v nastaveni modulu cierne pozadie. Na mobile je
   na nom cierny text necitatelny, preto tu vsade biela. */
.jaga-mm .adropdown-mobile {
    padding: 0 !important;
    background: #fff !important;
}

.jaga-mm .adropdown-mobile .dropdown-content,
.jaga-mm .adropdown-mobile .category-tree-menu {
    padding: 0 !important;
    margin: 0 !important;
}

.jaga-mm .jaga-mm-all {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0 18px;
    border-bottom: 1px solid #f1f1f4;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #dd3499;
}

.jaga-mm .jaga-mm-all:hover,
.jaga-mm .jaga-mm-all:focus {
    color: #b82a7e;
    text-decoration: none;
}

.jaga-mm .category-item.level-1 {
    border-bottom: 1px solid #f1f1f4;
}

.jaga-mm .category-item.level-1 > .category-title {
    display: flex;
    align-items: center;
    min-height: 48px;
    margin: 0;
    padding: 0 18px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: .02em;
    text-transform: none;
    color: #1a1a1e;
}

.jaga-mm .category-item.level-1 > .category-title > a {
    flex: 1 1 auto;
    color: inherit;
}

.jaga-mm .category-item.level-1.expanded > .category-title,
.jaga-mm .category-item.level-1.expanded > .category-title > a {
    color: #dd3499;
}

/* Znamienko + / - vpravo, nie uprostred textu. */
.jaga-mm .category-item .collapse-icons {
    position: static;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin: 0 0 0 12px;
    padding: 0;
    border: 1px solid #e6e6ea;
    border-radius: 50%;
    font-size: 15px;
    font-style: normal;
    line-height: 1;
    color: #70707a;
}

.jaga-mm .category-item.level-1.expanded > .category-title > .collapse-icons {
    border-color: #dd3499;
    color: #dd3499;
}

.jaga-mm .category-item .collapse-icons i {
    font-style: normal;
}

.jaga-mm .category-item.level-2 {
    background: #fafafa;
}

.jaga-mm .category-item.level-2 > .category-title {
    margin: 0;
    padding: 11px 18px 11px 32px;
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    color: #70707a;
}

.jaga-mm .category-item.level-2 > .category-title > a {
    color: inherit;
}

/* --- ucet, oblubene, kontakt ------------------------------------ */
.jaga-mm #_mobile_user_info .dropdown-menu {
    display: block !important;
    position: static !important;
    float: none;
    min-width: 0;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
}

.jaga-mm #_mobile_user_info li {
    list-style: none;
}

.jaga-mm #_mobile_user_info button {
    display: none !important;
}

/* Tema ma tieto odkazy ako .dropdown-item a svojim pravidlom prebija nase
   odsadenie, preto tu musi byt !important - inak text zacina na okraji. */
.jaga-mm #_mobile_user_info a,
.jaga-mm #_mobile_an_wishlist-nav a,
.jaga-mm #_mobile_clientservice a,
.jaga-mm #_mobile_contactslink a {
    display: flex !important;
    align-items: center;
    /* Bez box-sizing by sa k sirke pripocitalo este odsadenie a riadok by
       vytrcal z panela - tema ho ma globalne, my sa na to nespoliehame. */
    box-sizing: border-box;
    width: 100%;
    min-height: 46px;
    margin: 0 !important;
    padding: 0 18px !important;
    border-bottom: 1px solid #f1f1f4;
    font-size: 13.5px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: #55555e;
}

/* Obaly tychto blokov maju vlastne odsadenie, takze by sa riadky
   nezarovnali s ostatnymi. */
.jaga-mm #_mobile_user_info,
.jaga-mm #_mobile_an_wishlist-nav,
.jaga-mm #_mobile_clientservice,
.jaga-mm #_mobile_contactslink,
.jaga-mm #_mobile_user_info ul,
.jaga-mm #_mobile_user_info li {
    margin: 0;
    padding: 0;
}

.jaga-mm #_mobile_user_info a:hover,
.jaga-mm #_mobile_an_wishlist-nav a:hover,
.jaga-mm #_mobile_contactslink a:hover {
    color: #dd3499;
    text-decoration: none;
}

/* --- patka: jazyk a telefon ------------------------------------- */
.jaga-mm .mobile-lang-and-cur {
    padding: 16px 18px 18px;
    background: #fbfbfc;
    border-top: 1px solid #ededf1;
}

/* Povodny prepinac jazyka je na mobile nepouzitelny - tema skryje aj
   tlacidlo aj rozbalovaciu ponuku aj nahradny <select>, takze ostane
   visiet len slovo "Jazyk:". Nahradzame ho tromi vlajkami. */
.jaga-mm .mobile-lang-and-cur .language-selector-wrapper,
.jaga-mm .mobile-lang-and-cur #_mobile_currency_selector {
    display: none !important;
}

.jaga-mm .jaga-mm-langs {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 14px;
}

.jaga-mm .jaga-mm-lang {
    display: flex;
    align-items: center;
    padding: 6px 11px;
    border: 1px solid #e6e6ea;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: none;
    color: #55555e;
}

.jaga-mm .jaga-mm-lang:hover,
.jaga-mm .jaga-mm-lang:focus {
    border-color: #dd3499;
    color: #dd3499;
    text-decoration: none;
}

.jaga-mm .jaga-mm-lang.is-on,
.jaga-mm .jaga-mm-lang.is-on:hover {
    background: #dd3499;
    border-color: #dd3499;
    color: #fff;
}

.jaga-mm .jaga-mm-lang img {
    width: 16px;
    height: 11px;
    margin-right: 7px;
}

.jaga-mm .jaga-mm-tel {
    display: block;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .02em;
    color: #1a1a1e;
}

.jaga-mm .jaga-mm-tel:hover {
    color: #dd3499;
    text-decoration: none;
}

.jaga-mm .jaga-mm-tel small {
    display: block;
    margin-bottom: 3px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #a0a0aa;
}

}

@media (max-width: 991px) {
    .jaga-mm .jaga-mm-lab.is-foot {
        padding: 0 0 9px;
    }
}

/* ===================================================================
   REGISTRACIA - vyber krajiny
   ===================================================================
   Tema ma v registracnom formulari pravidlo
       .customerform-wrapper .form-control { padding:12px 17px; height:auto }
   Vstupnemu poli to nevadi, ale <select> sa tym zmrastil na 33 px a na
   text ostalo 7 px, takze vybrana krajina nebola vidiet a zdalo sa, ze
   sa nic nevybralo. Skratka background zaroven zmazala sipku.
   Vraciame selectu rovnaku vysku ako maju ostatne polia a vlastnu sipku.
   Vo formulari adresy v ucte (#address) je vsetko v poriadku, tam
   nesiahame.

   Zamerne to NIE je pod .jaga-chk: tu triedu dopisuje nas skript az zo
   spodneho balika, takze pri pomalsom pripojeni by zakaznik chvilu videl
   zase zmrasteny riadok. Trieda .customerform-wrapper je len na prihlaseni
   a registracii, takze samotna staci a nic ine nezasiahne. Sucasne to
   znamena, ze oprava drzi aj vtedy, ked by skript vobec nenabehol.

   :not([size]):not([multiple]) tu nie je pre ozdobu. V spojenom balicku su
   dve pravidla, ktore by nas inak prebili:
       select.form-control:not([size]):not([multiple]) { height:calc(2.5rem - 2px) }
   (bootstrap, vyssia specificita - naostro dava 33 px, lebo html ma 14 px)
   a neskorsie
       .customerform-wrapper select.form-control { padding-top:0; padding-bottom:0; line-height:normal }
   (rovnaka specificita, ale je v balicku za nami). S tymito dvoma :not()
   mame o dve triedy viac ako obe a vyhravame bez !important.
   =================================================================== */
.customerform-wrapper select.form-control:not([size]):not([multiple]) {
    height: 50px;
    /* Vpravo je miesto na sipku, aby ju dlhy nazov krajiny neprekryl. */
    padding: 12px 42px 12px 17px;
    line-height: 24px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%2370707a' d='M0.7 0h8.6L5 5.3z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 17px center;
    background-size: 10px 6px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    max-width: 100%;
    cursor: pointer;
}

/* Rovnaky ram pri kliknuti ako maju ostatne polia formulara. */
.customerform-wrapper select.form-control:not([size]):not([multiple]):focus {
    border-color: #1a1a1e;
    outline: none;
}

/* Uvodna polozka "-- vyberte prosim --" ma byt svetlejsia ako skutocna
   zvolena krajina, aby bolo na prvy pohlad vidno, ci uz je vybrate.
   (Na macOS si zoznam kresli system a farbu ignoruje - nicomu to nevadi.) */
.customerform-wrapper select.form-control:not([size]):not([multiple]) option[value=""] {
    color: #a0a0aa;
}

/* Na uzkych displejoch nechavame rovnaku vysku - riadok je tam cez celu
   sirku, takze sa nazov krajiny zmesti tak ci tak. */
@media (max-width: 767px) {
    .customerform-wrapper select.form-control:not([size]):not([multiple]) {
        width: 100%;
    }
}

/* ===================================================================
   FILTRE V KATEGORII - poradie a vzhlad (etapa 1)
   ===================================================================
   Co bolo zle (odmerane na jagashop.sk, kategoria "Gel lak", 28. 9.):
     - filtre zacinali az 1242 px pod vrchom stranky, lebo nad nimi je
       935 px dlhy zoznam kategorii. Na mobile to iste: panel "Filtrovat"
       otvoril najprv kategorie a k filtrom sa zakaznik doscrolloval az
       po ~1000 px,
     - riadky mali 20 px - na dotyk sa do nich tazko trafi,
     - pocty splyvali s nazvom (rovnaka velkost aj farba),
     - tlacidlo "Vymazat vsetko" a fajka v policku mali inu ruzovu
       (#d510ce) ako zvysok obchodu (#dd3499),
     - jazdec ceny mal 0,4 em siroke uchytky, takze sa nedali chytit.

   Menime len vzhlad a poradie. Ziadne nove filtre, ziadny JS, ziadne
   zasahovanie do toho, co filtre robia.
   =================================================================== */

/* --- 1. Filtre patria nad zoznam kategorii ----------------------- */
/* Tema ma na obaloch "display:block !important" (raz pre mobil, raz
   pre desktop), takze poradie sa inak prestavit neda. Preberame to
   vyssou specificitou - nie preto, aby sme temu prebijali vsade, ale
   presne na tomto jednom obale. */
body#category #left-column #search_filters_wrapper {
    display: flex !important;
    flex-direction: column;
}

body#category #left-column #search_filters_wrapper .mobile-menu-header {
    order: 0;
}

body#category #left-column #search_filters_wrapper #search_filters {
    order: 1;
    margin-top: 0;
}

body#category #left-column #search_filters_wrapper .block-categories {
    order: 2;
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid #ededf1;
}

/* Na sirokom displeji nech filtre ostanu na ocdiach aj ked zakaznik
   scrolluje popri dlhom zozname kategorii. */
@media (min-width: 992px) {
    body#category #left-column #search_filters_wrapper > #search_filters {
        position: -webkit-sticky;
        position: sticky;
        top: 16px;
        z-index: 2;
        background: #fff;
        /* Vo velkej kategorii (napr. Nechty) je filtrov tolko, ze by bol
           blok vyssi ako obrazovka - a prilepeny blok, ktory sa nezmesti,
           sa uz neda doscrollovat. Preto ma vlastny strop a vtedy sa
           posuva vnutri seba. */
        max-height: calc(100vh - 32px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    /* Tenky posuvnik, aby nekrical. */
    body#category #left-column #search_filters_wrapper > #search_filters::-webkit-scrollbar {
        width: 6px;
    }

    body#category #left-column #search_filters_wrapper > #search_filters::-webkit-scrollbar-thumb {
        background: #e6e6ea;
        border-radius: 3px;
    }
}

/* --- 2. Nadpis bloku a nadpisy sekcii ---------------------------- */
body#category #search_filters > p.h6 {
    margin: 0 0 6px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #1a1a1e;
}

body#category #search_filters .facet {
    margin-bottom: 0;
    padding-top: 14px;
    border-top: 1px solid #f1f1f4;
}

body#category #search_filters .facet:first-of-type {
    border-top: 0;
}

body#category #search_filters .facet .title {
    margin-bottom: 8px;
}

body#category #search_filters .facet .facet-title {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #1a1a1e;
}

/* --- 3. Riadky: vacsie, pocet vpravo ----------------------------- */
body#category #search_filters .facet .facet-label {
    min-height: 34px;
    margin-bottom: 0;
    line-height: 1.35;
}

body#category #search_filters .facet .facet-label a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 4px 0;
    font-size: 13px;
    color: #1a1a1e;
    /* Tema ma tu "width:100% !important", lenze vedla je este policko,
       takze by riadok o jeho sirku pretiekol a pocet by sa orezal.
       Sirku preto preberame a necham ju dopocitat flexu. */
    width: auto !important;
    flex: 1 1 auto;
    min-width: 0;
    /* Dlhy nazov znacky sa radsej zalomi, ako by sa mal orezat. */
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

body#category #search_filters .facet .facet-label:hover a {
    color: #dd3499;
}

/* Rozpatie ceny nad jazdcom je len popis, netreba ho mat ako nadpis. */
body#category #search_filters .facet .faceted-slider p {
    margin: 0 0 10px;
    font-size: 12.5px;
    color: #55555e;
}

body#category #search_filters .facet .facet-label .magnitude {
    flex: 0 0 auto;
    font-size: 12px;
    color: #a0a0aa;
}

/* --- 4. Zaskrtavacie policko ------------------------------------- */
body#category #search_filters .facet .facet-label .custom-checkbox {
    display: flex;
    align-items: center;
    flex: 0 0 18px;
    height: 18px;
    margin-right: 10px;
}

body#category #left-column .custom-checkbox input[type="checkbox"] + span {
    width: 18px;
    height: 18px;
    margin: 0;
    border: 1.5px solid #d8d8e0;
    border-radius: 3px;
    background: #fff;
    position: relative;
}

body#category #search_filters .custom-checkbox input[type="checkbox"]:checked + span {
    background: #dd3499;
    border-color: #dd3499;
}

/* Fajka je kresleny ram (nie ikona), takze sa prefarbuje cez border. */
body#category #search_filters .custom-checkbox input[type="checkbox"] + span .checkbox-checked {
    position: absolute;
    left: 5px;
    top: 2px;
    margin: 0;
    width: 4px;
    height: 9px;
    border-color: currentcolor #fff #fff currentcolor;
}

/* Kruzky s farbou (ak sa raz filter podla odtiena zapne) nechavame
   okruhle a bez ramceka - len zvyraznime vybrany. */
body#category #left-column .custom-checkbox input[type="checkbox"] + span.color {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 0;
    margin: 0 10px 0 0;
}

/* --- 5. Jazdec ceny ---------------------------------------------- */
body#category #search_filters .ui-slider-horizontal {
    height: 3px;
    background: #ededf1;
    border: 0;
}

body#category #search_filters .ui-widget-header {
    background: #dd3499;
}

body#category #search_filters .ui-slider .ui-slider-handle {
    top: -6px;
    width: 14px;
    height: 14px;
    margin-left: -7px;
    border: 2px solid #dd3499;
    border-radius: 50%;
    background: #fff;
}

/* --- 6. Tlacidlo "Vymazat vsetko" -------------------------------- */
body#category #search_filters .js-search-filters-clear-all {
    margin-top: 16px;
    padding: 11px 18px;
    border: 1px solid #dd3499;
    border-radius: 30px;
    background: #fff;
    color: #dd3499;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .05em;
}

body#category #search_filters .js-search-filters-clear-all:hover,
body#category #search_filters .js-search-filters-clear-all:focus {
    background: #dd3499;
    color: #fff;
}

/* --- 7. Aktivne filtre nad produktmi ----------------------------- */
body#category .active_filters .active-filter-title {
    margin-right: 12px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .05em;
}

body#category .active_filters .filter-block {
    padding: 6px 12px;
    border: 1px solid #dd3499;
    border-radius: 999px;
    background: #fff;
    color: #1a1a1e;
    font-size: 12px;
    text-transform: none;
}

body#category .active_filters .filter-block .close {
    margin-left: 8px;
    color: #dd3499;
    font-size: 13px;
    line-height: 1;
}

/* ===================================================================
   FILTRE V KATEGORII - spravanie (etapa 2)
   ===================================================================
   Doplnky, ktore k filtrom pridava nas skript: prepinac "len skladom",
   hladanie v dlhom zozname, rozbalovanie sekcii a mobilny panel.
   Vsetko je pod body#category, takze sa to nikde inde neprejavi.
   =================================================================== */

/* --- prepinac "len skladom" --------------------------------------- */
body#category #search_filters .jaga-fl-stock {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 6px;
    padding: 11px 13px;
    border: 1px solid #ededf1;
    color: #1a1a1e;
    text-decoration: none;
}

body#category #search_filters .jaga-fl-stock:hover {
    border-color: #dd3499;
}

body#category #search_filters .jaga-fl-stock-txt {
    display: block;
    min-width: 0;
}

body#category #search_filters .jaga-fl-stock strong {
    display: block;
    font-size: 13px;
    font-weight: 500;
}

body#category #search_filters .jaga-fl-stock small {
    display: block;
    margin-top: 2px;
    font-size: 11.5px;
    color: #70707a;
}

/* Samotny prepinac. Vypnuty je sedy, zapnuty ruzovy. */
body#category #search_filters .jaga-fl-sw {
    position: relative;
    flex: 0 0 38px;
    width: 38px;
    height: 22px;
    border-radius: 999px;
    background: #e6e6ea;
    transition: background .15s ease;
}

body#category #search_filters .jaga-fl-sw::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s ease;
}

body#category #search_filters .jaga-fl-stock.is-on .jaga-fl-sw {
    background: #dd3499;
}

body#category #search_filters .jaga-fl-stock.is-on .jaga-fl-sw::after {
    left: 19px;
}

/* Sekcia dostupnosti je uz v prepinaci. */
body#category #search_filters .facet.jaga-fl-hidden {
    display: none;
}

/* --- hladanie v dlhom zozname ------------------------------------- */
body#category #search_filters .jaga-fl-find {
    display: block;
    width: 100%;
    height: 34px;
    margin: 0 0 8px;
    padding: 0 10px;
    border: 1px solid #e6e6ea;
    background: #fafafb;
    font-family: inherit;
    font-size: 12.5px;
    color: #1a1a1e;
}

body#category #search_filters .jaga-fl-find:focus {
    border-color: #1a1a1e;
    outline: none;
}

body#category #search_filters .jaga-fl-more {
    display: inline-block;
    margin: 4px 0 8px;
    padding: 0;
    border: 0;
    background: none;
    color: #dd3499;
    font-family: inherit;
    font-size: 12px;
    text-align: left;
    cursor: pointer;
}

body#category #search_filters .jaga-fl-more:hover {
    text-decoration: underline;
}

/* --- rozbalovanie sekcii ------------------------------------------ */
body#category #search_filters .facet .title {
    align-items: center;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}

body#category #search_filters .jaga-fl-arrow {
    flex: 0 0 auto;
    margin-left: auto;
    width: 9px;
    height: 9px;
    border-right: 1.5px solid #a0a0aa;
    border-bottom: 1.5px solid #a0a0aa;
    transform: rotate(-135deg);
    transition: transform .15s ease;
}

body#category #search_filters .facet.jaga-fl-closed .jaga-fl-arrow {
    transform: rotate(45deg);
}

body#category #search_filters .facet.jaga-fl-closed > ul,
body#category #search_filters .facet.jaga-fl-closed > .jaga-fl-find,
body#category #search_filters .facet.jaga-fl-closed > .jaga-fl-more {
    display: none;
}

/* --- mobilny panel ------------------------------------------------- */
@media (max-width: 767px) {
    /* V paneli maju byt len filtre - kategorie su v hlavnom menu. */
    body#category #search_filters_wrapper.jaga-fl-mobile .block-categories {
        display: none !important;
    }

    body#category #search_filters_wrapper.jaga-fl-mobile {
        padding-bottom: 76px;
    }

    body#category #search_filters_wrapper .jaga-fl-foot {
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 310;
        display: flex;
        gap: 8px;
        width: 340px;
        max-width: 100%;
        padding: 12px 14px;
        border-top: 1px solid #f1f1f4;
        background: #fff;
    }

    body#category #search_filters_wrapper .jaga-fl-cancel {
        flex: 0 0 auto;
        padding: 11px 16px;
        border: 1px solid #e6e6ea;
        background: #fff;
        color: #55555e;
        font-family: inherit;
        font-size: 12.5px;
        cursor: pointer;
    }

    body#category #search_filters_wrapper .jaga-fl-ok {
        flex: 1 1 auto;
        padding: 11px 10px;
        border: 0;
        background: #dd3499;
        color: #fff;
        font-family: inherit;
        font-size: 12.5px;
        font-weight: 600;
        letter-spacing: .03em;
        cursor: pointer;
    }
}

@media (min-width: 768px) {
    body#category #search_filters_wrapper .jaga-fl-foot {
        display: none;
    }
}

/* ===================================================================
   FILTRE V KATEGORII - oprava orezavania (1.0.26)
   ===================================================================
   Prilepeny blok filtrov ma od 1.0.24 vlastny strop a posuva sa vnutri
   seba. Tym ale vznikli dve veci, ktore bolo vidno naostro:

   1. Ked ma prvok "overflow-y: auto", prehliadac mu nastavi aj
      "overflow-x: auto". Obsah bol o par bodov sirsi ako blok, takze sa
      dal posunut do strany - a text pri lavom okraji sa potom orezal.
   2. Uchytky jazdca ceny stoja na koncoch drahy a polovicou z nej
      vycnievaju. Lava uchytka tak bola presne na okraji bloku a
      orezanie ju zjedlo.
   3. Posuvnik bloku sedel na poctoch pri pravom okraji.

   Riesenie: do strany sa neposuva nic, na posuvnik je vyhradene miesto
   a jazdec ceny ma po stranach tolko miesta, kolko potrebuju uchytky.
   =================================================================== */

@media (min-width: 992px) {
    body#category #left-column #search_filters_wrapper > #search_filters {
        overflow-x: hidden;
        scrollbar-gutter: stable;
        padding-right: 10px;
    }
}

body#category #search_filters .facet .faceted-slider {
    padding-left: 9px;
    padding-right: 9px;
}

/* ===================================================================
   SIRKA OBSAHU NA VELKOM MONITORE (1.0.27)
   ===================================================================
   Tema drzi obsah v stlpci 1140 px. Na 1900 px monitore tak ostavalo
   po kazdej strane 380 px prazdneho miesta a vsetko vnutri bolo
   natlacene na seba. Obsah preto na sirokych displejoch rastie s
   obrazovkou - v troch krokoch, nech to nikde nepreskoci.

   Vynimky:
   - Pokladna, kosik a potvrdenie objednavky ostavaju v povodnej
     sirke. Su to nase najcitlivejsie stranky a rozsirime ich az ked
     ich prejdeme s plnym kosikom.
   - Detail produktu ma vlastny strop, nech sa obrazok a popis
     nerozlezu po celej sirke.
   =================================================================== */

@media (min-width: 1400px) {
    .container {
        width: 1400px;
        max-width: calc(100% - 48px);
    }
}

@media (min-width: 1600px) {
    .container {
        width: 1560px;
    }
}

@media (min-width: 1800px) {
    .container {
        width: 1680px;
    }
}

/* Pokladna, kosik a potvrdenie zostavaju tak, ako su dnes. */
@media (min-width: 1400px) {
    body#checkout .container,
    body#cart .container,
    body#order-confirmation .container,
    body#order-detail .container {
        width: 1140px;
    }
}

/* Detail produktu: obrazok a popis maju vlastny strop. */
@media (min-width: 1400px) {
    body#product .product-mainblock,
    body#product .an-product-page-description {
        max-width: 1320px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Kategoria: filtre maju pevnu sirku, zvysok patri produktom. */
@media (min-width: 992px) {
    body#category #left-column {
        flex: 0 0 300px;
        max-width: 300px;
        width: 300px;
    }

    body#category #content-wrapper {
        flex: 0 0 calc(100% - 300px);
        max-width: calc(100% - 300px);
        width: calc(100% - 300px);
        padding-left: 40px;
    }

    body#category #js-product-list .products.row {
        margin-left: -18px;
        margin-right: -18px;
    }

    body#category #js-product-list .product-miniature {
        padding-left: 18px;
        padding-right: 18px;
        margin-bottom: 38px;
    }
}

/* Na naozaj sirokej obrazovke by tri dlazdice boli prilis velke.
   Plati to len na predvolenej hustote (col-lg-4) - ked si zakaznik
   prepne hustotu tlacidlami nad vypisom, jeho volba ostava. */
@media (min-width: 1500px) {
    body#category #js-product-list .products .product-miniature.col-lg-4 {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

/* ===================================================================
   RYCHLA OBJEDNAVKA A OPAKOVANA OBJEDNAVKA (1.0.28)
   ===================================================================
   Dve obrazovky pre velkoobchodneho zakaznika. Vsetko je viazane na
   vlastne triedy s predponou .jaga-qo / .jaga-ro, takze sa to nemoze
   prejavit nikde inde v teme.
   =================================================================== */

.jaga-qo {
    margin-top: 6px;
}

.jaga-qo-intro {
    margin: 0 0 22px;
    max-width: 70ch;
    color: #55555e;
    font-size: 14px;
    line-height: 1.6;
}

.jaga-qo-cols {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    align-items: flex-start;
}

.jaga-qo-left {
    flex: 1 1 300px;
    min-width: 0;
    max-width: 380px;
}

.jaga-qo-right {
    flex: 3 1 420px;
    min-width: 0;
}

.jaga-qo-label {
    display: block;
    margin-bottom: 7px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #55555e;
}

.jaga-qo-pad {
    width: 100%;
    box-sizing: border-box;
    min-height: 190px;
    resize: vertical;
    padding: 12px 13px;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fafafc;
    color: #1a1a1e;
    font-family: Menlo, Consolas, "Courier New", monospace;
    font-size: 13px;
    line-height: 1.75;
}

.jaga-qo-pad:focus {
    outline: 2px solid #dd3499;
    outline-offset: 1px;
    border-color: #dd3499;
}

.jaga-qo-hint {
    margin: 9px 0 0;
    font-size: 12px;
    line-height: 1.55;
    color: #a0a0aa;
}

.jaga-qo-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.jaga-qo-btn {
    padding: 12px 18px;
    border: 1px solid transparent;
    border-radius: 40px;
    background: #dd3499;
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    cursor: pointer;
}

.jaga-qo-btn:hover {
    background: #c01e80;
}

.jaga-qo-btn.is-ghost {
    background: transparent;
    color: #55555e;
    border-color: #e6e6ea;
}

.jaga-qo-btn.is-ghost:hover {
    color: #1a1a1e;
    border-color: #a0a0aa;
}

.jaga-qo-btn[disabled] {
    background: #ededf1;
    color: #a0a0aa;
    border-color: transparent;
    cursor: not-allowed;
}

.jaga-qo-scroll {
    overflow-x: auto;
}

.jaga-qo-table {
    width: 100%;
    min-width: 460px;
    border-collapse: collapse;
    font-size: 13.5px;
}

.jaga-qo-table th {
    padding: 0 10px 9px 0;
    border-bottom: 1px solid #e6e6ea;
    color: #a0a0aa;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    text-align: left;
}

.jaga-qo-table td {
    padding: 11px 10px 11px 0;
    border-bottom: 1px solid #f1f1f4;
    vertical-align: middle;
}

.jaga-qo-table th:last-child,
.jaga-qo-table td:last-child {
    padding-right: 0;
    text-align: right;
}

.jaga-qo-code {
    font-family: Menlo, Consolas, "Courier New", monospace;
    font-size: 12.5px;
    color: #55555e;
    white-space: nowrap;
}

.jaga-qo-name {
    display: block;
    margin-bottom: 4px;
}

.jaga-qo-title {
    font-weight: 500;
}

.jaga-qo-pick {
    max-width: 100%;
    padding: 5px 8px;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fff;
    color: #1a1a1e;
    font-size: 13px;
}

.jaga-qo-missing {
    color: #a0a0aa;
    margin-right: 7px;
}

.jaga-qo-price,
.jaga-qo-line,
.jaga-qo-dash {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.jaga-qo-price {
    color: #55555e;
}

.jaga-qo-dash {
    color: #a0a0aa;
}

.jaga-qo-pill {
    display: inline-block;
    padding: 3px 9px 4px;
    border-radius: 40px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    white-space: nowrap;
}

.jaga-qo-pill.is-ok {
    background: #e6f4ed;
    color: #1c7a52;
}

.jaga-qo-pill.is-warn {
    background: #fbf1df;
    color: #9a6410;
}

.jaga-qo-pill.is-bad {
    background: #fceceb;
    color: #b3261e;
}

.jaga-qo-pill.is-pick {
    background: #fdf2f9;
    color: #c01e80;
}

.jaga-qo-qty {
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
}

.jaga-qo-qty button {
    width: 26px;
    height: 30px;
    border: 0;
    background: #fafafc;
    color: #55555e;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
}

.jaga-qo-qty button:hover {
    background: #f1f1f4;
    color: #1a1a1e;
}

.jaga-qo-qty input {
    width: 46px;
    height: 30px;
    border: 0;
    background: #fff;
    color: #1a1a1e;
    font-family: Menlo, Consolas, "Courier New", monospace;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.jaga-qo-empty {
    margin: 0;
    padding: 26px 18px;
    border: 1px dashed #e6e6ea;
    border-radius: 3px;
    color: #a0a0aa;
    font-size: 13.5px;
    text-align: center;
}

.jaga-qo-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
    margin-top: 24px;
    padding: 16px 18px;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fafafc;
}

.jaga-qo-sums {
    flex: 1 1 260px;
    min-width: 0;
}

.jaga-qo-sum {
    display: block;
    font-size: 19px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #1a1a1e;
}

.jaga-qo-note {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #55555e;
}

.jaga-qo-meter {
    max-width: 260px;
    height: 4px;
    margin-top: 9px;
    border-radius: 4px;
    background: #e6e6ea;
    overflow: hidden;
}

.jaga-qo-meter i {
    display: block;
    height: 100%;
    width: 0;
    background: #dd3499;
    transition: width .25s ease;
}

.jaga-qo-meter.is-done i {
    background: #1c7a52;
}

.jaga-qo-done {
    display: inline-block;
    margin-left: 4px;
    font-size: 13px;
    font-weight: 600;
    color: #dd3499;
    text-decoration: underline;
}

/* --- dlazdica v ucte --------------------------------------------- */
/* Dlazdicu si poziciavame priamo od temy (klonujeme prvu), takze vzhlad
   sa riesi v teme a tu nepotrebujeme nic dopisovat. */

/* --- panel vyberu pri kode s viacerymi polozkami ------------------- */
/* Jeden kod ma v katalogu bezne desiatky produktov. Zoznam sa preto da
   prehladavat a pri kazdej polozke sa nastavuje vlastny pocet. */

.jaga-qo-btn.is-small {
    padding: 7px 14px;
    font-size: 11px;
}

.jaga-qo-pickrow > td {
    padding: 0 0 14px;
    border-bottom: 1px solid #f1f1f4;
}

.jaga-qo-picker {
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fafafc;
}

.jaga-qo-picker-head {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px 12px;
    border-bottom: 1px solid #e6e6ea;
}

.jaga-qo-picker-search {
    flex: 1 1 180px;
    min-width: 0;
    height: 34px;
    padding: 0 10px;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fff;
    color: #1a1a1e;
    font-family: inherit;
    font-size: 13px;
}

.jaga-qo-picker-search:focus {
    border-color: #dd3499;
    outline: none;
}

.jaga-qo-picker-count {
    font-size: 12px;
    color: #a0a0aa;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.jaga-qo-picker-list {
    max-height: 320px;
    overflow-y: auto;
}

.jaga-qo-picker-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid #f1f1f4;
    background: #fff;
}

.jaga-qo-picker-row:last-child {
    border-bottom: 0;
}

.jaga-qo-picker-row.is-on {
    background: #fdf2f9;
}

.jaga-qo-picker-name {
    min-width: 0;
    font-size: 13px;
    line-height: 1.45;
}

.jaga-qo-picker-name .jaga-qo-pill {
    margin-left: 8px;
}

.jaga-qo-picker-price {
    font-size: 13px;
    color: #55555e;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.jaga-qo-picker-none {
    margin: 0;
    padding: 22px 12px;
    text-align: center;
    font-size: 13px;
    color: #a0a0aa;
}

.jaga-qo-picker-foot {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 9px 12px;
    border-top: 1px solid #e6e6ea;
}

.jaga-qo-picker-sum {
    font-size: 12.5px;
    color: #55555e;
}

@media (max-width: 575px) {
    .jaga-qo-picker-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .jaga-qo-picker-row .jaga-qo-picker-price {
        grid-column: 1 / -1;
        text-align: left;
    }

    /* Na uzkom displeji nemoze stitok skladu stat vedla dlheho nazvu -
       riadok by sa rozsiril a tabulka by sa posuvala do strany. */
    .jaga-qo-picker-name .jaga-qo-pill {
        display: table;
        margin: 5px 0 0;
    }
}

/* --- opakovana objednavka ---------------------------------------- */
/* Panel stoji ako samostatny blok temy (.box) za zoznamom poloziek,
   nie vnutri neho - inak by na mobile zmizol spolu s pocitacovym
   zoznamom. Od temy si berie biele pozadie, len mu pridame vzduch. */
.jaga-ro {
    padding: 24px;
}

.jaga-ro-head {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 600;
    color: #1a1a1e;
}

.jaga-ro-intro {
    margin: 0 0 16px;
    max-width: 70ch;
    font-size: 13.5px;
    color: #55555e;
}

.jaga-ro-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
    font-size: 13px;
}

.jaga-ro-link {
    padding: 0;
    border: 0;
    background: none;
    color: #dd3499;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.jaga-ro-link:hover {
    color: #c01e80;
    text-decoration: underline;
}

.jaga-ro-count {
    color: #a0a0aa;
}

.jaga-ro-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid #f1f1f4;
}

.jaga-ro-item.is-off {
    opacity: .55;
}

.jaga-ro-item input[type="checkbox"] {
    flex: none;
    width: 17px;
    height: 17px;
    accent-color: #dd3499;
    cursor: pointer;
}

.jaga-ro-label {
    flex: 1 1 220px;
    min-width: 0;
    margin: 0;
    cursor: pointer;
}

.jaga-ro-name {
    display: block;
    font-size: 13.5px;
    font-weight: 500;
    color: #1a1a1e;
}

.jaga-ro-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-top: 4px;
}

.jaga-ro-price {
    min-width: 84px;
    color: #55555e;
    font-size: 13.5px;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.jaga-ro-qty {
    flex: none;
}

.jaga-ro-sum {
    min-width: 84px;
    font-size: 13.5px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

@media (max-width: 575px) {
    .jaga-qo-cols {
        gap: 22px;
    }

    .jaga-qo-left {
        max-width: none;
    }

    .jaga-ro-price,
    .jaga-ro-sum {
        min-width: 0;
        text-align: left;
    }
}

/* ==================================================================
   Prazdny kosik
   ==================================================================

   Tema tu ukaze jednu vetu, odkaz spat a vedla toho suhrn so styrmi
   nulami a nestlacitelne tlacidlo objednavky. Zakaznik, ktory sem
   doklikal, nema kam pokracovat. Nuly aj mrtve tlacidlo preto skryjeme
   a namiesto nich ponukneme tri jasne cesty dalej.

   Do sablony temy sa nesiaha - blok stavia skript modulu, tieto
   pravidla mu len davaju podobu.
   ================================================================== */

.jaga-chk .cart-grid.jaga-ec-on .cart-grid-right {
    display: none;
}

/* Mriezka temy stoji na plavajucich stlpcoch, nie na flexboxe, takze
   samotne "flex: 0 0 100%" sirku nezmeni - rozhoduje az width. */
.jaga-chk .cart-grid.jaga-ec-on .cart-grid-body {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}

/* Odkaz "Pokracovat v nakupe" od temy - to iste ponuka tretia kartica. */
.jaga-chk .cart-grid.jaga-ec-on .cart-grid-body > a.label {
    display: none;
}

.jaga-chk .jaga-ec {
    padding: 4px 0 8px;
}

.jaga-chk .jaga-ec-head {
    margin: 0 0 4px;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.3;
    color: #1a1a1e;
}

.jaga-chk .jaga-ec-note {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
    color: #55555e;
}

.jaga-chk .jaga-ec-cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px;
}

.jaga-chk .jaga-ec-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 240px;
    flex: 1 1 240px;
    min-width: 0;
    padding: 20px 20px 18px;
    border: 1px solid #e6e6ea;
    border-radius: 4px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.jaga-chk .jaga-ec-card:hover,
.jaga-chk .jaga-ec-card:focus {
    border-color: #dd3499;
    box-shadow: 0 2px 14px rgba(26, 26, 30, .09);
    text-decoration: none;
    color: inherit;
}

.jaga-chk .jaga-ec-card:focus-visible {
    outline: 2px solid #dd3499;
    outline-offset: 2px;
}

.jaga-chk .jaga-ec-card.is-main {
    border-color: #dd3499;
    box-shadow: inset 0 0 0 1px #dd3499;
}

.jaga-chk .jaga-ec-ico {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin: 0 0 14px;
    border-radius: 50%;
    background: #f7f2f6;
    color: #dd3499;
    font-size: 21px;
    line-height: 1;
}

.jaga-chk .jaga-ec-card.is-main .jaga-ec-ico {
    background: #dd3499;
    color: #fff;
}

.jaga-chk .jaga-ec-title {
    margin: 0 0 7px;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    color: #1a1a1e;
}

.jaga-chk .jaga-ec-sub {
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 1.55;
    color: #55555e;
}

.jaga-chk .jaga-ec-go {
    margin-top: auto;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .01em;
    color: #c01e80;
}

.jaga-chk .jaga-ec-go::after {
    content: '\2192';
    margin-left: 6px;
}

.jaga-chk .jaga-ec-card:hover .jaga-ec-go {
    color: #dd3499;
}

@media (max-width: 767px) {
    .jaga-chk .jaga-ec-cards {
        gap: 12px;
    }

    .jaga-chk .jaga-ec-card {
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
        padding: 16px 16px 15px;
    }

    .jaga-chk .jaga-ec-head {
        font-size: 17px;
    }
}

/* ==================================================================
   Produktove dlazdice
   ==================================================================

   Zrovnanie nazvu a riadku s variantmi robi skript (tileRows), lebo
   CSS sa nevie opytat, aky vysoky je susedny stlpec. Tu ostavaju len
   dve pravidla, ktore schovavaju to, co nic nehovori.
   ================================================================== */

/* Prazdny pruh pre hodnotenia je nad dlazdicou a nic v nom nie je -
   nechavame ho len tam, kde naozaj su hviezdicky. */
.jaga-chk .products .product-miniature .product-list-reviews.jaga-tile-norev {
    display: none;
}

/* Veta od temy zostava v stranke (a v citackach), len ju prekryva blok
   s kartickami - keby tento kod raz zhasol, zakaznik ju zase uvidi. */
.jaga-chk .cart-grid.jaga-ec-on .cart-overview > .no-items {
    display: none;
}

.jaga-chk .products .an_wishlist-mini-count.jaga-tile-nocount {
    display: none;
}

/* ==================================================================
   Kolko produktov na stranu
   ==================================================================

   Ovladac vedla zoradovania. Tema tam ma riadok .sort-by-row, do
   ktoreho sa zmesti; na uzkom displeji sa zalomi pod zoradovanie.
   ================================================================== */

.jaga-chk .jaga-pp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 5px;
    margin-left: 18px;
}

.jaga-chk .jaga-pp-label {
    margin-right: 3px;
    font-size: 13px;
    color: #55555e;
    white-space: nowrap;
}

.jaga-chk .jaga-pp-btn {
    display: inline-block;
    min-width: 36px;
    padding: 5px 9px;
    border: 1px solid #e6e6ea;
    border-radius: 2px;
    background: #fff;
    color: #55555e;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition: border-color .15s ease, color .15s ease;
}

.jaga-chk .jaga-pp-btn:hover,
.jaga-chk .jaga-pp-btn:focus {
    border-color: #dd3499;
    color: #c01e80;
    text-decoration: none;
}

.jaga-chk .jaga-pp-btn:focus-visible {
    outline: 2px solid #dd3499;
    outline-offset: 1px;
}

.jaga-chk .jaga-pp-btn.is-on {
    border-color: #dd3499;
    background: #dd3499;
    color: #fff;
}

@media (max-width: 767px) {
    .jaga-chk .jaga-pp {
        width: 100%;
        margin: 10px 0 0;
    }
}

/* ==================================================================
   Naseptavac vo vyhladavani
   ================================================================== */

.jaga-chk .jaga-sg-host {
    position: relative;
}

.jaga-chk .jaga-sg {
    position: absolute;
    z-index: 120;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 5px;
    max-height: 62vh;
    overflow-y: auto;
    border: 1px solid #e6e6ea;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 8px 26px rgba(26, 26, 30, .13);
    text-align: left;
}

.jaga-chk .jaga-sg-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    padding: 0 10px 0 0;
    border-top: 1px solid #f1f1f4;
}

.jaga-chk .jaga-sg-row:first-child {
    border-top: 0;
}

.jaga-chk .jaga-sg-row.is-on {
    background: #fdf2f9;
}

.jaga-chk .jaga-sg-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    gap: 10px;
    padding: 9px 4px 9px 12px;
    color: #1a1a1e;
    text-decoration: none;
}

.jaga-chk .jaga-sg-link:hover,
.jaga-chk .jaga-sg-link:focus {
    color: #1a1a1e;
    text-decoration: none;
}

.jaga-chk .jaga-sg-code {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    min-width: 76px;
    font-family: "Courier New", monospace;
    font-size: 12.5px;
    color: #c01e80;
}

.jaga-chk .jaga-sg-mid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    gap: 8px;
}

.jaga-chk .jaga-sg-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13.5px;
    line-height: 1.35;
}

.jaga-chk .jaga-sg-price {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 13.5px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.jaga-chk .jaga-sg-add {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid #dd3499;
    border-radius: 2px;
    background: #dd3499;
    color: #fff;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}

.jaga-chk .jaga-sg-add:hover {
    background: #c01e80;
    border-color: #c01e80;
}

.jaga-chk .jaga-sg-add.is-done,
.jaga-chk .jaga-sg-add[disabled] {
    background: #fff;
    color: #dd3499;
}

.jaga-chk .jaga-sg-none {
    margin: 0;
    padding: 13px 12px;
    font-size: 13px;
    color: #8e8e99;
}

.jaga-chk .jaga-sg-more {
    display: block;
    padding: 10px 12px;
    border-top: 1px solid #e6e6ea;
    background: #faf8fa;
    color: #c01e80;
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
}

.jaga-chk .jaga-sg-more:hover {
    color: #dd3499;
    text-decoration: none;
}

@media (max-width: 575px) {
    .jaga-chk .jaga-sg-code {
        min-width: 64px;
        font-size: 11.5px;
    }

    .jaga-chk .jaga-sg-link {
        padding-left: 10px;
        gap: 7px;
    }
}

/* ======================================================================
   Casto objednavane
   ======================================================================

   Samotny zoznam je ten isty ako pri "objednat znova" - prebera cele
   .jaga-ro-* oblecenie. Tu pribuda len to, co je na tejto stranke nove:
   drobna poznamka "3x objednane - zvycajne 2 ks" pod nazvom a stav,
   ked zakaznik este nic neobjednal.
   ====================================================================== */

.jaga-chk .jaga-ro-extra {
    color: #8e8e99;
    font-size: 12px;
    line-height: 1.35;
}

.jaga-chk #jaga-casto {
    margin: 0 0 28px;
}

.jaga-chk .jaga-co {
    margin-top: 0;
}

.jaga-chk .jaga-co-empty {
    padding: 28px 24px 26px;
    border: 1px solid #e6e6ea;
    border-radius: 4px;
    background: #fff;
    text-align: center;
}

.jaga-chk .jaga-co-empty-head {
    margin: 0 0 8px;
    color: #1a1a1e;
    font-size: 17px;
    font-weight: 700;
}

.jaga-chk .jaga-co-empty-note {
    margin: 0 auto 18px;
    max-width: 520px;
    color: #55555e;
    font-size: 14px;
    line-height: 1.55;
}

.jaga-chk .jaga-co-empty .jaga-qo-btn {
    display: inline-block;
    text-decoration: none;
}

@media (max-width: 575px) {
    .jaga-chk .jaga-co-empty {
        padding: 22px 16px 20px;
    }
}

/* ======================================================================
   Prazdna sekcia na produkte
   ======================================================================

   Tema vypise na produkte nadpis "Specificke referencie" aj vtedy, ked
   pod nim nie je ani jeden riadok. Prve pravidlo to zariadi hned, este
   pred skriptom; druhe je zaloha pre prehliadace bez :has().

   Obe su zamerne uzke - tykaju sa len sekcie, v ktorej naozaj nie je
   ziadna polozka. Ked ju tema raz naplni, objavi sa sama.
   ====================================================================== */

.jaga-chk section.product-features:not(:has(dt)):not(:has(dd)):not(:has(li)):not(:has(tr)):not(:has(p)):not(:has(a)):not(:has(img)) {
    display: none;
}

.jaga-chk section.product-features.jaga-pf-prazdna {
    display: none;
}

/* ───────────────────── výber prevádzky v pokladni ─────────────────────
   Zapína sa len u zákazníka s viacerými adresami; kto má jednu, nevidí
   z tohto nič. Dlaždice stavia téma, my k nim dopĺňame len to, čo
   z adresy nevyplýva: kam išlo naposledy a kam to pôjde teraz.

   Farby sú obchodné, nie vymyslené: #dd3499 je ružová, ktorou je zvyšok
   obchodu. (Pozor na #d510ce — tá je o kúsok inde a v obchode je len
   omylom na pár miestach.)

   Text štítku NIE JE #dd3499: na svetlom podklade má kontrast 4,2:1,
   čo je na 11,5 px písmo málo. Preto má štítok tmavší odtieň tej istej
   ružovej (#9b1b67, kontrast 6,6:1) — vyzerá rovnako, ale dá sa prečítať
   aj na tých notebookoch v predajni. */

:root {
    --jaga-branch: #dd3499;
    --jaga-branch-bg: #fdf5fa;
    --jaga-branch-chip-bg: #fbe9f3;
    --jaga-branch-chip-line: #f0c2dd;
    --jaga-branch-chip-ink: #9b1b67;
}

.jaga-subhead {
    margin: -6px 0 14px;
    font-size: 14px;
    line-height: 1.5;
    color: #5f6872;
    max-width: 68ch;
}

/* Dlaždica prevádzky. Vybraná je ružová, aby sa dala nájsť pohľadom
   aj na zozname trinástich.

   Dlhý začiatok selektora nie je ozdoba. Téma má na dlaždici
       body#checkout section.checkout-step .address-item {
           background: #fafafa !important; border: 1px solid #e5e5e5 !important;
       }
   a keď má pravidlo !important na oboch stranách, rozhoduje špecifickosť —
   samotné `.address-item.jaga-branch-on !important` prehrá. Zmerané naživo
   16. 10.: rám vychádzal sivý (229,229,229) a podklad #fafafa.

   Mimochodom, téma si aj sama farbí vybranú adresu
   (`.address-item.selected { border: 1px solid #d510ce }`), lenže tiež
   prehráva s tým !important — takže dnes nie je po výbere vidieť vôbec nič
   okrem bodky v krúžku. */
body#checkout section.checkout-step .address-item.jaga-branch {
    border-radius: 8px;
    transition: border-color .15s, background-color .15s;
}
body#checkout section.checkout-step .address-item.jaga-branch-on {
    border-color: var(--jaga-branch, #dd3499) !important;
    background: var(--jaga-branch-bg, #fdf5fa) !important;
}
body#checkout section.checkout-step .address-item.jaga-branch .address-alias,
body#checkout section.checkout-step .address-item.jaga-branch .js-address-alias {
    font-size: 17px;
    font-weight: 700;
    color: #1b2127;
}

/* Riadok pod názvom prevádzky.
   Je to vlastný blok za hlavičkou dlaždice, nie vnútro hlavičky: názov je
   v téme v inline-block obale spolu s adresou, takže čokoľvek pridané dnu
   sa stlačí do úzkeho stĺpca vedľa textu. Overené naživo 16. 10. — práve
   takto to najprv aj vyzeralo. */
.jaga-bmeta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 0 6px;
    padding: 0 12px;
}
.jaga-bmeta:empty {
    display: none;
}

/* Sem išla posledná objednávka. */
.jaga-blast {
    font-size: 12.5px;
    color: #767676;
    font-weight: 400;
}

/* Sem to pôjde. */
.jaga-bhere {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .04em;
    white-space: nowrap;
    color: var(--jaga-branch-chip-ink, #9b1b67);
    background: var(--jaga-branch-chip-bg, #fbe9f3);
    border: 1px solid var(--jaga-branch-chip-line, #f0c2dd);
}

/* Popis pod poznámkou k objednávke. */
.jaga-bnote {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #5f6872;
}

@media (max-width: 480px) {
    .jaga-subhead { font-size: 13.5px; }
    .jaga-bmeta { padding: 0 10px; }
}