/*
 * 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);
}

[dir="rtl"] .post-comment--reply {
  padding-right: 0;
}

/* Icon margins inside post meta */
[dir="rtl"] .post-hero-meta span i {
  margin-right: 0;
  margin-left: 5px;
}

[dir="rtl"] .post-comment-edited {
  margin-left: 0;
  margin-right: 6px;
}

/* Post comment count pill — push to start in RTL */
[dir="rtl"] .post-comments-count {
  margin-left: 0;
  margin-right: auto;
}

/* ── jobs.css ────────────────────────────────────────────────────────────── */

/* Form callout accent bar */
[dir="rtl"] .arch-form-callout {
  border-left: none;
  border-right: 4px solid rgba(205,161,44,.85);
}

/* Job-card accent border */
[dir="rtl"] .jv-quick-facts,
[dir="rtl"] .jv-sidebar-card {
  border-left: none;
  border-right: 4px solid rgba(205,161,44,.85);
}

[dir="rtl"] .apply-danger-badge {
  border-left: none;
  border-right: 4px solid var(--danger);
}

/* Company verified checkmark spacing */
[dir="rtl"] .jv-company-verified {
  margin-left: 0;
  margin-right: 2px;
}

/* ── groups.css ──────────────────────────────────────────────────────────── */

/* Group info icon margin */
[dir="rtl"] .group-information i,
[dir="rtl"] .group-poll-q i {
  margin-right: 0;
  margin-left: 5px;
}

/* Vote-count chips — swap auto margin side */
[dir="rtl"] .group-poll-vote-count {
  margin-left: 0;
  margin-right: auto;
}

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

/* Office info icon margin */
[dir="rtl"] .office-information i,
[dir="rtl"] .ovr-hero-meta i {
  margin-right: 0;
  margin-left: 5px;
}

/* Work-field trigger button: left-aligned text → right-aligned */
[dir="rtl"] .wf-trigger {
  text-align: right;
}

/* Portfolio stat small suffix */
[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 ────────────────────────────────────────────────────────── */

/* Sidebar border: right → left */
[dir="rtl"] .ue-sidebar,
[dir="rtl"] .ue-nav-panel {
  border-right: none;
  border-left: 1px solid var(--border);
}

/* Detail panel border */
[dir="rtl"] .ue-detail-panel,
[dir="rtl"] .cal-panel {
  border-left: none;
  border-right: 1px solid var(--border);
}

/* Calendar pill accent bars */
[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; }

/* ue-pill label spacing */
[dir="rtl"] .cal-pill-type-label {
  margin-right: 0;
  margin-left: 4px;
}

/* KB card buttons — push to start */
[dir="rtl"] .kb-card-btns {
  margin-left: 0;
  margin-right: auto;
}

/* Timeline / conversation thread border */
[dir="rtl"] .ue-thread-indent {
  border-left: none;
  border-right: 2px solid var(--border);
}

/* text-align overrides for user_env views */
[dir="rtl"] .ue-msg-meta,
[dir="rtl"] .ue-timestamp-row {
  text-align: right;
}

/* ── expo.css ────────────────────────────────────────────────────────────── */

/* Expo entry indent / left border */
[dir="rtl"] .hall-entry-body,
[dir="rtl"] .hall-thread-wrap {
  padding-left: 0;
  padding-right: 24px;
  border-left: none;
  border-right: 2px solid #262b3c;
}

/* Danger flag border */
[dir="rtl"] .hall-flag-danger {
  border-left: none;
  border-right: 4px solid #ef4444;
}

/* Icon margin flip for expo meta */
[dir="rtl"] .hall-meta-icon {
  margin-right: 0;
  margin-left: 6px;
}

/* Chevron room for accordion — swap padding side */
[dir="rtl"] .hall-accordion-trigger {
  padding-right: 0;
  padding-left: 24px;
}

[dir="rtl"] .hall-vote-label {
  margin-right: 0;
  margin-left: 2px;
}

/* ── activity.css ────────────────────────────────────────────────────────── */

[dir="rtl"] .activity-icon-col {
  margin-right: 0;
  margin-left: 10px;
}

[dir="rtl"] .activity-timeline-line {
  left: auto;
  right: 18px;
}

/* ── 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;
}

/* Bulk action bar note count */
[dir="rtl"] #bulk-count {
  margin-right: 0;
  margin-left: 6px;
}

