/* === VÝBER ODTIEŇOV === */
@media screen and (max-width:450px){.close-colors-offmenu-btn{left:calc(80% - 40px)!important;top:8px!important}}
.woocommerce-product-attributes-item.woocommerce-product-attributes-item--attribute_pa_vyberte-odtien{display:none!important}
.single-color{width:75px!important;height:75px!important;margin-left:25px;margin-right:0;margin-bottom:25px;border-radius:0!important;margin-top:10px}
.swatch-on-single:not(:last-child){margin-right:0!important}
.single-color:not(:last-child){margin-left:13px!important;margin-right:0!important;border-radius:0!important}
.mysidenav{height:100%;width:0;position:fixed;top:0;left:0;background-color:#f3f3f3;overflow-x:hidden;transition:width .5s;z-index:996;display:none}
.mysidenav a{padding:8px 8px 8px 32px;text-decoration:none;font-size:25px;color:#818181;display:block;transition:.3s}
.mysidenav a:hover{color:#f1f1f1}
.color-code{margin-top:75px;font-size:13px;width:75px;height:20px;background:#fff;line-height:20px;color:#83888a}
.woodmart-swatch:after,.wd-swatch:after{border-color:transparent!important}
#overlay{position:fixed;display:none;width:100%;height:100%;inset:0;background-color:rgba(0,0,0,.5);z-index:995;cursor:pointer}
.close-colors-topmenu{padding:10px;font-size:40px;border-bottom:1px solid rgba(0,0,0,.1)}
.close-colors-topmenu h2{text-align:center;margin-bottom:0!important}
.close-colors-offmenu-btn{position:fixed!important;top:10px!important;left:380px!important;right:auto!important;width:32px!important;height:32px!important;min-width:32px!important;max-width:32px!important;padding:0!important;margin:0!important;display:none!important;align-items:center!important;justify-content:center!important;background:#fff!important;border:1px solid #ccc!important;border-radius:50%!important;z-index:10000!important;transform:none!important;cursor:pointer!important}
.close-colors-offmenu-btn.is-visible{display:flex!important}
.close-colors-offmenu-btn-span{display:block!important;position:static!important;width:32px!important;height:32px!important;color:#222!important;font-size:24px!important;line-height:30px!important;text-align:center!important;transform:none!important;pointer-events:none}
@media screen and (max-height:450px){.mysidenav a{font-size:18px}}
@media screen and (max-width:450px){.color-code{width:100%!important}.single-color{width:20%!important;margin-left:4%!important}}
/* === MOBIL: odtiene musia byť klikateľné nad overlayom === */
#overlay {
    z-index: 10000 !important;
}

.mysidenav {
    z-index: 10001 !important;
    pointer-events: auto !important;
}

.close-colors-offmenu-btn {
    z-index: 10002 !important;
}

.mysidenav .single-color,
.mysidenav .wd-swatch,
.mysidenav .woodmart-swatch {
    position: relative;
    z-index: 10002;
    pointer-events: auto !important;
    touch-action: manipulation;
    cursor: pointer;
}
/* === WOODMART 8.2.5: čísla odtieňov v popupe === */

.mysidenav .wd-swatch {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 75px !important;
    height: 95px !important;
    margin: 10px 0 15px 13px !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

.mysidenav .wd-swatch-bg {
    width: 75px !important;
    height: 75px !important;
    min-width: 75px !important;
    min-height: 75px !important;
    border-radius: 0 !important;
}

.mysidenav .wd-swatch-text.color-code {
    display: block !important;
    position: static !important;
    margin: 0 !important;
    width: 75px !important;
    height: 20px !important;
    line-height: 20px !important;
    font-size: 13px !important;
    text-align: left !important;
    background: #fff !important;
    color: #83888a !important;
    opacity: 1 !important;
    visibility: visible !important;
}

@media screen and (max-width:450px) {
    .mysidenav .wd-swatch {
        width: 21% !important;
        height: 90px !important;
        margin: 8px 2% !important;
    }

    .mysidenav .wd-swatch-bg {
        width: 100% !important;
        height: 70px !important;
        min-width: 0 !important;
        min-height: 70px !important;
    }

    .mysidenav .wd-swatch-text.color-code {
        width: 100% !important;
        height: 20px !important;
        line-height: 20px !important;
        font-size: 12px !important;
    }
}
/* === MOBIL: krížik vždy viditeľný v popupe === */
@media screen and (max-width:450px) {
    .close-colors-offmenu-btn {
        position: fixed !important;
        top: 8px !important;
        left: auto !important;
        right: calc(20% + 8px) !important;
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        display: none !important;
        z-index: 10005 !important;
    }

    .close-colors-offmenu-btn.is-visible {
        display: flex !important;
    }
}