/**
 * Jantel Child – RTL layout fixes (loaded only when is_rtl()).
 * Parent theme already ships partial RTL rules in assets/css/style.css;
 * this file completes and corrects them without touching the parent.
 */

/* ---------------------------------------------------------------------------
 * 1) Side panels: cart sidebar & hidden panels open from the LEFT in RTL
 *    (mirrored from LTR right) – parent uses pos-right fixed positioning.
 * ------------------------------------------------------------------------- */
body.rtl .pxl-side-cart,
body.rtl .pxl-hidden-template.pos-right {
	right: auto;
	left: 0;
	transform: translateX(-100%);
}
body.rtl .pxl-hidden-template.pos-right.pxl-active,
body.rtl .pxl-side-cart.pxl-active {
	transform: translateX(0);
}

/* Final QA 2026-10-13: parent JS toggles `.open` (not `.pxl-active`) on the
 * side cart, and the inner wrap is fixed to `right:0` by the parent, which
 * keeps the panel off-screen in RTL. Slide the wrap from the LEFT instead. */
body.rtl .pxl-side-cart.open,
body.rtl .pxl-hidden-template.pos-right.open {
	transform: translateX(0);
}
body.rtl .pxl-side-cart .pxl-hidden-template-wrap,
body.rtl .pxl-hidden-template.pos-right .pxl-hidden-template-wrap {
	right: auto;
	left: 0;
}
body.rtl .pxl-hidden-template.pos-left {
	left: auto;
	right: 0;
	transform: translateX(100%);
}
body.rtl .pxl-hidden-template.pos-left.pxl-active {
	transform: translateX(0);
}

/* Close button inside panels */
body.rtl .pxl-hidden-template-wrap .pxl-close {
	right: auto;
	left: 24px;
}

/* Panel header: title right, close left (mirrored) */
body.rtl .pxl-panel-header .panel-header-inner {
	flex-direction: row-reverse;
}

/* ---------------------------------------------------------------------------
 * 2) Search popup input alignment
 * ------------------------------------------------------------------------- */
body.rtl #pxl-search-popup .search-field {
	text-align: right;
}
body.rtl #pxl-search-popup form {
	direction: rtl;
}

/* ---------------------------------------------------------------------------
 * 3) Main navigation dropdown submenus open to the left of the parent item
 * ------------------------------------------------------------------------- */
body.rtl .pxl-menu-primary .sub-menu,
body.rtl .pxl-menu-primary .children {
	left: auto;
	right: 0;
	text-align: right;
}
body.rtl .pxl-menu-primary .sub-menu .sub-menu {
	right: 100%;
	left: auto;
}

/* Breadcrumb separators */
body.rtl .pxl-breadcrumb li + li::before {
	content: "\2013"; /* en dash */
}

/* ---------------------------------------------------------------------------
 * 4) Sliders / carousels arrows (Swiper) – mirror sides in RTL
 * ------------------------------------------------------------------------- */
body.rtl .pxl-swiper-arrow {
	transform: scaleX(-1);
}

/* Cursor arrows already handled by theme (rotate-180 class); keep icons LTR */
body.rtl .pxl-cursor-arrow-prev .flaticon,
body.rtl .pxl-cursor-arrow-next .flaticon {
	transform: none;
}

/* ---------------------------------------------------------------------------
 * 5) Product loops: sale badge, rating stars, price alignment
 * ------------------------------------------------------------------------- */
body.rtl ul.products li.product .onsale {
	left: auto;
	right: 16px;
}
body.rtl .star-rating {
	float: left;
}

/* WooCommerce message icons */
body.rtl .woocommerce-message,
body.rtl .woocommerce-info,
body.rtl .woocommerce-error {
	border-inline-start-width: 4px;
	border-inline-end-width: 0;
	text-align: right;
}

/* ---------------------------------------------------------------------------
 * 6) Forms: labels, inputs, checkboxes/radios – correct RTL flow
 * ------------------------------------------------------------------------- */
