/* ============================================================
   RTL overrides — loaded only when dir="rtl" (Arabic, etc.)
   Flexbox layouts auto-mirror with dir="rtl"; this file handles
   the properties that don't mirror automatically: borders,
   absolute positioning, text-align, and a few icon-adjacent bits.
   ============================================================ */

body { text-align: right; }

/* ---------- Sidebar: flex auto-mirrors to the right, fix the border ---------- */
.sidebar { border-right: none; border-left: 1px solid var(--line); }
.main-col { border-right: 0; }

/* Mobile slide-in: sidebar should tuck off the right edge, not left */
@media (max-width: 980px) {
  .sidebar { left: auto; right: -260px; transition: right .2s ease; }
  .sidebar.open { left: auto; right: 0; }
}

/* ---------- Text alignment ---------- */
.auth-card, .role-select, .field label { text-align: right; }
table.dt th, table.dt td { text-align: right; }
.hero, .hero p.lead, .section-head { text-align: right; }
.section-head { margin-left: auto; margin-right: auto; }
.cta-band, .empty-state { text-align: center; } /* keep centered blocks centered */

/* ---------- Hero floating cards: mirror the offsets ---------- */
.mock-float:first-of-type { right: auto; left: -14px; }
.mock-float:last-of-type { left: auto; right: -18px; }

/* ---------- Footer ---------- */
.footer-bottom { flex-direction: row-reverse; }

/* ---------- Forms & filters ---------- */
.filter-bar, .search-wide, .topbar-search { flex-direction: row; } /* gap-based, already fine */
.field input, .field select, .field textarea { text-align: right; }
.range-labels { flex-direction: row-reverse; }

/* ---------- Cards / stat rows that use justify-between ---------- */
.stat-card .stat-top,
.card-foot,
.match-card,
.grade-row { flex-direction: row-reverse; }

/* ---------- Chat bubbles: mirror alignment ---------- */
.msg.ai { align-self: flex-end; border-bottom-left-radius: 8px; border-bottom-right-radius: 4px; }
.msg.user { align-self: flex-start; border-bottom-right-radius: 8px; border-bottom-left-radius: 4px; }

/* ---------- Assessment option cards ---------- */
.opt-card { flex-direction: row-reverse; text-align: right; }

/* ---------- Badges/icons that visually read left-to-right (numbers, %) stay LTR ---------- */
.match-pct, .badge, .progress-track { direction: ltr; }
.match-card .match-pct { direction: ltr; }