/* Right-to-left (Arabic). Flex and grid layouts mirror by themselves with dir="rtl";
   this file fixes what is written with physical left/right. Loaded only on RTL pages. */

html[dir="rtl"] .skip-link { left: auto; right: 12px; }
html[dir="rtl"] .header-actions { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .nav + .header-actions { margin-right: 0; }
html[dir="rtl"] .header-pill { padding-right: 16px; padding-left: 8px; }
html[dir="rtl"] .scroll-progress { transform-origin: 100% 50%; }

/* arrows point the other way */
html[dir="rtl"] .ico--arrow { transform: scaleX(-1); }
html[dir="rtl"] .map-link:hover .ico--arrow,
html[dir="rtl"] a.bt:hover .bt-cta .ico--arrow { transform: scaleX(-1) translateX(4px); }
html[dir="rtl"] .map-link:hover { transform: translateX(-3px); }

/* hover nudges */
html[dir="rtl"] .hud-tile:hover { transform: translateX(-6px); }
html[dir="rtl"] .hud--r .hud-tile:hover { transform: translateX(6px); }
html[dir="rtl"] .news-row:hover { transform: translateX(-6px); }
html[dir="rtl"] .rank a:hover { transform: translateX(-4px); }
html[dir="rtl"] .footer-col a:hover { transform: translateX(-3px); }
html[dir="rtl"] .cmdk__item.is-active a, html[dir="rtl"] .cmdk__item a:hover { transform: translateX(-3px); }

/* text alignment and edges */
html[dir="rtl"] .hero-search > span,
html[dir="rtl"] .hud--l .hud-tile,
html[dir="rtl"] .lead-form { text-align: right; }
html[dir="rtl"] .rank-val, html[dir="rtl"] .bar-val, html[dir="rtl"] .facts dd { text-align: left; }
html[dir="rtl"] .hero-search .ico { margin-left: 0; margin-right: 4px; }
html[dir="rtl"] .hud-tile::before { left: auto; right: 0; border-radius: 4px 0 0 4px; }
html[dir="rtl"] .donut-legend b { margin-left: 0; margin-right: auto; padding-left: 0; padding-right: 14px; }
html[dir="rtl"] .ds-col + .ds-col { border-left: 0; border-right: 1px solid var(--line); }
html[dir="rtl"] .group-link, html[dir="rtl"] .resource-go { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .cmdk__hint kbd { margin-right: 0; margin-left: 4px; }
html[dir="rtl"] .prose ul, html[dir="rtl"] .prose ol { padding-left: 0; padding-right: 1.4em; }
html[dir="rtl"] .prose blockquote { padding: 4px 20px 4px 0; border-left: 0; border-right: 3px solid var(--primary); }
html[dir="rtl"] .prose th, html[dir="rtl"] .prose td { text-align: right; }

/* search field with its icon, selects */
html[dir="rtl"] .filter-search .ico { left: auto; right: 15px; }
html[dir="rtl"] .filter-search input { padding-left: 16px; padding-right: 44px; }
html[dir="rtl"] .filter-select select { padding-right: 16px; padding-left: 38px; background-position: left 14px center; }

/* country strip, cards, tiles */
html[dir="rtl"] .country-strip { -webkit-mask-image: linear-gradient(270deg, transparent 0, #000 14px, #000 calc(100% - 34px), transparent); mask-image: linear-gradient(270deg, transparent 0, #000 14px, #000 calc(100% - 34px), transparent); }
html[dir="rtl"] .cs-chip { padding: 6px 7px 6px 13px; }
html[dir="rtl"] .cs-chip--all { padding-left: 13px; padding-right: 15px; }
html[dir="rtl"] .op-card--mvno .op-flag { left: auto; right: 12px; }
html[dir="rtl"] .rt-logo img { object-position: right center; }

/* decorative circles move to the other corner */
html[dir="rtl"] .news-feature::before { right: auto; left: -80px; }
html[dir="rtl"] .band::before, html[dir="rtl"] .page-hero::after { right: auto; left: -120px; }
html[dir="rtl"] .flag-aurora { right: auto; left: -10%; }

/* logos and maps are not text: keep them as drawn */
html[dir="rtl"] .marquee, html[dir="rtl"] .map, html[dir="rtl"] .constellation, html[dir="rtl"] .brand { direction: ltr; }
html[dir="rtl"] .kbd, html[dir="rtl"] kbd { direction: ltr; }

/* language menu opens towards the page */
html[dir="rtl"] .lang-menu { right: auto; left: 0; }
