/* ==========================================================================
   Urdu (RTL) overrides — loaded only on /ur/ pages, after main.css.
   Most layout mirrors automatically with dir="rtl" (flex, grid, text-align: start);
   this file fixes the parts that use physical left/right values.
   ========================================================================== */

:root { --font: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", "Poppins", system-ui, sans-serif; }

/* ---------- Typography: Nastaliq needs more line height ---------- */
body { font-family: var(--font); line-height: 2.05; font-size: 15.5px; }
h1, h2, h3, h4, .h-hero, .h-xl, .h-lg, .h-md { line-height: 1.85 !important; letter-spacing: 0 !important; font-weight: 700; }
p, li { line-height: 2.1; }
.btn, .nav-link, .sub-menu a, .topic-chip, .biz-tab, .amount-btn, .choice__box, .pill, .label, .eyebrow, .feature-hero__eyebrow, .sponsor-card h3, .impact-box h3, .stat span, .hero-stat span, .gzc__summary span { letter-spacing: 0 !important; text-transform: none !important; }
.btn { line-height: 1.9; padding-top: 10px; padding-bottom: 12px; }
.nav-link { font-size: clamp(14px, 1.05vw, 15.5px); padding-top: 6px; padding-bottom: 10px; }
input, textarea, select, button { font-family: var(--font); }
/* Numbers, emails, phones, IBANs stay left-to-right. */
input[type="number"], input[type="email"], input[type="tel"], input[type="url"], .pay-details__row strong, .footer-contact a[href^="mailto:"], .footer-contact a[href^="tel:"], .topbar__contact a, .contact-card p, .contact-box__list a { direction: ltr; unicode-bidi: plaintext; }
input[type="number"], input[type="email"], input[type="tel"], input[type="url"] { text-align: right; }
.stats-band__item strong, .hero-stat strong, .stat strong, .impact-box__amount, .gzc__payable strong, .gzc__summary strong, [data-count] { font-family: "Poppins", sans-serif; }

/* Hero headings: Nastaliq is tall, so keep them a little smaller. */
.home-hero h1, .feature-hero__title, .vesp-hero__title, .page-hero__title, .h-hero { font-size: clamp(28px, 3.3vw, 46px); }
.rotator__word::after { bottom: .2em; }

/* ---------- Mirror arrows & directional icons ---------- */
.fa-arrow-right-long, .fa-arrow-right, .fa-chevron-right, .fa-chevron-left, .fa-arrow-up-right-from-square, .fa-paper-plane, .fa-route, .fa-angle-right { scale: -1 1; }
.btn:hover i, .link-arrow:hover i { transform: translateX(-5px); }
.contact-send:hover i { transform: translate(-5px, -5px) rotate(8deg); }
.footer-links a:hover { transform: translateX(-8px); }
.sub-menu a:hover, .sub-menu a.is-active { padding-left: 14px; padding-right: 22px; }

/* ---------- Hero overlays: dark side follows the text (right) ---------- */
.home-hero__overlay, .feature-hero__overlay, .vesp-hero__overlay, .page-hero--light .page-hero__overlay { transform: scaleX(-1); }
.home-hero__glow, .feature-hero__glow { left: auto; right: -220px; }
.home-hero__dots { left: auto; right: 40px; }

/* ---------- Lists with custom bullets ---------- */
.dot-list li, .calc-rules li { padding-left: 0; padding-right: 22px; }
.dot-list li::before { left: auto; right: 4px; }
.calc-rules li::before { left: auto; right: 2px; }
.num-list, .calc-rules--num { padding-left: 0; padding-right: 26px; }

/* ---------- Borders & accents on the "start" side ---------- */
.bar-title::after, .site-footer__col h3::after, .region-card .card-head h3::after { left: auto; right: 2px; }
.support-item { border-left: 0; border-right: 3px solid var(--green); padding: 0 22px 4px 8px; }
.cta-band__text { border-left: 0; border-right: 4px solid var(--mint-2); padding: 4px 26px 4px 0; }
.why-sdf__item { border-left: 0; border-right: 4px solid var(--mint-2); }
.why-sdf__item:first-child { border-right: 0; }
.hero-stat + .hero-stat { border-left: 0; padding-left: 0; border-right: 1px solid rgba(255, 255, 255, .14); padding-right: 36px; }
.stats-band__item + .stats-band__item::before { left: auto; right: -10px; }
.sponsor-card::before { left: auto; right: 0; }
.apply-step:not(:last-child)::after { right: auto; left: -17px; scale: -1 1; }
.sec-title--left .sec-title__line:first-child { display: none; }
.sec-title--left h2, .sec-title--right h2 { text-align: right; }
.pay-details__row span { min-width: 110px; }

/* ---------- Absolutely positioned bits ---------- */
.leaf { right: auto; left: 18px; scale: -1 1; transform-origin: bottom left; }
.story-card__chips { left: 20px; right: 20px; }
.program-card p { padding-right: 0; padding-left: 60px; }
.impact-card::before { right: auto; left: -90px; }
.contact-box__orb--a { right: auto; left: -110px; }
.contact-box__orb--b { right: auto; left: 30px; }
.contact-box__wa > i:last-child { margin-left: 0; margin-right: auto; }
.pay-method__check { margin-left: 0; margin-right: auto; }
.job-card__zoom { right: auto; left: 22px; }
.activity__zoom { right: auto; left: 16px; }
.float-badge--a { left: auto; right: -24px; }
.float-badge--b { right: auto; left: -6px; }
.float-badge--c { left: auto; right: 12%; }
.vesp-hero__visual { padding: 26px 10px 40px 30px; }
.vesp-hero__visual::before { right: auto; left: 0; }
.vesp-hero__frame { transform: rotate(2deg); }
.quick-amount.is-popular::before { letter-spacing: 0; }

/* Form fields with leading icons */
.ifield__box > i { left: auto; right: 15px; }
.ifield__box input, .ifield__box textarea { padding: 13px 42px 13px 14px; }
.ifield__count { text-align: left; }
.jobs-search i { left: auto; right: 16px; }
.jobs-search input { padding: 12px 44px 12px 18px; }
.gzc__unit { padding-left: 0; padding-right: 14px; }
.gzc__select::after { right: auto; left: 14px; }
.gzc__select select { padding: 12px 14px 12px 36px; }
.amount-custom input { text-align: right; }

/* Language switcher pill */
.lang-switch { font-family: "Poppins", sans-serif; }

/* ---------- Mobile ---------- */
@media (max-width: 1100px) {
	.main-nav { inset: 0 auto 0 0; transform: translateX(-105%); box-shadow: 20px 0 50px rgba(0, 0, 0, .18); }
	.nav-open .main-nav { transform: none; }
	.nav-link.is-active::after { right: auto; left: 8px; }
}
@media (max-width: 900px) {
	.apply-step:not(:last-child)::after { left: 50%; margin: 0 0 0 -15px; }
}
@media (max-width: 640px) {
	.hero-stat + .hero-stat { padding-right: 20px; }
	body { font-size: 15px; }
}

/* CSS-generated labels */
.quick-amount.is-popular::before { content: "مقبول"; font-family: var(--font); }

/* Keep "30+", "150,000+", "PKR 5,000" reading left-to-right inside Urdu text. */
[data-count], .quick-amount, .amount-btn, .impact-list li strong, .impact-box__amount, .gzc__summary strong, .gzc__payable strong, .stats-band__item strong, .hero-stat strong, .zcalc__num, .gzc__num { direction: ltr; unicode-bidi: isolate; }

/* Nastaliq lines collide unless every paragraph gets generous line height. */
body p, body li, .lead, .story-card p, .program-card p, .partner-card p, .aim-card p, .barrier-card p, .teach-card p,
.challenge-card p, .initiative__text p, .vm__text p, .media-text p, .use-card p, .region-card p, .support-item p,
.women-story p, .job-card h3, .impact-card > p, .feature-hero__text, .home-hero__text, .vesp-hero__text, .page-hero__text,
.sponsor-card p, .contact-box__panel > p, .gzc__msg, .faq__a p, .jobs-disclaimer p, .why-sdf__item p, .gap-item p { line-height: 2.15 !important; }
.story-card p, .program-card p, .why-sdf__item p { font-size: 15px; }
.dot-list { gap: 6px; }

/* Decorative leaf: flip in place so it stays inside its card. */
.leaf { transform-origin: center; }

/* Donation frequency toggle: the pill slides right-to-left in Urdu. */
.freq__pill { left: auto; right: 4px; }
.freq.is-monthly .freq__pill { transform: translateX(-100%); }
.freq label span { padding: 4px 18px 8px; }
.story__text p { line-height: 2.3 !important; }
