/* =========================
   RTL BASE
========================= */
[dir="rtl"] {
  direction: rtl;
  unicode-bidi: isolate;
}
[dir="rtl"] body { text-align: right; }

/* =========================
   BOOTSTRAP HELPERS
========================= */
[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end { text-align: left !important; }
[dir="rtl"] .float-start { float: right !important; }
[dir="rtl"] .float-end { float: left !important; }

/* =========================
   FLEX (UI ONLY)
========================= */
[dir="rtl"] .navbar,
[dir="rtl"] .breadcrumb,
[dir="rtl"] .pagination,
[dir="rtl"] .input-group {
  flex-direction: row-reverse;
}

/* =========================
   FORMS & INPUTS
========================= */
[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select {
  text-align: right;
}

/* input icons */
[dir="rtl"] .input-icon {
  right: 1rem;
  left: auto;
}

/* =========================
   BREADCRUMB
========================= */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
  float: right;
  padding-left: .5rem;
  padding-right: 0;
}

/* =========================
   DROPDOWN / OFFCANVAS
========================= */
[dir="rtl"] .dropdown-menu {
  right: 0;
  left: auto;
  text-align: right;
}

/* =========================
   ABSOLUTE ELEMENTS
========================= */
/* [dir="rtl"] [style*="left:"] { left: auto !important; }
[dir="rtl"] [style*="right:"] { right: auto !important; } */

/* =========================
   ICONS (ARROWS)
========================= */
[dir="rtl"] .icon-arrow,
[dir="rtl"] .chevron,
[dir="rtl"] .bi-arrow-right,
[dir="rtl"] .bi-chevron-right {
  transform: rotate(180deg);
}

/* =========================
   CAROUSEL (FORCE LTR)
========================= */
.carousel,
/*.swiper,*/
.owl-carousel {
  direction: ltr;
}
[dir="rtl"] .carousel-control-prev-icon,
[dir="rtl"] .carousel-control-next-icon {
  transform: rotate(180deg);
}

/* =========================
   UTILITIES SWAP (LEGACY)
========================= */
[dir="rtl"] .ml-1,[dir="rtl"] .ml-2,[dir="rtl"] .ml-3,[dir="rtl"] .ml-4,[dir="rtl"] .ml-5{
  margin-left: 0 !important;
}
[dir="rtl"] .mr-1,[dir="rtl"] .mr-2,[dir="rtl"] .mr-3,[dir="rtl"] .mr-4,[dir="rtl"] .mr-5{
  margin-right: 0 !important;
}
/* =========================
   OFFCANVAS RTL FIX
========================= */
[dir="rtl"] .offcanvas-end {
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

[dir="rtl"] .offcanvas-end.show {
    transform: translateX(0);
}

[dir="rtl"] .offcanvas-start {
    left: auto;
    right: 0;
    
}

[dir="rtl"] .offcanvas-start.show {
    transform: translateX(0);
}


/* RTL adjustments for slider-range */
[dir="rtl"] #slider-range {
    direction: rtl; /* flip the slider direction */
}

/* Range fill (the part that shows the selected value) */
[dir="rtl"] #slider-range .ui-widget-header {
    left: auto;    /* remove LTR left */
    right: 0;      /* start range from right */
}

/* Handle styling */
[dir="rtl"] #slider-range .ui-slider-handle {
    left: auto;    /* remove LTR positioning */
    right: 0;      /* start handle from right */
    /* keep your existing styles */
    border: 1px solid var(--whiteColor);
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background-color: var(--darkColor);
    top: -6px;
}


[dir="rtl"] .sky-blue-badge-md,
[dir="rtl"] .sky-blue-badge-sm,
[dir="rtl"] .sky-blue-badge-lg,
[dir="rtl"] .red-badge-md,
[dir="rtl"] .red-badge-sm,
[dir="rtl"] .green-badge-md,
[dir="rtl"] .green-badge-sm {
  right: 16px;
}
/* =========================
   ICON RIGHT RTL FIX
========================= */

/* لو icon-right باستخدام margin */
[dir="rtl"] .icon-right {
    margin-left: 0 !important;
    margin-right: .5rem !important;
}

/* لو icon-right positioned */
[dir="rtl"] .icon-right {
    right: auto !important;
    left: 0 !important;
}

