/* ==========================================================================
   RTL OVERRIDES — oandp.pk
   Loaded after main.css (see functions.php > oppak_scripts). Most of the
   theme's flexbox-based layout already mirrors correctly under dir="rtl"
   automatically — this file only overrides the handful of rules in main.css
   that use hard-coded left/right/margin-left/margin-right/translateX values,
   which CSS does not flip automatically.
   ========================================================================== */

/* Base reading direction / alignment */
body { direction: rtl; text-align: right; }

/* Accessibility: skip link + screen-reader-only text should hide off the
   right edge in RTL, not the left. */
.screen-reader-text { left: auto; right: -9999px; }

/* Gold "new/featured" badge next to headings */
.oppak-badge--gold { margin-left: 0; margin-right: 8px; }

/* Mobile menu active-ancestor indicator */
.oppak-menu--mobile .current_page_ancestor > a {
	border-left: none;
	border-right: 3px solid var(--oppak-teal);
	padding-left: 0;
	padding-right: 9px;
}

/* Desktop dropdown submenu position */
.oppak-submenu { left: auto; right: 0; }

/* Floating WhatsApp button — bottom-left in RTL instead of bottom-right */
.oppak-floating-whatsapp { right: auto; left: 20px; }

/* Footer legal links spacing (Privacy / Terms) */
.oppak-footer-legal a { margin-left: 0; margin-right: 16px; }
.oppak-footer-legal a:first-child { margin-right: 0; }

/* Card category pill position (top-right corner of thumbnail in RTL) */
.oppak-card__pill-wrap { left: auto; right: 8px; }

/* Pull-quote accent border */
.oppak-pullquote { border-left: none; border-right: 3px solid var(--oppak-gold); padding-left: 0; padding-right: 12px; }

/* Hero side-list hover nudge — mirror the slide direction */
.oppak-hero__news-item:hover { transform: translateX(-3px); }

/* Audience pill tiles — align label text to the right */
.oppak-audience__tile { text-align: right; }

/* Header widget area spacing next to the primary menu */
@media (min-width: 1024px) {
	.oppak-header__widgets { margin-left: 0; margin-right: 12px; }
}

/* Category page banner title position */
.oppak-page-banner__title { left: auto; right: 20px; }

/* YouTube band list item text alignment */
.oppak-youtube-band__item { text-align: right; }

/* Contact / newsletter forms and generic lists already flow correctly via
   flexbox column layouts — no changes needed there. */

/* Letter-spacing breaks the cursive joining of Urdu/Arabic script letters
   (they visually disconnect), so it's disabled wherever main.css adds it
   for Latin-style "uppercase eyebrow" typography. text-transform:uppercase
   itself is harmless — it has no effect on Urdu script — so it's left as-is. */
.oppak-footer-heading,
.oppak-card__meta,
.oppak-eyebrow,
.oppak-hero__side-heading,
.oppak-widget-title {
	letter-spacing: normal;
}
