/*
 * rtl.css — RTL-specific overrides for app CSS files.
 *
 * Only loaded when dir="rtl" (Arabic). Bootstrap RTL is already swapped
 * in base.html. style.css inline [dir="rtl"] rules handle navbar/chat/forms.
 * This file covers app-level CSS (posts, jobs, groups, offices, user_env,
 * expo, activity, security) and newer moderation components (#129–#134).
 *
 * Rule order mirrors the import order of the individual CSS files so
 * specificity stays predictable.
 */

/* ── posts.css ───────────────────────────────────────────────────────────── */

/* Drop-cap floats left in LTR; flip to right in RTL */
[dir="rtl"] .post-body-content > p:first-child::first-letter {
  float: right;
  padding-left: 8px;
  padding-right: 0;
}

/* Blockquote accent bar: left → right */
[dir="rtl"] .post-body-content blockquote {
  border-left: none;
  border-right: 3px solid var(--accent);
  padding-left: 0;
  padding-right: 16px;
  background: linear-gradient(270deg, rgba(205,161,44,.06) 0%, transparent 100%);
}

/* Comment thread indent line */
[dir="rtl"] .post-comment-thread-wrap {
  margin-left: 0;
  margin-right: 46px;
  padding-left: 0;
  padding-right: 14px;
  border-left: none;
  border-right: 2px solid var(--accent-dim);
}

/* ── offices.css ─────────────────────────────────────────────────────────── */

/* Portfolio stat small suffix — KEPT physical on purpose: the LTR base margins
   differ per element (1–3px) but this RTL rule flattens them all to 2px, so no
   single logical value preserves both directions. Migrating would shift RTL by
   ≤1px on these tiny suffixes — not worth an unverifiable change. */
[dir="rtl"] .office-portfolio-num small,
[dir="rtl"] .ov-ins-gauge-num small,
[dir="rtl"] .ov-ins-funnel-num small,
[dir="rtl"] .ov-ins-rating-big small,
[dir="rtl"] .ov-ins-hist-num small,
[dir="rtl"] .ov-ins-donut-legend strong small,
[dir="rtl"] .ov-ins-stack-legend strong small {
  margin-left: 0;
  margin-right: 2px;
}

/* ── user_env.css ────────────────────────────────────────────────────────── */

/* Calendar pill accent bars — KEPT physical: the base splits the accent across
   `border-left-width` + a per-type `border-left-color`, and the LTR/RTL borders
   aren't symmetric (left:none vs a 1px base), so a logical swap isn't a clean
   no-op. The sidebar/panel borders + kb-card-btns margin migrated to logical in
   user_env.css; this section's other overrides were dead classes. */
[dir="rtl"] .cal-pill--reminder { border-left: none; border-right: 3px solid var(--accent); }
[dir="rtl"] .cal-pill--task     { border-left: none; border-right: 3px solid #60a5fa; }

/* ── security.css ────────────────────────────────────────────────────────── */

[dir="rtl"] .sec-backup-code {
  text-align: right;
  padding-right: 12px;
  padding-left: 0;
  border-left: none;
  border-right: 3px solid var(--accent-dim);
}

/* ── Moderation (#129–#133) ──────────────────────────────────────────────── */

/* Audit log / report row timestamp — keep tabular */
[dir="rtl"] .mod-ts {
  text-align: left; /* intentionally LTR — timestamps read L-to-R */
  direction: ltr;
}

/* ── Inline lightboxes (situ · posts · projects) ─────────────────────────── */
/* Flip the ‹ › chevron characters so they point the right direction in RTL   */

[dir="rtl"] #lb-prev { transform: translateY(-50%) scaleX(-1); }
[dir="rtl"] #lb-next { transform: translateY(-50%) scaleX(-1); }

/* ── style.css — notifications page quick-action icons ───────────────────── */
/*
 * Archive btn, mute btn, and actions-menu kebab are all position:absolute
 * pinned to the physical right edge of the row. In RTL they must flip to
 * the left edge. Padding protection also swaps sides.
 */

[dir="rtl"] .notif-row-wrap .notif-actions-menu {
  right: auto;
  left: 12px;
}

[dir="rtl"] .notif-archive-btn {
  right: auto;
  left: 8px;
}

[dir="rtl"] .notif-row-wrap:has(.notif-actions-menu) .notif-archive-btn {
  right: auto;
  left: 48px;
}

[dir="rtl"] .notif-mute-btn {
  right: auto;
  left: 38px;
}

[dir="rtl"] .notif-row-wrap:has(.notif-actions-menu) .notif-mute-btn {
  right: auto;
  left: 78px;
}

/* Padding that protects row content from being covered by the icons */
[dir="rtl"] .notif-row-wrap:has(.notif-actions-menu) .notif-row {
  padding-right: 14px;
  padding-left: 54px;
}

[dir="rtl"] .notif-row-wrap:has(.notif-actions-menu .nav-popover-action-pill) .notif-row {
  padding-right: 14px;
  padding-left: 130px;
}

/* ── style.css — accent left-borders ────────────────────────────────────────*/

[dir="rtl"] .ab-mission {
  border-left: none;
  border-right: 3px solid var(--accent);
}

[data-theme="dark"][dir="rtl"] .ab-mission,
[data-theme="dark"] [dir="rtl"] .ab-mission {
  border-left-color: transparent;
  border-right-color: var(--accent);
}

/* ── style.css — text-align migrated to logical `text-align:start` in style.css
   (2026-06-13 RTL increment); these 6 flips are now automatic. Only the report
   labels' float flip remains physical (float logical values have weaker support). */

[dir="rtl"] .report-post-form label,
[dir="rtl"] .report-user-form label,
[dir="rtl"] .report-group-form label,
[dir="rtl"] .report-project-form label {
  float: right;
}

/* ── Irreducible RTL-specific rules — these can't be expressed as CSS logical
   properties, so they stay. Everything else from situ / user_env / expo /
   security / portfolio / companies / search migrated to logical props in the
   source files (2026-06-13), and several redundant `text-align:right` overrides
   were dropped (the base already defaults to `text-align:start`, which right-
   aligns in RTL on its own). ──────────────────────────────────────────────── */

/* Chevron mirror — a transform has no logical equivalent. */
.arch-new-conv-go{transform:scaleX(-1)}

/* Cooldown-notice row mirrors; system messages force RTL text flow. */
[dir="rtl"] .group-join-cooldown-msg{flex-direction:row-reverse}
[dir="rtl"] .chat-system-msg{direction:rtl}