/* =========================================================
   RM GALLERY – FIX DOUBLE ARROWS ISSUE
========================================================= */

/* Kill old text-based arrows */
.rm-gallery-prev,
.rm-gallery-next {
    font-size: 0 !important;
    color: transparent !important;
    line-height: 0 !important;
}

/* Ensure no extra pseudo elements interfere */
.rm-gallery-prev::after,
.rm-gallery-next::after {
    display: none !important;
}

/* =========================================================
RM-GALLERY-ARROWS-V2 (LUXURY UPGRADE)
Keeps layout + JS untouched
Only changes visual style
========================================================= */

/* KEEP CONTAINER + POSITIONING AS YOU HAVE IT */
.woocommerce-product-gallery {
    position: relative;
}

/* BUTTON BASE (NO BACKGROUND BY DEFAULT) */
.rm-gallery-prev,
.rm-gallery-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;

    width: 40px;
    height: 40px;

    border: none;
    background: transparent !important;
    box-shadow: none;

    cursor: pointer;
}

/* CLEAN BLACK ARROWS */
.rm-gallery-prev::before,
.rm-gallery-next::before {
    content: "";

    display: block;
    width: 8px;
    height: 8px;

    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
}

/* DIRECTION */
.rm-gallery-prev::before {
    transform: rotate(135deg);
}

.rm-gallery-next::before {
    transform: rotate(-45deg);
}

/* HOVER STATE – BACKGROUND CIRCLE FIXED */
.rm-gallery-prev:hover,
.rm-gallery-next:hover {
    background: rgba(0, 0, 0, 0.15) !important;
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* HOVER ARROW COLOUR */
.rm-gallery-prev:hover::before,
.rm-gallery-next:hover::before {
    border-color: #000;
}

/* KEEP YOUR POSITION ADJUSTMENT */
.rm-gallery-prev {
    left: 10px;
    margin-left: 100px !important;
}

.rm-gallery-next {
    right: 10px;
}

/*end*/

/* =========================================================
   RM-GALLERY-LAYOUT-V2
   Move Thumbnail Column Further Left
========================================================= */

.woocommerce div.product div.images .flex-control-thumbs {
    transform: translateX(-80px);
}

/* =========================================================
   RM-GALLERY-ARROWS-V4
   Move Right Arrow Right While Keeping Vertical Alignment
========================================================= */

.rm-gallery-next {
    transform: translate(45px, -26px) !important;
}


/* Hiding FlexSlider navigation, */
/* GLOBAL 
.flex-direction-nav {
    display: none !important;
}*/

.single-product .flex-direction-nav {
    display: none !important;
}

/* =========================================================
  RM SINGLE PRODUCT GALLERY - WORKING SCROLL FIX (CLEAN)
========================================================= */

/* Main layout */
.woocommerce div.product div.images {
    display: flex;
    align-items: flex-start;
    overflow-x: hidden;
}

/* Thumbnail column */
.woocommerce div.product div.images .flex-control-thumbs {
    order: -1;
    width: 100px;
    min-width: 100px;
    margin-right: 45px;
    margin-top: 0 !important;
    padding-top: 0 !important;

    /* FIXED SCROLL */
    display: block !important;
    overflow-y: auto;
    overflow-x: hidden;

    /* IMPORTANT: must be fixed (NOT 100%) */
    max-height: 548px;
}

/* Force vertical stacking */
.woocommerce div.product div.images .flex-control-thumbs li {
    width: 100% !important;
    float: none !important;
    display: block !important;
    margin-bottom: 10px;
}

/* Remove extra spacing above main image */
.woocommerce div.product .woocommerce-product-gallery {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Main image takes remaining space */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    flex: 1;
}

/* safety: prevent horizontal scroll leakage */
.woocommerce div.product div.images {
    overflow-x: hidden;
}

/*=====end=========================================================*/

/* =========================================================
   RM GALLERY – CLEAN LUXURY SCROLL (NO UI, NO BLUR)
========================================================= */

/* Base scroll behaviour */
.woocommerce div.product div.images .flex-control-thumbs {
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;

    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;   /* IE/Edge */
}

/* Chrome / Safari */
.woocommerce div.product div.images .flex-control-thumbs::-webkit-scrollbar {
    display: none;
}

/* Subtle spacing for scroll depth (no visual effects) */
.woocommerce div.product div.images .flex-control-thumbs li:last-child {
    margin-bottom: 20px;
}