/* THEME STYLES */
.wp-block-post {
    position: relative;
}

.wp-block-post a:before {
    content: '';
    position: absolute;
    inset: 0;
}

/* CUSTOM STYLES */
@media (min-width: 601px) {
    .wp-block-query.is-style-query-slider { 
        overflow: hidden;
    }
    
}
@media (min-width: 601px) {
    .wp-block-query.is-style-query-slider { 
        position: relative;
        max-width: 100% !important;
    }
    .wp-block-query.is-style-query-slider .wp-block-post-template {
        overflow: visible !important;
        max-width: var(--wp--style--global--wide-size);
        margin-left: auto !important;
        margin-right: auto !important;
    }
}
.wp-block-query.is-style-query-slider .query-slider-controls{
    display:flex;
    align-items:center;
    justify-content:center; 
    gap:12px; 
    margin-top: var(--wp--preset--spacing--60);
}
.wp-block-query.is-style-query-slider .arrow { 
    cursor:pointer;
    font-weight: 700;
    border: 0;
    width: 40px;
    height: 40px;
    background-color: var(--wp--preset--color--base-variant);
    display: flex;
    border-radius: 50%;
    padding: 0;
    align-items: center;
    transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
    transition-duration: .2s;
    justify-content: center;
    color: var(--wp--preset--color--contrast);
    font-size: var(--wp--preset--font-size--large);
    line-height: 1;
}
.wp-block-query.is-style-query-slider .arrow:hover {
    background-color: var(--wp--preset--color--cta-variant);
    color: var(--wp--preset--color--contrast);
}

.wp-block-query.is-style-query-slider .dots {  
    display:inline-flex; 
    gap:8px; 
    margin: 0 var(--wp--preset--spacing--20);
}
.wp-block-query.is-style-query-slider .dot {
    width:10px;
    height:10px;
    cursor: pointer;
    transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
    transition-duration: .2s;
    padding: 0;
    border-radius:999px;
    border: 0;
    background: var(--wp--preset--color--base-variant);
}
.wp-block-query.is-style-query-slider .dot.active {
    background: var(--wp--preset--color--primary);
}

.wp-block-query.is-style-query-slider .wp-block-post-template > .keen-slider__slide {
    opacity: 0;
    transform: scale(0.98);
    transition: opacity 180ms ease, transform 180ms ease;
    will-change: opacity, transform;
    pointer-events: none;
}

.wp-block-query.is-style-query-slider .wp-block-post-template > .keen-slider__slide.is-visible {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}


.wp-block-group[class*="is-style-section-base-variant"] .wp-block-query.is-style-query-slider .dot:not(.active) {
    background: var(--wp--preset--color--base); 
}

.wp-block-group[class*="is-style-section-base-variant"] .wp-block-query.is-style-query-slider .arrow:not(:hover) {
    background-color: var(--wp--preset--color--base);
}

@media (max-width: 600px) {
    .has-background .wp-block-query.is-style-query-slider:has( >.wp-block-post-template ),
    [class*="is-style-section-"] .wp-block-query.is-style-query-slider:has( >.wp-block-post-template ) {
        margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
        margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
    }
    .wp-block-query.is-style-query-slider {
        margin-inline: calc(var(--wp--style--root--padding-left) * -1) calc(var(--wp--style--root--padding-right) * -1) !important;
    }

    .is-style-query-slider ul.wp-block-post-template {
        display: flex !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        padding-left: var(--wp--style--root--padding-left) !important;
        padding-right: var(--wp--style--root--padding-right) !important;
        gap: 0;
        padding-inline: var(--wp--style--root--padding-left) var(--wp--style--root--padding-right);
        scroll-padding-inline: var(--wp--style--root--padding-left) var(--wp--style--root--padding-right);
        list-style: none;
        margin: 0;
        padding-block: 0;
    }

    .is-style-query-slider ul.wp-block-post-template > li.wp-block-post {
        flex: 0 0 80%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .is-style-query-slider ul.wp-block-post-template > li.wp-block-post:only-child {
        flex-basis: 100%;
    }

    .is-style-query-slider ul.wp-block-post-template {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1rem;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .is-style-query-slider ul.wp-block-post-template::-webkit-scrollbar {
        height: 8px;
    }
    .is-style-query-slider ul.wp-block-post-template::-webkit-scrollbar-thumb {
        border-radius: 8px;
    }
}