/* public/js/front/components/Product.css
   Extracted from the <style scoped> block in resources/js/index/components/Product.vue.
   Scoping is dropped (per the CDN-build convention already used for CartSidebar.css etc.) —
   these rules were previously scoped to this component only, so watch for collisions with
   other unscoped stylesheets using the same class names (.product-card, .product-swiper). */

.product-grid {
    margin: 0 -10px;
}

.no-products {
    text-align: center;
    padding: 40px;
    color: #666;
}

.product-slider-wrapper {
    position: relative;
    padding: 0 40px;
}

.product-swiper {
    overflow: hidden;
}

.swiper-button-next,
.swiper-button-prev {
    color: #333;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 20px;
}

.product-card {
    display: flex;
}