/* =========================================================
   FT-WORLDS CATEGORY PRODUCT SLIDERS - V7
   Clean responsive layout - no clipped buttons / no forced height
   ========================================================= */

.ftw-cps-sections,
.ftw-cps-sections *{box-sizing:border-box !important;}

.ftw-cps-sections{
    width:100% !important;
    max-width:1400px !important;
    margin:0 auto !important;
    padding:0 18px !important;
    overflow:hidden !important;
}

.ftw-cps-section{
    width:100% !important;
    margin:0 0 42px !important;
    padding:0 !important;
    clear:both !important;
}

.ftw-cps-heading{
    width:100% !important;
    margin:0 0 18px !important;
    padding:0 !important;
}
.ftw-cps-heading h2{
    margin:0 0 5px !important;
    padding:0 !important;
    font-size:28px !important;
    line-height:34px !important;
    font-weight:700 !important;
    color:#111 !important;
    text-align:left !important;
}
.ftw-cps-heading p{
    margin:0 !important;
    padding:0 !important;
    font-size:14px !important;
    line-height:20px !important;
    color:#777 !important;
    text-align:left !important;
}

/* The slider is the ONLY horizontal scroll area. Its height is natural. */
.ftw-cps-slider{
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
    -webkit-overflow-scrolling:touch !important;
    scroll-behavior:smooth !important;
    touch-action:pan-x !important;
    overscroll-behavior-x:contain !important;
}
.ftw-cps-slider::-webkit-scrollbar{display:none !important;}
.ftw-cps-slider.ftw-cps-dragging{cursor:grabbing !important;scroll-behavior:auto !important;}

.ftw-cps-track{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    width:max-content !important;
    min-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 1px !important;
}

/* Equal-width/equal-height cards without a fixed slider height. */
.ftw-cps-card{
    flex:0 0 var(--ftw-card-width,250px) !important;
    width:var(--ftw-card-width,250px) !important;
    min-width:var(--ftw-card-width,250px) !important;
    max-width:var(--ftw-card-width,250px) !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid #e3e3e3 !important;
    border-radius:0 !important;
    background:#fff !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    overflow:hidden !important;
    float:none !important;
    vertical-align:top !important;
}

.ftw-cps-image{
    flex:0 0 300px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:300px !important;
    margin:0 !important;
    padding:0 !important;
    background:#fff !important;
    overflow:hidden !important;
    text-decoration:none !important;
}
.ftw-cps-image img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    object-fit:contain !important;
    margin:0 !important;
    padding:8px !important;
    border:0 !important;
}

/* Information area has a real bottom-anchored button. */
.ftw-cps-info{
    flex:1 1 auto !important;
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    min-height:190px !important;
    margin:0 !important;
    padding:12px 14px 12px !important;
    background:#fff !important;
    overflow:visible !important;
}

.ftw-cps-title{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
    width:100% !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    flex:0 0 44px !important;
    margin:0 0 6px !important;
    padding:0 !important;
    color:#333 !important;
    font-size:16px !important;
    line-height:22px !important;
    font-weight:400 !important;
    text-decoration:none !important;
}

.ftw-cps-category{
    display:block !important;
    width:100% !important;
    height:18px !important;
    min-height:18px !important;
    max-height:18px !important;
    flex:0 0 18px !important;
    margin:0 0 6px !important;
    padding:0 !important;
    overflow:hidden !important;
    color:#888 !important;
    font-size:11px !important;
    line-height:18px !important;
    letter-spacing:1px !important;
    text-transform:uppercase !important;
}