body.rtl .woocommerce form .form-row label,
body.rtl label {
	text-align: right;
}
body.rtl input[type="text"],
body.rtl input[type="email"],
body.rtl input[type="tel"],
body.rtl input[type="url"],
body.rtl input[type="password"],
body.rtl input[type="search"],
body.rtl textarea,
body.rtl select {
	text-align: right;
}
/* keep emails/codes typed LTR */
body.rtl input[type="email"],
body.rtl input[type="url"] {
	direction: ltr;
	text-align: right;
}
body.rtl .woocommerce-form-login .form-row.rememberme {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-direction: row-reverse;
	justify-content: flex-end;
}

/* Quantity input group */
body.rtl .quantity {
	direction: ltr;
}
body.rtl .quantity .qty {
	text-align: center;
}

/* ---------------------------------------------------------------------------
 * 7) My Account navigation – tabs appear right, content left
 * ------------------------------------------------------------------------- */
body.rtl .woocommerce-MyAccount-navigation {
	float: right;
}
body.rtl .woocommerce-MyAccount-navigation ul {
	text-align: right;
}
body.rtl .woocommerce-MyAccount-content {
	float: left;
}

/* ---------------------------------------------------------------------------
 * 8) Checkout: coupon, order review table alignment
 * ------------------------------------------------------------------------- */
body.rtl #coupon_code.input-text {
	float: right;
}
body.rtl .woocommerce-checkout-review-order-table th,
body.rtl .woocommerce-checkout-review-order-table td {
	text-align: right;
}
body.rtl .shop_table th,
body.rtl .shop_table td {
	text-align: right;
}

/* Payment methods radio alignment */
body.rtl #payment .payment_methods li label {
	display: block;
	text-align: right;
}
body.rtl #payment .payment_methods li input[type="radio"] {
	margin-left: 8px;
	margin-right: 0;
}

/* ---------------------------------------------------------------------------
 * 9) Shop toolbar / result count / ordering dropdown
 * ------------------------------------------------------------------------- */
body.rtl .woocommerce-result-count {
	float: right;
}
body.rtl .woocommerce-ordering {
	float: left;
}
body.rtl .woocommerce-ordering select {
	text-align: right;
}

/* Widget price filter slider handles order */
body.rtl .widget_price_filter .price_slider_amount .button {
	float: left;
}
body.rtl .widget_price_filter .price_label {
	float: right;
}

/* Layered nav / filters widgets */
body.rtl .widget_layered_nav ul,
body.rtl .widget_product_categories ul {
	text-align: right;
}
body.rtl .widget_layered_nav ul li a::before,
body.rtl .widget_product_categories ul li a::before {
	float: right;
	margin-left: 8px;
	margin-right: 0;
}

/* ---------------------------------------------------------------------------
 * 10) Pagination arrows
 * ------------------------------------------------------------------------- */
body.rtl .woocommerce-pagination .page-numbers li .next,
body.rtl .pxl-pagination .next {
	transform: scaleX(-1);
}
body.rtl .woocommerce-pagination .page-numbers li .prev,
body.rtl .pxl-pagination .prev {
	transform: scaleX(-1);
}

/* ---------------------------------------------------------------------------
 * 13) Elementor grid widgets: arrows & progress bars
 * ------------------------------------------------------------------------- */
body.rtl .pxl-swiper-arrow-next {
	right: auto;
	left: 0;
}
body.rtl .pxl-swiper-arrow-prev {
	left: auto;
	right: 0;
}

/* ---------------------------------------------------------------------------
 * 11) Blog meta (date, author, categories) icon/text order
 * ------------------------------------------------------------------------- */
body.rtl .pxl-post-meta,
body.rtl .post-meta {
	flex-direction: row-reverse;
}
body.rtl .pxl-post-meta .meta-item i + span,
body.rtl .post-meta i + span {
	margin-left: 6px;
}

/* ---------------------------------------------------------------------------
 * 12) Footer widgets text alignment
 * ------------------------------------------------------------------------- */
body.rtl .pxl-footer .widget,
body.rtl .pxl-footer .widget ul {
	text-align: right;
}
body.rtl .pxl-footer .pxl-social span {
	margin-left: 10px;
	margin-right: 0;
}

/* Scroll-to-top button stays bottom-left in RTL (mirrored) */
body.rtl #pxl-scroll-top {
	right: auto;
	left: 24px;
}