/* لو icon سهم / اتجاه */
[dir="rtl"] .icon-right svg,
[dir="rtl"] .icon-right i,
[dir="rtl"] .icon-right img {
    transform: rotate(270deg);
}
[dir="rtl"] .icon-right {
    order: -1;
}
/* =========================
   FSH ARROW LIST RTL FIX
========================= */

[dir="rtl"] .fsh-arrow-list-item {
    padding-left: 0;
    padding-right: 24px; /* نفس قيمة ال padding الأصلي */
    text-align: right;
}

/* لو السهم معمول بـ background-image */
[dir="rtl"] .fsh-arrow-list-item::before,
[dir="rtl"] .fsh-arrow-list-item::after {
    left: auto;
    right: 0;
    transform: rotate(270deg);
}


[dir="rtl"] .product-grid-banner-md .red-badge-md {
  position: absolute;
  right: 16px;
  top: 16px;
}

/* RTL Adjustments */
[dir="rtl"] .product-wishlist-btn ,
[dir="rtl"] .product-quickview-btn

{
    left: auto;
    left: 0; /* originally left: 0 */
}

[dir="rtl"] .product-grid-sm:hover .product-wishlist-btn,
[dir="rtl"] .product-grid-banner-lg:hover .product-wishlist-btn,
[dir="rtl"] .product-list-banner:hover .product-wishlist-btn,
[dir="rtl"] .product-grid-md:hover .product-wishlist-btn,
[dir="rtl"].product-grid-md:hover .product-quickview-btn ,
[dir="rtl"] .product-grid-sm:hover .product-quickview-btn,
[dir="rtl"] .product-list-banner:hover .product-quickview-btn,
[dir="rtl"] .product-grid-banner-lg:hover .product-quickview-btn,
[dir="rtl"] .product-grid-banner-md:hover .product-quickview-btn

{
    left: 16px; /* swap with right */
    right: auto;
}

[dir="rtl"] .product-remove-btn {
    right: auto;
    left: -43px; /* swap from right: -43px */
}

[dir="rtl"] .product-grid-sm:hover .product-remove-btn,

[dir="rtl"] .product-grid-md:hover .product-remove-btn {
[dir="rtl"] .product-grid-banner-lg:hover .product-remove-btn {
    right: auto;
    left: 16px;
}

[dir="rtl"] .product-quickview-btn {
    right: auto;
    left: -43px; /* swap from right: -43px */
}

[dir="rtl"] .product-grid-sm:hover .product-quickview-btn,
[dir="rtl"] .product-grid-md:hover .product-quickview-btn ,
[dir="rtl"] .product-list-banner:hover .product-quickview-btn ,
[dir="rtl"] .product-grid-banner-lg:hover .product-quickview-btn 
{
    right: auto;
    left: 16px;
}

/* RTL Fix for Scroll Top */
[dir="rtl"] .scroll-progress-wrap {
    left: auto;
    right: 40px; /* swap from left */
}

[dir="rtl"] .d-flex.justify-content-between {
  flex-direction: row-reverse;
}

/* Drift zoom pane RTL adjustment */
/* ===============================
   RTL – Product Zoom & Media
================================ */

/* عكس اتجاه الكونتينر الأساسي */
html[dir="rtl"] .thumbs-slider-wrap{
    flex-direction: row-reverse;
}

/* ===============================
   Thumbnails (الصور الجانبية)
================================ */
html[dir="rtl"] .tf-product-media-thumbs{
    order: 2;
}

/* ===============================
   Main Image
================================ */
html[dir="rtl"] .tf-product-media-main{
    order: 1;
}

/* ===============================
   Drift Zoom Pane
================================ */
 .tf-zoom-main .drift-zoom-pane{
    left: auto !important;
    right: 0 !important;
}

/* منع حركة زوم غريبة */
.tf-zoom-main .drift-zoom-pane img{
    transform-origin: center center !important;
}

/* ===============================
   Drift Bounding Box
================================ */
html[dir="rtl"] .drift-bounding-box{
    direction: rtl;
}

/* ===============================
   Thumbs Item Overlay
================================ */
html[dir="rtl"] .tf-product-media-thumbs .swiper-slide .item::after{
    right: 0;
    left: 0;
}

/* ===============================
   General RTL Safety
================================ */
html[dir="rtl"] .tf-product-media-thumbs .swiper-slide .item{
    text-align: right;
}
html[dir="rtl"] .tf-product-media-thumbs .swiper-button-next{
    right: auto;
    left: 0;
}