.ftw-cps-price{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    min-height:27px !important;
    max-height:54px !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    color:#222 !important;
    font-size:18px !important;
    line-height:25px !important;
    white-space:normal !important;
}
.ftw-cps-price del{color:#999 !important;margin-right:4px !important;}
.ftw-cps-price ins{text-decoration:none !important;}

/* Button wrapper is pushed to the bottom and never clipped. */
.ftw-cps-button-wrap{
    display:block !important;
    width:100% !important;
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    flex:0 0 50px !important;
    margin-top:auto !important;
    margin-bottom:0 !important;
    padding:0 !important;
    line-height:0 !important;
    overflow:visible !important;
}

.ftw-cps-btn,
.ftw-cps-btn:link,
.ftw-cps-btn:visited,
.ftw-cps-btn:hover,
.ftw-cps-btn:focus,
.ftw-cps-btn:active{
    all:unset !important;
    -webkit-appearance:none !important;
    appearance:none !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:50px !important;
    min-width:100% !important;
    max-width:100% !important;
    min-height:50px !important;
    max-height:50px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid #222 !important;
    border-radius:0 !important;
    background:#fff !important;
    color:#222 !important;
    font-family:inherit !important;
    font-size:16px !important;
    font-weight:400 !important;
    line-height:50px !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    box-shadow:none !important;
    opacity:1 !important;
    visibility:visible !important;
}
.ftw-cps-btn:hover{background:#111 !important;color:#fff !important;}
.ftw-cps-btn:focus-visible{outline:2px solid #111 !important;outline-offset:2px !important;}
.ftw-cps-btn.ftw-cps-loading{opacity:.55 !important;pointer-events:none !important;}
.ftw-cps-soldout{color:#999 !important;border-color:#aaa !important;cursor:default !important;}

.ftw-cps-overlay-arrow{display:none !important;}

/* Navigation is outside the cards and never overlaps View All. */
.ftw-cps-bottom-controls{
    position:relative !important;
    z-index:2 !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:18px !important;
    width:100% !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    margin:16px 0 0 !important;
    padding:0 !important;
    clear:both !important;
    overflow:visible !important;
    line-height:1 !important;
}
.ftw-cps-bottom-arrow{
    all:unset !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:24px !important;
    min-width:24px !important;
    max-width:24px !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    color:#777 !important;
    font-family:Arial,sans-serif !important;
    font-size:23px !important;
    font-weight:400 !important;
    line-height:34px !important;
    text-align:center !important;
    cursor:pointer !important;
    box-shadow:none !important;
}
.ftw-cps-bottom-arrow:hover{color:#111 !important;background:transparent !important;}
.ftw-cps-counter{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    margin:0 !important;
    padding:0 !important;
    color:#555 !important;
    font-size:14px !important;
    line-height:34px !important;
    text-align:center !important;
}

.ftw-cps-view-all-wrap{
    position:relative !important;
    z-index:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:10px 0 0 !important;
    padding:0 !important;
    clear:both !important;
    overflow:visible !important;
}
.ftw-cps-view-all,
.ftw-cps-view-all:link,
.ftw-cps-view-all:visited,
.ftw-cps-view-all:hover,
.ftw-cps-view-all:focus,
.ftw-cps-view-all:active{
    all:unset !important;
    -webkit-appearance:none !important;
    appearance:none !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:155px !important;
    min-width:155px !important;
    max-width:155px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid #222 !important;
    border-radius:0 !important;
    background:#fff !important;
    color:#222 !important;
    font-family:inherit !important;
    font-size:16px !important;
    font-weight:400 !important;
    line-height:52px !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    box-shadow:none !important;
}
.ftw-cps-view-all:hover{background:#111 !important;color:#fff !important;}
.ftw-cps-view-all:focus-visible{outline:2px solid #111 !important;outline-offset:2px !important;}

@media (max-width:1100px){
    .ftw-cps-sections{padding:0 14px !important;}
    .ftw-cps-image{flex-basis:280px !important;height:280px !important;}
    .ftw-cps-info{min-height:182px !important;padding:11px 12px 11px !important;}
    .ftw-cps-title{font-size:15px !important;line-height:21px !important;height:42px !important;min-height:42px !important;max-height:42px !important;flex-basis:42px !important;}
    .ftw-cps-btn,.ftw-cps-button-wrap{height:48px !important;min-height:48px !important;max-height:48px !important;flex-basis:48px !important;}
    .ftw-cps-btn{line-height:48px !important;}
}

@media (max-width:768px){
    .ftw-cps-sections{padding:0 10px !important;}
    .ftw-cps-section{margin-bottom:34px !important;}
    .ftw-cps-heading{margin-bottom:14px !important;}
    .ftw-cps-heading h2{font-size:23px !important;line-height:29px !important;}
    .ftw-cps-heading p{font-size:13px !important;line-height:19px !important;}
    .ftw-cps-track{gap:8px !important;}
    .ftw-cps-image{flex-basis:205px !important;height:205px !important;}
    .ftw-cps-image img{padding:6px !important;}
    .ftw-cps-info{min-height:158px !important;padding:8px 9px 9px !important;}
    .ftw-cps-title{height:36px !important;min-height:36px !important;max-height:36px !important;flex-basis:36px !important;font-size:13px !important;line-height:18px !important;margin-bottom:4px !important;}
    .ftw-cps-category{height:16px !important;min-height:16px !important;max-height:16px !important;flex-basis:16px !important;font-size:9px !important;line-height:16px !important;margin-bottom:4px !important;}
    .ftw-cps-price{font-size:14px !important;line-height:20px !important;min-height:20px !important;max-height:40px !important;}
    .ftw-cps-button-wrap{height:44px !important;min-height:44px !important;max-height:44px !important;flex-basis:44px !important;}
    .ftw-cps-btn{height:44px !important;min-height:44px !important;max-height:44px !important;font-size:13px !important;line-height:44px !important;}
    .ftw-cps-bottom-controls{height:32px !important;min-height:32px !important;max-height:32px !important;margin-top:14px !important;gap:12px !important;}
    .ftw-cps-bottom-arrow,.ftw-cps-counter{height:32px !important;min-height:32px !important;max-height:32px !important;}
    .ftw-cps-view-all-wrap{height:46px !important;min-height:46px !important;max-height:46px !important;margin-top:9px !important;}
    .ftw-cps-view-all{width:130px !important;min-width:130px !important;max-width:130px !important;height:46px !important;min-height:46px !important;max-height:46px !important;font-size:14px !important;line-height:46px !important;}
}

@media (max-width:480px){
    .ftw-cps-sections{padding:0 8px !important;}
    .ftw-cps-track{gap:7px !important;}
    .ftw-cps-image{flex-basis:185px !important;height:185px !important;}
    .ftw-cps-info{min-height:150px !important;padding:7px 8px 8px !important;}
    .ftw-cps-title{height:36px !important;min-height:36px !important;max-height:36px !important;flex-basis:36px !important;font-size:12px !important;line-height:18px !important;}
    .ftw-cps-price{font-size:13px !important;line-height:19px !important;}
    .ftw-cps-button-wrap,.ftw-cps-btn{height:42px !important;min-height:42px !important;max-height:42px !important;flex-basis:42px !important;}
    .ftw-cps-btn{font-size:12px !important;line-height:42px !important;}
}

/* =========================================================
   V9 FINAL LAYOUT FIX
   - Give the information area enough real height for title/category/price/button.
   - Keep equal card heights while leaving breathing room below the button.
   - Never clip the Add to cart label on mobile.
   ========================================================= */
.ftw-cps-card,
.ftw-cps-info,
.ftw-cps-button-wrap,
.ftw-cps-btn,
.ftw-cps-view-all-wrap,
.ftw-cps-view-all{box-sizing:border-box !important;}

/* Desktop: enough room for all content + button + bottom breathing space. */
.ftw-cps-info{
    height:220px !important;
    min-height:220px !important;
    max-height:220px !important;
    flex:0 0 220px !important;
    padding:12px 14px 14px !important;
    overflow:visible !important;
}

.ftw-cps-button-wrap{
    position:relative !important;
    width:100% !important;
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    flex:0 0 50px !important;
    margin-top:auto !important;
    margin-bottom:0 !important;
    padding:0 !important;
    overflow:visible !important;
}

.ftw-cps-btn,
.ftw-cps-btn:link,
.ftw-cps-btn:visited,
.ftw-cps-btn:hover,
.ftw-cps-btn:focus,
.ftw-cps-btn:active{
    position:relative !important;
    display:block !important;
    box-sizing:border-box !important;
    width:100% !important;
    height:50px !important;
    min-width:100% !important;
    min-height:50px !important;
    max-height:50px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid #222 !important;
    line-height:normal !important;
    text-align:left !important;
    transform:none !important;
}

.ftw-cps-btn .ftw-cps-btn-label{
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    font-family:inherit !important;
    font-size:16px !important;
    font-weight:400 !important;
    line-height:1 !important;
    text-align:center !important;
    white-space:nowrap !important;
}

/* Navigation always has its own breathing room after the cards. */
.ftw-cps-bottom-controls{
    margin-top:18px !important;
    margin-bottom:0 !important;
}

.ftw-cps-view-all-wrap{
    height:54px !important;
    min-height:54px !important;
    max-height:54px !important;
    margin-top:12px !important;
    margin-bottom:0 !important;
    padding:0 !important;
    overflow:visible !important;
}

.ftw-cps-view-all,
.ftw-cps-view-all:link,
.ftw-cps-view-all:visited,
.ftw-cps-view-all:hover,
.ftw-cps-view-all:focus,
.ftw-cps-view-all:active{
    position:relative !important;
    display:block !important;
    box-sizing:border-box !important;
    width:155px !important;
    min-width:155px !important;
    max-width:155px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid #222 !important;
    line-height:normal !important;
    text-align:left !important;
}

.ftw-cps-view-all .ftw-cps-view-all-label{
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    font-family:inherit !important;
    font-size:16px !important;
    font-weight:400 !important;
    line-height:1 !important;
    text-align:center !important;
    white-space:nowrap !important;
}

@media (max-width:1100px){
    .ftw-cps-info{
        height:212px !important;
        min-height:212px !important;
        max-height:212px !important;
        flex-basis:212px !important;
        padding:11px 12px 14px !important;
    }
    .ftw-cps-button-wrap,
    .ftw-cps-btn{
        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;
        flex-basis:48px !important;
    }
    .ftw-cps-btn .ftw-cps-btn-label{font-size:15px !important;}
}

@media (max-width:768px){
    /* Mobile gets a larger information area on purpose so nothing can be clipped. */
    .ftw-cps-info{
        height:188px !important;
        min-height:188px !important;
        max-height:188px !important;
        flex-basis:188px !important;
        padding:9px 9px 13px !important;
        overflow:visible !important;
    }
    .ftw-cps-title{
        overflow:hidden !important;
    }
    .ftw-cps-price{
        overflow:visible !important;
    }
    .ftw-cps-button-wrap,
    .ftw-cps-btn{
        height:44px !important;
        min-height:44px !important;
        max-height:44px !important;
        flex-basis:44px !important;
    }
    .ftw-cps-btn .ftw-cps-btn-label{
        font-size:13px !important;
        line-height:1 !important;
    }
    .ftw-cps-bottom-controls{
        margin-top:18px !important;
    }
    .ftw-cps-view-all-wrap{
        height:50px !important;
        min-height:50px !important;
        max-height:50px !important;
        margin-top:10px !important;
    }
    .ftw-cps-view-all{
        width:130px !important;
        min-width:130px !important;
        max-width:130px !important;
        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;
    }
    .ftw-cps-view-all .ftw-cps-view-all-label{font-size:14px !important;}
}

@media (max-width:480px){
    .ftw-cps-info{
        height:180px !important;
        min-height:180px !important;
        max-height:180px !important;
        flex-basis:180px !important;
        padding:8px 8px 12px !important;
    }
    .ftw-cps-button-wrap,
    .ftw-cps-btn{
        height:44px !important;
        min-height:44px !important;
        max-height:44px !important;
        flex-basis:44px !important;
    }
    .ftw-cps-btn .ftw-cps-btn-label{font-size:12px !important;}
    .ftw-cps-bottom-controls{margin-top:16px !important;}
    .ftw-cps-view-all-wrap{margin-top:9px !important;}
}