/*
 * Arabic TEXT DIRECTION layer. Layout is identical to EN, no mirroring.
 * Loaded only on Arabic pages; every selector is prefixed with html[lang="ar"] as a second guard.
 *
 * Rule: only TEXT flows right-to-left within itself; NO box or icon moves.
 *  - Text elements get ONLY unicode-bidi: plaintext (paragraph direction from the first strong character:
 *    Arabic lines from the right, Latin brand / SKU lines from the left). text-align center / right is NOT changed.
 *    'direction' is NOT used: it reverses box order in flex / grid items and is inherited.
 *  - Text elements that CONTAIN an icon / image / form element are excluded (:not(:has(...))) so icons do not jump
 *    to the other side. Browsers without :has skip the rule -> LTR, layout still the same.
 *  - If an Arabic sentence starts with a Latin brand name the paragraph becomes LTR -> an RLM (U+200F) is added in the text layer.
 *  - Price, SKU, order number, email / phone / number fields: inline LTR isolation (not the box).
 *
 * v4:
 *  - plaintext now applies to ALL elements that can hold Arabic text, not only p / h / li / button.
 *  - Low specificity via :where(): the price / SKU LTR isolation below always wins.
 *  - Elements whose direct child is an icon / image / form element are excluded (plaintext is not inherited).
 *  - Inline formatting elements (b, strong, em, small ...) are excluded: inline plaintext isolates, and isolated text
 *    is skipped when finding the paragraph's first strong character.
 *  - ALIGNMENT: plaintext flips text-align:start to the right on Arabic lines. In EN start = left, so body gets
 *    text-align:left (inherited) to keep it the same. Elements with explicit center / right / justify are unchanged.
 */

/* v4: alignment same as EN (start -> left). Elements with explicit text-align are unaffected. */
html[lang="ar"] body {
	text-align: left;
}

/* v4: all elements that can hold Arabic text (block / inline-block / flex item / inline) */
html[lang="ar"] body :where(*:not(svg, svg *, script, style, br, hr, img, picture, video, iframe, input, select, textarea, canvas, option, object, embed, b, strong, em, i, small, sup, sub, abbr, code, kbd, mark, u, s, cite, q, time, bdi, bdo, wbr):not(:has(> svg, > img, > picture, > video, > iframe, > input, > select, > textarea, > canvas, > i, > .hc-lang-flag))) {
	unicode-bidi: plaintext;
}

/* v4: elements with explicit text-align:start (CheckoutWC side cart): start turned right on Arabic lines, left in EN */
html[lang="ar"] :is(#cfw-side-cart, #cfw) :is(.cfw-cart-item-data, .cfw-cart-item-title, tr.cart-subtotal th, tr.order-total th) {
	text-align: left;
}

/* v4b: when the footer © line flows RTL the first link moves to the LEFT of the sentence; the theme gap stayed on the link's
   left (margin-left:14px) so the text looked joined. The gap moves to the right (same as the theme hc-rtl.css dir=rtl rule). */
html[lang="ar"] .hc-foot__copy a {
	margin-left: 0;
	margin-right: 14px;
}

/* v3 (kept) */
html[lang="ar"] :is(p, dd, blockquote, figcaption, h1, h2, h3, h4, h5, h6, li, dt, td, th, label, legend, caption, button, .button,
	.woocommerce-message, .woocommerce-info, .woocommerce-error li,
	.woocommerce-loop-product__title, .product_title):not(:has(svg, img, picture, video, iframe, input, select, textarea, button, i, .hc-lang-flag)) {
	unicode-bidi: plaintext;
}
html[lang="ar"] input[type="text"],
html[lang="ar"] input[type="search"],
html[lang="ar"] textarea {
	unicode-bidi: plaintext;
}

/* Numbers / prices / codes: left to right, isolated from the surrounding Arabic (WooCommerce <bdi> picks its own direction from the first strong character -> overridden) */
html[lang="ar"] .woocommerce-Price-amount,
html[lang="ar"] .woocommerce-Price-amount bdi,
html[lang="ar"] .sku,
html[lang="ar"] .woocommerce-order-overview__order strong,
html[lang="ar"] .order-number,
html[lang="ar"] input[type="email"], html[lang="ar"] input[type="tel"], html[lang="ar"] input[type="number"],
html[lang="ar"] .qty {
	direction: ltr;
	unicode-bidi: isolate;
}

