/* Elementor widgety Konvička - Produkty / Články */

.kv-el-listing--carousel {
    position: relative;
}

/* pred inicializáciou Owl - aby sa karty nezobrazili pod sebou */
.kv-el-carousel:not(.owl-loaded) {
    display: flex;
    overflow: hidden;
}

.kv-el-carousel:not(.owl-loaded) > * {
    flex: 0 0 25%;
    max-width: 25%;
}

/*
 * priestor pre box-shadow kariet - .owl-stage-outer má overflow:hidden a tieň orezával;
 * padding rozšíri viditeľnú oblasť, záporný margin ho vyrovná (rozloženie ani šírky slidov sa nemenia)
 * --kv-el-shadow-x = max. padding stĺpca karty, inak by z kraja vykukovala susedná (skrytá) karta
 */
.kv-el-carousel {
    --kv-el-shadow-y: 20px;
    --kv-el-shadow-x: 8px; /* produkty: col px-2 */
}

.elementor-widget-konvicka-posts .kv-el-carousel {
    --kv-el-shadow-x: 15px; /* články: bootstrap col */
}

.kv-el-carousel .owl-stage-outer {
    padding: var(--kv-el-shadow-y) var(--kv-el-shadow-x);
    margin: calc(-1 * var(--kv-el-shadow-y)) calc(-1 * var(--kv-el-shadow-x));
}

/* šablóny kariet majú bootstrap col-* triedy - v carouseli má šírku slide */
.kv-el-carousel .owl-item > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
}

.kv-el-carousel .owl-nav button.owl-prev,
.kv-el-carousel .owl-nav button.owl-next {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: #129338;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .15);
    cursor: pointer;
    transition: opacity .2s;
}

.kv-el-carousel .owl-nav button.owl-prev {
    left: -10px;
}

.kv-el-carousel .owl-nav button.owl-next {
    right: -10px;
}

.kv-el-carousel .owl-nav button.disabled {
    opacity: .4;
    cursor: default;
}

.kv-el-carousel .owl-dots {
    margin-top: 15px;
    text-align: center;
}

.kv-el-carousel .owl-dot {
    display: inline-block;
    padding: 0 !important;
    border: 0;
    background: none;
}

.kv-el-carousel .owl-dot span {
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 4px;
    border-radius: 50%;
    background: #d6d6d6;
    transition: background-color .2s;
}

.kv-el-carousel .owl-dot.active span {
    background: #129338;
}

@media (max-width: 767px) {
    .kv-el-carousel:not(.owl-loaded) > * {
        flex-basis: 100%;
        max-width: 100%;
    }

    .kv-el-carousel .owl-nav button.owl-prev {
        left: 0;
    }

    .kv-el-carousel .owl-nav button.owl-next {
        right: 0;
    }
}