/*
 * Right-to-left languages (Arabic, Hebrew, Persian, Urdu): the platform's storefront styles mirrored.
 * Loaded after clean.css, sections.css and the store's theme, only when the store is shown in a
 * right-to-left language (the theme's own rtl-style.css handles the theme underneath). Each rule here
 * mirrors one in those files that names a side; rules that are the same on both sides are left alone.
 */

/* ------------------------------------------------------------------ clean.css */
.product_search_form .input-group-prepend { border-right: 0; border-left: 1px solid var(--skin-line); }
.product_info,
.panel--search-result .product_info { text-align: right; }
.pr_flash,
.pr_flash.bg-success,
.pr_flash.bg-danger { left: auto; right: 12px; }
.form-coupon-wrapper .coupon-code { border-right: inherit !important; border-left: 0 !important; }

@media (max-width: 991.98px) {
    /* The phone menu slides in from the left. */
    .header_wrap .navbar-collapse.mobile_side_menu { right: auto; left: 0; transform: translateX(-105%); }
    .pf-menu-ready .header_wrap .navbar-collapse.mobile_side_menu:not(.pf-open) { transform: translateX(-105%); }
    .pf-menu-ready .header_wrap .navbar-collapse.mobile_side_menu.pf-open { transform: none; }
    .header_wrap .navbar-collapse.mobile_side_menu .navbar-nav li.mobile-menu-item .btn-select-language { text-align: right; }

    /* Header line: logo on the right, icons to its left. */
    .bottom_header nav.navbar > .pr_search_icon { margin: 0 auto 0 0; }
    .bottom_header nav.navbar > .attr-nav .cart_count,
    .bottom_header nav.navbar > .attr-nav .wishlist_count { right: auto; left: 0; }
    .pf-brand-in-bar .bottom_header:not(.bottom_header_sticky) nav.navbar > .pf-nav-brand { margin: 0 0 0 auto; }
    .pf-brand-in-bar .bottom_header:not(.bottom_header_sticky) nav.navbar > .pr_search_icon { margin-right: 0; }
    .bottom_header nav.navbar > .side_navbar_toggler { margin: 0 4px 0 0; }

    .header_wrap .product_search_form input.form-control { padding: 0 20px 0 8px !important; }
}

/* ---------------------------------------------------------------- sections.css */
.sx-flag,
.sx-rail-number,
.sp-tile-label,
.sp-card-badges { left: auto; right: 14px; }
.sp-tile-label,
.sp-card-badges { right: 12px; }
.sp-look-caption { left: auto; right: 16px; }
.sx-board-copy { left: auto; right: clamp(18px, 2.4vw, 34px); }
.sp-card-save { right: auto; left: 10px; }
.sx-card-price del { margin-left: 0; margin-right: 6px; }
.sx-spotlight-price del { margin-left: 0; margin-right: 8px; }
.sx-rail-scroll { scroll-padding-left: 0; scroll-padding-right: max(20px, calc((100vw - var(--sx-width)) / 2)); }
.sx-profile-links a,
.sx-profile-card { text-align: right; }
/* Arrows point the way the page reads, and nudge that way on hover. */
.sx-profile-links a i,
.sp-pill i { display: inline-block; transform: scaleX(-1); }
.sx-profile-links a:hover i,
a:hover .sp-pill i { transform: scaleX(-1) translateX(4px); }
.sp-clock { margin-left: 0; margin-right: auto; }

@media (max-width: 767.98px) {
    .sp-clock { margin-right: 0; }
}

/* --------------------------------------------------------------- the themes */
/* Persona and Runway: menus open under their item, lined up with its right edge (the two last items
   open the other way, so they stay on screen). */
@media (min-width: 992px) {
    .bottom_header .navbar-nav:not(.attr-nav) > li > .dropdown-menu,
    .bottom_header .navbar-nav:not(.attr-nav) > li > .dropdown-menu.dropdown-reverse { left: auto !important; right: 0 !important; }
    .bottom_header .navbar-nav:not(.attr-nav) > li:nth-last-child(-n + 2) > .dropdown-menu { left: 0 !important; right: auto !important; }

    /* Runway's search box: the button on the left; in the one-line header it sits next to the icons. */
    .product_search_form .search_btn { right: auto; left: 4px; }
    .product_search_form input.form-control { padding: 0 22px 0 54px; }
    .pf-header-row .bottom_header:not(.bottom_header_sticky) nav.navbar > .product_search_form { margin: 0 auto 0 0; }
    .pf-header-row nav.navbar > .product_search_form .panel--search-result { left: 0; right: auto; }
}

.newsletter_text { padding-left: inherit !important; padding-right: 0 !important; }
.newsletter_form input.form-control { padding-left: 22px; padding-right: 22px; }

@media (max-width: 991.98px) {
    .header_wrap .navbar-collapse.mobile_side_menu { box-shadow: 24px 0 60px rgba(0, 0, 0, .14); }
}
