
.kkfcsl-controls{
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
}

#kkfcsl-controls-top{
    margin:0 0 18px;
}

#kkfcsl-controls-bottom{
    justify-content:center;
    margin:24px 0 8px;
    padding-top:15px;
    border-top:1px solid rgba(0,0,0,.06);
}

.kkfcsl-switch{
    display:inline-flex;
    gap:3px;
    padding:3px;
    border:1px solid rgba(0,0,0,.09);
    border-radius:10px;
    background:#f4f4f4;
}

.kkfcsl-switch a{
    padding:7px 12px;
    border-radius:7px;
    color:#777!important;
    font-size:11px;
    text-decoration:none!important;
    white-space:nowrap;
}

.kkfcsl-switch a.is-active{
    background:#fff;
    color:#222!important;
    font-weight:700;
    box-shadow:0 1px 5px rgba(0,0,0,.06);
}

.kkfcsl-back{
    padding:7px 10px;
    border:1px solid rgba(0,0,0,.08);
    border-radius:8px;
    color:#222!important;
    font-size:11px;
    font-weight:700;
    text-decoration:none!important;
    white-space:nowrap;
}

.kkfcsl-root{
    width:100%;
    margin:0 0 22px;
}

.kkfcsl-loading{
    min-height:70px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#999;
    font-size:11px;
}

.kkfcsl-section-loading{
    min-height:280px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:10px;
    background:linear-gradient(90deg,#f7f7f7 25%,#fbfbfb 40%,#f7f7f7 60%);
    background-size:300% 100%;
    color:#999;
    font-size:11px;
    animation:kkfcsl-loading 1.5s ease infinite;
}

.kkfcsl-section-loading span{
    width:16px;
    height:16px;
    border:2px solid rgba(0,0,0,.10);
    border-top-color:rgba(0,0,0,.42);
    border-radius:50%;
    animation:kkfcsl-spin .75s linear infinite;
}

@keyframes kkfcsl-loading{
    0%{background-position:100% 0}
    100%{background-position:0 0}
}

@keyframes kkfcsl-spin{
    to{transform:rotate(360deg)}
}

/* Hide original grid immediately in carousel mode; reveal it only on failure. */
body.kkfcsl-category-mode .kk-fc-loop-bar,
body.kkfcsl-category-mode .kk-fc-products-grid,
body.kkfcsl-category-mode nav.woocommerce-pagination,
body.kkfcsl-category-mode .kk-fc-shell .kkfcsl-original-result,
body.kkfcsl-category-mode .kk-fc-shell ul.products:not(.kkfcsl-products){
    display:none!important;
}

body.kkfcsl-category-mode.kkfcsl-failed .kk-fc-loop-bar,
body.kkfcsl-category-mode.kkfcsl-failed .kk-fc-products-grid,
body.kkfcsl-category-mode.kkfcsl-failed nav.woocommerce-pagination,
body.kkfcsl-category-mode.kkfcsl-failed .kk-fc-shell .kkfcsl-original-result{
    display:block!important;
}

.kkfcsl-section{
    margin:0 0 24px;
    min-width:0;
}

.kkfcsl-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin:0 0 10px;
}

.kkfcsl-heading h2{
    margin:0!important;
    padding:0!important;
    font-size:15px!important;
    line-height:1.5!important;
    font-weight:700!important;
}

.kkfcsl-nav{
    display:flex;
    align-items:center;
    gap:5px;
}

.kkfcsl-arrow{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    padding:0;
    border:1px solid rgba(0,0,0,.09);
    border-radius:7px;
    background:#fff;
    color:#555;
    cursor:pointer;
}

.kkfcsl-arrow svg,
.kkfcsl-more-icon svg{
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.kkfcsl-arrow svg{
    width:15px;
    height:15px;
}

.kkfcsl-carousel{
    direction:ltr;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    cursor:grab;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
}

.kkfcsl-carousel::-webkit-scrollbar{
    display:none;
}

.kkfcsl-carousel.is-dragging{
    cursor:grabbing;
    user-select:none;
}

body.kk-filter-combo-page ul.products.kkfcsl-products{
    direction:ltr;
    display:flex!important;
    flex-direction:row-reverse!important;
    flex-wrap:nowrap!important;
    width:max-content!important;
    min-width:100%!important;
    max-width:none!important;
    gap:14px!important;
    margin:0!important;
    padding:0 0 3px!important;
    height:auto!important;
}

body.kk-filter-combo-page ul.products.kkfcsl-products > li.product{
    direction:rtl;
    flex:0 0 calc((min(1240px,100vw) - 54px)/4)!important;
    width:calc((min(1240px,100vw) - 54px)/4)!important;
    min-width:210px!important;
    max-width:300px!important;
    margin:0!important;
    float:none!important;
    clear:none!important;
    position:static!important;
    transform:none!important;
    scroll-snap-align:start;
}

body.kk-filter-combo-page ul.products.kkfcsl-products > li.kkfcsl-more-card{
    display:flex!important;
    align-self:stretch;
    border:0!important;
    background:transparent!important;
}

.kkfcsl-more-link{
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    min-height:100%;
    aspect-ratio:1/1.25;
    padding:18px;
    border:1px solid rgba(0,0,0,.10);
    border-radius:10px;
    background:#eef1f2;
    color:#222!important;
    text-align:center;
    text-decoration:none!important;
}

.kkfcsl-more-label{
    color:#777;
    font-size:10px;
}

.kkfcsl-more-link strong{
    font-size:13px;
}

.kkfcsl-more-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:50%;
    background:#fff;
    color:#444;
    box-shadow:0 1px 5px rgba(0,0,0,.06);
}

.kkfcsl-more-icon svg{
    width:20px;
    height:20px;
}

@media(max-width:767px){
    .kkfcsl-controls{
        flex-wrap:wrap;
        gap:7px;
    }

    #kkfcsl-controls-top{
        margin-bottom:14px;
    }

    #kkfcsl-controls-bottom{
        margin-top:20px;
        padding-top:13px;
    }

    .kkfcsl-section{
        margin-bottom:20px;
    }

    .kkfcsl-section-loading{
        min-height:220px;
    }

    .kkfcsl-heading h2{
        font-size:13px!important;
    }

    .kkfcsl-nav{
        display:none;
    }

    .kkfcsl-carousel{
        cursor:auto;
    }

    body.kk-filter-combo-page ul.products.kkfcsl-products{
        gap:8px!important;
    }

    body.kk-filter-combo-page ul.products.kkfcsl-products > li.product{
        flex:0 0 calc((100vw - 34px)/2.5)!important;
        width:calc((100vw - 34px)/2.5)!important;
        min-width:0!important;
        max-width:none!important;
    }

    .kkfcsl-more-link{
        padding:12px;
        border-radius:9px;
    }

    .kkfcsl-more-icon{
        width:38px;
        height:38px;
    }

    .kkfcsl-more-icon svg{
        width:22px;
        height:22px;
    }
}