/* Appeal card meta / reviewed-by line */
[dir="rtl"] .appeal-meta {
  text-align: right;
}

/* Suspension info block */
[dir="rtl"] .suspension-info-block {
  text-align: right;
}

/* ── portfolio.css ────────────────────────────────────────────────────────── */

[dir="rtl"] .portfolio-file-icon {
  margin-right: 0;
  margin-left: 8px;
}

/* ── Global icon-spacing helpers ─────────────────────────────────────────── */
/*
 * Bootstrap 5 RTL swaps most me-/ms- spacing utilities automatically.
 * These catch custom icon+text patterns that use raw margin-left/right.
 */
[dir="rtl"] .arch-icon-leading { margin-right: 0; margin-left: 6px; }
[dir="rtl"] .arch-icon-trailing { margin-left: 0; margin-right: 6px; }

/* ── style.css — arch-stepper ────────────────────────────────────────────── */

/* Suffix panel separator: left-border → right-border */
[dir="rtl"] .arch-stepper .arch-stepper-suffix {
  border-left: none;
  border-right: 1px solid var(--border);
}

/* ── style.css — attribution banners ─────────────────────────────────────── */

[dir="rtl"] .arch-attribution-pending i,
[dir="rtl"] .arch-attribution-action i {
  margin-right: 0;
  margin-left: 6px;
}

/* ── style.css — project surfaces ────────────────────────────────────────── */

[dir="rtl"] .proj-hero-meta span i {
  margin-right: 0;
  margin-left: 5px;
}

[dir="rtl"] .proj-coop-approve-text i {
  margin-right: 0;
  margin-left: 5px;
}

/* ── style.css — situ ────────────────────────────────────────────────────── */

[dir="rtl"] .situ-pin-check-title i {
  margin-right: 0;
  margin-left: 4px;
}

/* ── style.css — eyebrow / rail headings ─────────────────────────────────── */

[dir="rtl"] .pin-strip-eyebrow i,
[dir="rtl"] .featured-rail-eyebrow i,
[dir="rtl"] .suggested-rail-eyebrow i {
  margin-right: 0;
  margin-left: 4px;
}

[dir="rtl"] .thread-panel-title i {
  margin-right: 0;
  margin-left: 6px;
}

/* ── style.css — announcement badge & home stats ─────────────────────────── */

[dir="rtl"] .ann-badge i {
  margin-right: 0;
  margin-left: 5px;
}

[dir="rtl"] .home-hot-stats i {
  margin-right: 0;
  margin-left: 3px;
}

[dir="rtl"] .home-discover-stats i {
  margin-right: 0;
  margin-left: 2px;
}

/* ── 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;
}

/* ── offices.css — cover badges & award icon ─────────────────────────────── */

/* Rating badge (top-end) and status badge (top-start) swap corners in RTL */
[dir="rtl"] .office-cover-rating      { right: auto; left: 8px; }
[dir="rtl"] .office-card-status-badge { left: auto; right: 8px; }

/* Award trophy icon — positioned top-end of card */
[dir="rtl"] .ovr-award::before { right: auto; left: 16px; }

/* Padding that kept card text clear of the ::before icon */
[dir="rtl"] .ovr-award .nm { padding-right: 0; padding-left: 30px; }

/* ── style.css — project gallery overlay close ───────────────────────────── */

[dir="rtl"] .proj-gallery-overlay-close { right: auto; left: 24px; }

