@import '../../style/themes/index';
@import '../../style/mixins/index';

@carousel-prefix-cls: ~'@{ant-prefix}-carousel';

.@{carousel-prefix-cls} {
  &-rtl {
    direction: rtl;

    .slick-next {
      right: auto;
      left: @carousel-arrow-offset;

      &::after {
        // In RTL, next points to the left
        transform: rotate(-45deg);
      }
    }

    .slick-prev {
      right: @carousel-arrow-offset;
      left: auto;

      &::after {
        // In RTL, previous points to the right
        transform: rotate(135deg);
      }
    }
  }

  .slick-track {
    .@{carousel-prefix-cls}-rtl & {
      right: 0;
      left: auto;
    }
  }
  // Dots
  .slick-dots {
    .@{carousel-prefix-cls}-rtl& {
      flex-direction: row-reverse;
    }
  }
}

.@{ant-prefix}-carousel-vertical {
  .slick-dots {
    .@{carousel-prefix-cls}-rtl& {
      flex-direction: column;
    }
  }
}

// Vertical arrows in RTL follow the same reversal as LTR (prev up, next down)
.@{carousel-prefix-cls} {
  .@{carousel-prefix-cls}-rtl & {
    .slick-vertical {
      .slick-prev::after {
        transform: rotate(45deg);
      }

      .slick-next::after {
        transform: rotate(-135deg);
      }
    }
  }
}