/* v4c: the CheckoutWC checkout page now loads this file.
 *  - order summary rows: EN alignment kept (th left, weight td right); plaintext was flipping start/end on Arabic lines
 *  - "have an account? + login" row: with two isolated inline children (span + a) the paragraph has no strong character -> LTR; children set to normal */
html[lang="ar"] #cfw :is(tr.shipping th, tr.fee th, tr.hc-cart-weight th) {
	text-align: left;
}
html[lang="ar"] #cfw tr.hc-cart-weight td {
	text-align: right;
}
html[lang="ar"] .cfw-have-acc-text > :is(span, a) {
	unicode-bidi: normal;
}
/* v4d: total weight row (th::before scale icon + margin-right 8px). plaintext turned th into an RTL paragraph,
 * so ::before moved right and the gap ended up on the outside. th normal (page direction LTR): icon on the left, 8px gap, the Arabic phrase reads correctly as one piece (same as EN). */
html[lang="ar"] #cfw tr.hc-cart-weight th {
	unicode-bidi: normal;
}

/* v4e: product card "Ships from" row <span lbl> <span store>: two isolated inline children -> no strong character -> LTR,
 * so the Arabic label stayed on the left. Children normal: label on the right, store name to its left (Arabic reading order). Badge box / flag position unchanged. */
html[lang="ar"] .hc-origin__text > span {
	unicode-bidi: normal;
}

/* v4f: same isolation pattern as the "Ships from" fix:
 *  - pack row .hc-pack-info__txt: label + value links + separator spans are inline isolates -> no strong character -> LTR
 *  - attribute values: term links inside <p> are isolates -> LTR. Children normal: Arabic reading order; icon / table / cell positions unchanged. */
html[lang="ar"] .hc-pack-info__txt :is(span, a) {
	unicode-bidi: normal;
}
html[lang="ar"] .woocommerce-product-attributes-item__value a {
	unicode-bidi: normal;
}
/* v4g: homepage "New in store" card (the theme hc-rtl.css is limited to html[dir=rtl], the Arabic site is dir=ltr).
   Badge text RTL (flag on the left as in EN) · price row RTL, alignment same as EN (left) · .from spacing. */
html[lang="ar"] .hc-newin__badge {
	direction: rtl;
	flex-direction: row-reverse;
}
html[lang="ar"] .hc-newin__price {
	unicode-bidi: isolate;
	direction: rtl;
	text-align: left;
}
html[lang="ar"] .hc-newin__price .from {
	margin-left: 4px;
	margin-right: 0;
}
/* v4h: cart item details (WC block weight label): the wrapper span plaintext isolated -> no strong character -> LTR,
   so the value read before the label. Wrapper + name normal (the value stays isolated): label on the right, value to its left; alignment same as EN (left). */
html[lang="ar"] .wc-block-components-product-details > span,
html[lang="ar"] .wc-block-components-product-details__name {
	unicode-bidi: normal;
}
/* v4i: card price. The Arabic ::before prefix made the row RTL -> the range read
   reversed. Price row LTR + isolation (range / del-ins in EN order, dash position same as EN), prefix moved to ::after (label on the right).
   Screen readers unchanged. */
html[lang="ar"] .hc-card__price {
	direction: ltr;
	unicode-bidi: isolate;
}
html[lang="ar"] .hc-card__price.hc-price--from::before {
	content: none;
}
html[lang="ar"] .hc-card__price.hc-price--from::after {
	content: " ابتداءً من";
	color: #666666;
	font-weight: 700;
}

/* Product description: the label span in "li|p > span > b|strong" takes part in paragraph direction.
   Why: the general :where rule above gives unicode-bidi: plaintext to everything except b / strong -> the inline span counted as isolated,
   the paragraph direction came from the Latin / number value and the row was drawn LTR. */
html[lang="ar"] .woocommerce-Tabs-panel--description :is(li, p) > span:first-child:has(> b, > strong) { unicode-bidi: normal; }
/* v4k: in product descriptions a p / li holding a class-less <i> (italic text) hit the icon exception of the general rule (:not(:has(> i)))
   -> no plaintext -> the paragraph was drawn in page direction (LTR).
   A class-less i is not an icon: plaintext restored. */
html[lang="ar"] .woocommerce-Tabs-panel--description :is(p, li):has(> i:not([class])):not(:has(svg, img, picture, video, iframe, input, select, textarea, button, i[class], .hc-lang-flag)) { unicode-bidi: plaintext; }