/* Homepage Swiper carousel and arrow fixes */

/* Fix Swiper navigation placement in RTL mode: swap left/right positions */
body[data-is-rtl='1'] .swiper-button-prev { right: 10px !important; left: auto !important; }
body[data-is-rtl='1'] .swiper-button-next { left: 10px !important; right: auto !important; }

/* Ensure arrow icons reflect direction (fallback if Swiper doesn't add rtl class) */
body[data-is-rtl='1'] .swiper-button-prev:after { content: 'next' !important; }
body[data-is-rtl='1'] .swiper-button-next:after { content: 'prev' !important; }

/* Home page featured/product carousels: keep arrows clickable above product cards */
.swiper-arrow { overflow: hidden; position: relative; }
.swiper-arrow .swiper-wrapper { position: relative; z-index: 1; }
.swiper-arrow .swiper-button-next,
.swiper-arrow .swiper-button-prev {
    position: absolute;
    z-index: 50;
    pointer-events: auto;
    cursor: pointer;
    touch-action: manipulation;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper-arrow .swiper-button-next:after,
.swiper-arrow .swiper-button-prev:after { display: none; }

/* Keep arrows inside the carousel so they are not clipped */
.swiper-arrow .swiper-button-next { right: 10px; }
.swiper-arrow .swiper-button-prev { left: 10px; }
body[data-is-rtl='1'] .swiper-arrow .swiper-button-prev { right: 10px !important; left: auto !important; }
body[data-is-rtl='1'] .swiper-arrow .swiper-button-next { left: 10px !important; right: auto !important; }

.swiper-arrow .swiper-button-next ion-icon,
.swiper-arrow .swiper-button-prev ion-icon { font-size: 18px; }