/* ==========================================================================
   Fast Step — RTL overrides
   Loaded only when is_rtl() (e.g. Arabic). Mirrors the directional rules from
   theme.css and swaps the type stack so Arabic glyphs render in an Arabic face
   while Latin (brand names, SKUs) keeps the industrial Archivo/Hanken look.
   ========================================================================== */

:root {
	/* Latin first (FAST STEP, SKUs) → Arabic fallback for Arabic glyphs. */
	--fs-display: 'Archivo', 'Cairo', system-ui, sans-serif;
	--fs-body:    'Hanken Grotesk', 'Tajawal', system-ui, sans-serif;
}

.fs-site { text-align: right; }

/* Direction-aware icons: the SVG "forward" arrow (in CTAs) points the other way. */
.fs-icon--arrow { transform: scaleX(-1); }
/* Carousel/slider chevron BUTTONS stay outward (‹ ›). Keep their little groups
   in a fixed visual order so RTL flex-reordering can't flip them into "› ‹". */
.fs-arrows { direction: ltr; }

/* ---- header ---- */
.fs-search__cat { border-right: none; border-left: 1px solid var(--fs-line); }
.fs-search__cat svg { right: auto; left: 12px; }
.fs-bubble { right: auto; left: -9px; }
.fs-cartbtn__ico .fs-bubble { right: auto; left: -10px; }
.fs-nav { margin-left: 0; margin-right: 8px; }
.fs-bulk { margin-left: 0; margin-right: auto; }

/* ---- mega menu ---- */
.fs-mega { left: auto; right: 0; }
.fs-mega__cat { border-left: none; border-right: 3px solid transparent; }
.fs-mega__cat:hover, .fs-mega__cat.is-active { border-right-color: var(--fs-amber); border-left-color: transparent; }
/* The › glyph is auto-mirrored to ‹ (points left, toward the panel) in RTL — no transform needed. */
.fs-mega__feat-tag { left: auto; right: 16px; }

/* ---- hero ---- */
.fs-dealcard__gear { right: auto; left: -40px; }

/* ---- trust strip ---- */
.fs-trust__item { border-right: none; border-left: 1px solid var(--fs-ink-2); }
.fs-trust__item:last-child { border-left: none; }

/* ---- spotlight ---- */
.fs-spotlight__copy { padding: 66px 0 66px 56px; }
.fs-spotlight__media { border-left: none; border-right: 1px solid var(--fs-ink-3); }
.fs-spotlight__warranty { right: auto; left: 28px; }

/* ---- B2B ---- */
.fs-b2b__bg { right: auto; left: -30px; transform: scaleX(-1); }

/* ---- product card ---- */
.fs-card__badge { left: auto; right: 12px; }
.fs-card__wish { right: auto; left: 10px; }

/* ---- cart drawer: slides in from the left in RTL ---- */
.fs-drawer { right: auto; left: 0; transform: translateX(-100%); box-shadow: 24px 0 60px rgba(0,0,0,.28); }
.fs-drawer-open .fs-drawer { transform: translateX(0); }

/* ---- PDP ---- */
.fs-pdp__badge { left: auto; right: 18px; }
.fs-pdp__spec dd { text-align: left; }
.fs-pdp__panel ul { padding-left: 0; padding-right: 20px; }

/* ---- WooCommerce tables / forms ---- */
.woocommerce table.shop_table th { text-align: right; }
.fs-plp-sort select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea { text-align: right; }

/* ---- custom checkout (mirror the LTR step rail + summary table) ---- */
.fs-co-step::after { margin-left: 0; margin-right: 10px; }
.fs-co-side .woocommerce-checkout-review-order-table th { text-align: right; }
.fs-co-side .woocommerce-checkout-review-order-table td { text-align: left; }

/* ---- hero slider: mirror only the overlay gradient. The ‹/› arrows already
   point outward and read the same either way, so leave their position + glyph
   exactly as the LTR base (prev = left ‹, next = right ›). ---- */
.fs-slide__shade { background: linear-gradient(270deg, rgba(11,11,12,.85) 0%, rgba(11,11,12,.6) 42%, rgba(11,11,12,.15) 100%); }
/* Keep the ‹ › nav glyphs from bidi-mirroring so prev stays ‹ (left), next › (right). */
.fs-slides__nav { transform: translateY(-50%); direction: ltr; }

/* ---- mobile drawers open from the right in RTL ---- */
.fs-mobnav { left: auto; right: 0; transform: translateX(100%); box-shadow: -24px 0 60px rgba(0,0,0,.28); }
.fs-botnav__ico .fs-bubble { right: auto; left: -9px; }
@media (max-width: 980px) {
	.fs-filters { left: auto; right: 0; transform: translateX(100%); box-shadow: -24px 0 60px rgba(0,0,0,.28); }
}

/* ---- accessibility ---- */
.screen-reader-text:focus { left: auto; right: 6px; }

/* ---- responsive border flip (mirrors the LTR overrides in theme.css) ---- */
@media (max-width: 1100px) {
	.fs-trust__item:nth-child(odd) { border-right: none; border-left: 1px solid var(--fs-ink-2); }
}
@media (max-width: 760px) {
	.fs-trust__item { border-left: none !important; }
}