/*
 * Bicontinental Group — RTL residue. Enqueued only when is_rtl() (functions.php). Logical
 * properties in theme.css already mirror layout automatically under dir="rtl"; this file is
 * only for what logical properties cannot express: background-image alignment and CSS-drawn
 * chevron/caret direction. Kept under ~60 lines — a large file here would mean theme.css used a
 * physical property somewhere it shouldn't have.
 */

/* Anchor-nav / submenu chevrons: mirror the drawn triangle. */
[dir="rtl"] .bicon-nav__submenu-caret {
	transform: rotate(-135deg);
}

[dir="rtl"] .bicon-nav__submenu-toggle[aria-expanded="true"] .bicon-nav__submenu-caret {
	transform: rotate(45deg);
}

/* Hero "Discover More" scroll-link and card "More about X" link chevrons: both drawn the same
   way (two borders rotated 45deg to form a corner), both need the mirror. Descendant selector,
   not compound — see theme.css's matching rules for why (_css_classes lands on the widget
   wrapper, not the inner <a class="elementor-button">). */
[dir="rtl"] #bicon-main .bicon-hero__scroll-link .elementor-button::after {
	transform: rotate(-45deg) translateY(-2px);
}

[dir="rtl"] #bicon-main .bicon-hero__scroll-link .elementor-button:hover::after {
	transform: rotate(-45deg) translateY(2px);
}

[dir="rtl"] #bicon-main .bicon-card__cta .elementor-button::after {
	transform: rotate(-135deg);
}

[dir="rtl"] #bicon-main .bicon-card__cta .elementor-button:hover::after {
	transform: rotate(-135deg) translate(-2px, -2px);
}

/* PDF link marker glyph. */
[dir="rtl"] .bicon-doc__link::before {
	content: "\25C2";
}

/* Mobile drawer slides from the inline-start edge — the right in Arabic (US-14). The transform
   is a physical-property value, which logical properties cannot express, so it needs the RTL
   override below; the position anchor does not — theme.css's base `inset-inline-start: 0`
   already resolves to `right: 0` under `dir="rtl"` per the CSS spec (inline-start is the right
   edge in RTL), which is the correct anchor. The `inset-inline-end: 0` this rule used to also
   set was the actual bug (confirmed live, 2026-08-12): inline-end is the LEFT edge in RTL, not
   the right as its own comment intended — so it silently re-anchored the drawer to the wrong
   edge and translateX(100%) then moved it further off the *right* of a box that was actually
   left-anchored, overflowing the viewport (measured: scrollWidth 720px against a 375px
   viewport, closed state) instead of hiding off-canvas. Removing the inset overrides restores
   the correct right-edge anchor from theme.css; the transform below is still needed since
   translateX(-100%) — correct for a left-anchored LTR panel — moves a *right*-anchored RTL
   panel further into view instead of off it.

   Scoped to the same `max-width: 1023.98px` as the theme.css drawer block it mirrors. Without
   that scope the transform also applied at >=1024px, where .bicon-nav__panel is not a drawer but
   the plain flex row holding the 6 links and the utility list — translateX(100%) shifted that row
   its own width to the right (measured on /ar/about-us/ at 1440px: panel x=160 -> 1188, all 6 nav
   links landing at x=1591..2120, i.e. 0/6 inside the viewport, with the header clipping them so
   nothing scrolled into reach). Arabic desktop was left with only the CTA visible. */
@media (max-width: 1023.98px) {
	[dir="rtl"] .bicon-nav__panel {
		transform: translateX(100%);
	}

	[dir="rtl"] .bicon-nav__panel.is-open {
		transform: translateX(0);
	}
}

/* Hero background-position stays centred (no directional shift needed). The 2026 redesign
   spec's Home hero overlay IS directional (§5.1: dark-to-light left-to-right, text zone at the
   inline-start 60%) and its gradient uses the physical `to right` keyword — CSS has no logical
   gradient direction keyword, so the mirror lives here. Photographs themselves are never
   flipped (design/02-WIREFRAMES.md section 10). */
[dir="rtl"] .bicon-hero--home::before {
	background-image:
		linear-gradient(rgb(12 14 16 / 0.45), rgb(12 14 16 / 0.45)),
		linear-gradient(to left, rgb(12 14 16 / 0.72) 0%, rgb(12 14 16 / 0.45) 55%, rgb(12 14 16 / 0.15) 100%);
}

/* Anchor sub-nav edge-fade mask (2026 redesign spec §4) — same physical-direction limitation
   as the hero overlay above. */
[dir="rtl"] .bicon-anchornav__nav > ul {
	-webkit-mask-image: linear-gradient(to left, transparent, black 24px, black calc(100% - 24px), transparent);
	mask-image: linear-gradient(to left, transparent, black 24px, black calc(100% - 24px), transparent);
}

/* Honeypot (contract 10 section 3.1's inline `left: -9999px`, WP-010's markup, not ours to edit):
   `left` alone is direction-agnostic, so the field sits at the same huge negative x in both LTR
   and RTL -- but an RTL document's overflow model exposes negative-x content as reachable scroll
   area, ballooning document.scrollingElement.scrollWidth (Observation #42). Adding `right` here
   makes left/width/right all non-auto, which CSS2.1 10.3.7's over-constrained rule resolves by
   ignoring `left` under `direction: rtl` and positioning from `right` instead -- pushing the field
   off in the positive-x direction, which RTL does not expose the same way. */
[dir="rtl"] .bicon-hp {
	left: auto;
	right: -9999px;
}