/* furrsati.com/ar/pricing: the approved pricing page mirrored for Arabic, right to left, the way
   pages/ar/index.css mirrors the home page. Loaded AFTER pages/pricing.css, which stays untouched. The slider is a
   native range input, which runs right to left by itself under dir="rtl"; its painted fill follows it. Dollar
   amounts keep Futura and Western digits (isolated left to right in the markup). */

:root { --amt: "Futura Furrsati", "Tajawal", system-ui, sans-serif; }
body { font-family: var(--ui); }
main *, .foot *, .sheet * { letter-spacing: 0 !important; }
main .title { line-height: 1.15; font-weight: 800; }
.pz__title { line-height: 1.15; font-weight: 800; }
.pz__lead, .sec-lead, .acc__a p { line-height: 1.75; }
.sl__v, .side__big, .side__rows dd, .ex__t td, .pt td:nth-child(3) { font-family: var(--amt); }

/* the two-colour tag and title read hire → work from the right */
.pz__tag { padding: 7px; padding-inline: 10px 14px; background: linear-gradient(270deg, #fff1da, var(--teal-soft)); }
.pz__tag span { background: linear-gradient(270deg, var(--orange) 50%, var(--teal-m) 50%); }
.pz__title span { background: linear-gradient(270deg, var(--orange-text) 0 45%, var(--teal) 55% 100%); -webkit-background-clip: text; background-clip: text; }

/* the slider's fill and the two sides' bars grow from the right */
.sl__fill i { transform-origin: right; background: linear-gradient(270deg, var(--orange), var(--teal-m)); }
.bar i { transform-origin: right; }
.side--hire::after { left: auto; inset-inline-start: -120px; }
.side--work::after { right: auto; inset-inline-end: -120px; }

/* the drawn icons keep their geometry; the card swipe goes the other way */
@keyframes pz-swipe-rtl { 0%, 40% { transform: none; } 55% { transform: translateX(-8px) rotate(6deg); } 70%, 100% { transform: none; } }

/* amounts the slider writes ("+$20.00", "−$40.00"): isolated left to right so the sign stays in front of the
   dollar sign; their alignment re-stated, since an ltr box would otherwise align to the left */
.side__big, .side__rows dd, .sl__v, .ex__t td { direction: ltr; unicode-bidi: isolate; }
.side__big, .side__rows dd, .sl__v { text-align: right; }
.ex__t td { text-align: left; }