/* ==========================================================================
   Tarabichi — rtl.css  (loaded only when is_rtl())
   Logical properties already mirror the layout. This file only handles what
   they cannot: transforms, gradient angles, icon flips, animation direction
   and Arabic typography (no tracking, taller line-height).
   ========================================================================== */

/* ---- Arabic typography ---- */
body { font-family: var(--tpp-font-ar); line-height: 1.85; }
h1, h2, h3, h4, h5, h6, .tpp-eyebrow, .tpp-num, .tpp-hero__title, .tpp-meta__cat, .tpp-chip, .tpp-btn, .tpp-banner__mark, .tpp-badge span { letter-spacing: 0 !important; }
h1, h2, h3, .tpp-secHead__title, .tpp-banner__title, .tpp-cta__title { line-height: 1.35; }
.tpp-hero__title { line-height: 1.3; text-transform: none; }
.tpp-hero__box { padding-block: .1rem .35rem; }
.tpp-eyebrow, .tpp-meta__cat, .tpp-badge span { text-transform: none; font-size: .82rem; }
.tpp-lead, .tpp-entry { line-height: 1.95; }
.tpp-scard__no { font-style: normal; }

/* ---- Direction-aware icons ---- */
.tpp-ar { transform: scaleX(-1); }
.tpp-btn:hover .tpp-ar, .tpp-link:hover .tpp-ar, a:hover > .tpp-link .tpp-ar, .tpp-sideList a:hover .tpp-ar, .tpp-result a:hover > .tpp-ar { transform: scaleX(-1) translateX(4px); }
.tpp-ar-up { transform: scaleX(-1); }
.tpp-prodItem:hover .tpp-prodItem__go { transform: rotate(-45deg); }
@keyframes tpp-nudge { 40% { transform: scaleX(-1) translateX(5px); } }
@keyframes tpp-spinNudge { 50% { transform: scaleX(-1) translateX(5px); } }

/* ---- Gradients & transforms ---- */
.tpp-hero__shade { background: linear-gradient(270deg, #0F1014 0%, rgba(15, 16, 20, .92) 32%, rgba(15, 16, 20, .38) 68%, rgba(15, 16, 20, .12) 100%), linear-gradient(0deg, rgba(15, 16, 20, .75) 0%, transparent 32%); }
.tpp-banner--image::before { background: linear-gradient(270deg, rgba(var(--tpp-dark-rgb), .86), rgba(var(--tpp-dark-rgb), .45)); }
.tpp-footer::before { background: linear-gradient(270deg, var(--tpp-primary), var(--tpp-accent)); }
.tpp-ribbon__band { transform: rotate(1.6deg); }
.tpp-drawer__panel { transform: translateX(-105%); }
.tpp-drawer__nav .tpp-nav__item { transform: translateX(-18px); }
.tpp-scard__strip span { transform: none; }
.tpp-cta::after { inset-inline-end: auto; inset-inline-start: -6rem; }
.tpp-ncard__title a { background-position: 100% 100%; }

/* ---- Marquees run the other way ---- */
@keyframes tpp-mq-rtl { to { transform: translateX(50%); } }
.tpp-marquee__track { animation-name: tpp-mq-rtl; }

@media (max-width: 900px) {
	.tpp-hero__shade { background: linear-gradient(270deg, rgba(15, 16, 20, .94), rgba(15, 16, 20, .58)), linear-gradient(0deg, rgba(15, 16, 20, .8), transparent 40%); }
}