/* ── style.css — icon trailing margins ──────────────────────────────────────*/

[dir="rtl"] .feed-see-all i       { margin-left: 0; margin-right: 4px; }
[dir="rtl"] .proj-featured-meta i { margin-right: 0; margin-left: 3px; }
[dir="rtl"] .jv-sim-loc i         { margin-right: 0; margin-left: 2px; }
[dir="rtl"] .home-hero-cta i      { margin-left: 0; margin-right: 4px; }

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

[dir="rtl"] .about-bio {
  border-left: none;
  border-right: 3px solid var(--accent);
  border-radius: var(--radius-md) 0 0 var(--radius-md);
}

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

[dir="rtl"] .home-stream-card {
  border-left: none;
  border-right: 3px solid var(--stream-accent, var(--color-accent));
}

[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 overrides ───────────────────────────────────────*/

[dir="rtl"] .files-name a { text-align: right; }

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

[dir="rtl"] .g_member_actions li button { text-align: right; }

[dir="rtl"] .proj-description-text { text-align: right; }

[dir="rtl"] .api-docs-page th,
[dir="rtl"] .api-docs-page td { text-align: right; }

[dir="rtl"] .se-trending { text-align: right; }

/* ── situ.css ────────────────────────────────────────────────────────────── */

[dir="rtl"] .situ-popup-close { right: auto; left: 10px; }
[dir="rtl"] .situ-top-card   { text-align: right; }

/* Bulleted tips list indentation — swap padding side */
[dir="rtl"] .situ-tips { padding-left: 0; padding-right: 18px; }

/* ── user_env.css — button text alignment ────────────────────────────────── */

[dir="rtl"] .td-item-content { text-align: right; }
[dir="rtl"] .rm-snooze-opt   { text-align: right; }
[dir="rtl"] .vt-move-opt     { text-align: right; }

/* ── expo.css — accent borders & text alignment ──────────────────────────── */

[dir="rtl"] .hall-form-errors {
  border-left: none;
  border-right: 4px solid #ef4444;
  border-radius: 12px 0 0 12px;
}

/* .hall-toast RTL position is handled by inset-inline-end — no border-direction overrides needed. */

[dir="rtl"] .hall-edit-card__summary-stats { text-align: right; }

/* ── security.css — 2FA steps list indentation ───────────────────────────── */

[dir="rtl"] .sec-steps { padding-left: 0; padding-right: 22px; }

/* ── portfolio.css — avatar column alignment (narrow breakpoint) ─────────── */

[dir="rtl"] .pf-avatar-col { text-align: right; }

/* ── companies.css — certification badge accent bar ─────────────────────── */

[dir="rtl"] .co-cert-badge {
  border-left: none;
  border-right: 3px solid var(--border);
}

/* ── Search filters ──────────────────────────────────────────────────────── */
/* Search filter arrows — scaleX handled in style.css; text-align adjustment */
[dir="rtl"] .search-section-title {
  text-align: right;
}

/* ── Pagination ──────────────────────────────────────────────────────────── */
/* Pager chevron flip is already in style.css; keep this file's scope clean. */

/* ── messaging / chat — action bar & reaction picker ────────────────────── */
/* Positioning (left/right/top) is now computed in JS (_positionActionBar /
 * _positionReactionPicker) using getBoundingClientRect, so it is correct for
 * both LTR and RTL without CSS overrides. */

/* New-conversation modal — flip the go chevron in RTL. */
.arch-new-conv-go{transform:scaleX(-1)}

/* ── Group join-rejection cooldown notice ────────────────────────────────── */
[dir="rtl"] .group-join-cooldown-msg{flex-direction:row-reverse}
[dir="rtl"] .group-join-cooldown-date{text-align:right}

/* ── System messages ──────────────────────────────────────────────────────── */
[dir="rtl"] .chat-system-msg{direction:rtl}
