/* ============================================================================
   lr-rtl.css — [dir=rtl] overrides for the Living Research site.

   Mirrors every left/right directional declaration in brand.css and
   lr-shell.css so that Arabic (and any future RTL language) reads correctly.

   Rules:
   - Charts stay left-to-right (no mirroring of .chart, .qcard, .corechart,
     or chart-related selectors).
   - Only visually directional properties are overridden.
   - Flexbox row direction auto-mirrors in RTL and is NOT touched here.
   ========================================================================== */

/* -----------------------------------------------------------------------
   1. Skip link (lr-shell.css §1)
   -------------------------------------------------------------------- */
[dir=rtl] .skiplink {
  left: auto;
  right: -9999px;
  border-radius: 0 0 0 var(--radius-sm);
}
[dir=rtl] .skiplink:focus {
  left: auto;
  right: 0;
}

/* -----------------------------------------------------------------------
   1b. Charts stay LTR — pin chart surfaces back to direction:ltr so axis
       labels, legends and bar grids don't inherit RTL mirroring.
   -------------------------------------------------------------------- */
[dir=rtl] .qcard .chart,
[dir=rtl] .qcard .legend,
[dir=rtl] .qcard .axisrow,
[dir=rtl] .qcard .optrow,
[dir=rtl] .corechart svg {
  direction: ltr;
  unicode-bidi: isolate;
}

/* -----------------------------------------------------------------------
   2. Header — logos, tag, spacer (brand.css §4)
   -------------------------------------------------------------------- */
[dir=rtl] .brand-logo--client {
  border-left: 0;
  padding-left: 0;
  border-right: 1px solid var(--border-2);
  padding-right: 24px;
}
[dir=rtl] .brand-tag {
  border-left: 0;
  padding-left: 0;
  border-right: 1px solid var(--border-2);
  padding-right: 16px;
}

/* -----------------------------------------------------------------------
   3. Eyebrow radial mark (brand.css §2)
   -------------------------------------------------------------------- */
[dir=rtl] .eyebrow__radial {
  margin-left: -2px;
  margin-right: -20px;
}

/* -----------------------------------------------------------------------
   4. Deck exit link (lr-shell.css §5)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-deck-exit {
  margin-left: 0;
  margin-right: 14px;
}

/* -----------------------------------------------------------------------
   5. Tablet view fab (lr-shell.css §5b)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-tablet-fab {
  right: auto;
  left: 22px;
  padding: 13px 16px 13px 20px;
}

/* -----------------------------------------------------------------------
   6. Command card section menu (lr-shell.css §7)
   -------------------------------------------------------------------- */
[dir=rtl] .cc-nav a {
  text-align: right;
}
[dir=rtl] .scenario-copy-status {
  margin-right: 0;
  margin-left: auto;
}

/* -----------------------------------------------------------------------
   7. Analyst callout (lr-shell.css §8)
   -------------------------------------------------------------------- */
[dir=rtl] .analyst-callout {
  border-left: 0;
  border-right: 3px solid var(--blue);
  border-radius: 10px 0 0 10px;
  padding: 14px 18px 14px 16px;
}

/* -----------------------------------------------------------------------
   8. Lists (lr-shell.css §8)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-list {
  padding-left: 0;
  padding-right: 22px;
}

/* -----------------------------------------------------------------------
   9. Quote analysis text alignment (lr-shell.css §8)
   -------------------------------------------------------------------- */
[dir=rtl] .quotebox--analysis .quotebox__current {
  text-align: right;
}
[dir=rtl] .quotebox--analysis .quotebox__who {
  text-align: right;
}
[dir=rtl] .quotebox--analysis .vcar__item.qbcar__item {
  text-align: right;
}

/* -----------------------------------------------------------------------
   10. Explorer picker (lr-shell.css §11)
   -------------------------------------------------------------------- */
[dir=rtl] .explore-picker__col--groups {
  border-right: 0;
  padding-right: 0;
  border-left: 1px solid var(--border);
  padding-left: 20px;
}
[dir=rtl] .explore-picker__row {
  text-align: right;
}
[dir=rtl] .explore-picker__kicker {
  margin: 0 10px 7px 0;
}
@media (max-width: 720px) {
  [dir=rtl] .explore-picker__col--groups {
    border-left: 0;
    padding-left: 0;
  }
}

/* -----------------------------------------------------------------------
   11. Explorer controls (lr-shell.css §11)
   -------------------------------------------------------------------- */
[dir=rtl] .explore-paused-note {
  border-left: 0;
  padding-left: 0;
  border-right: 2px solid var(--amber);
  padding-right: 10px;
}
[dir=rtl] .explore-base {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .explore-sw {
  margin-right: 0;
  margin-left: 6px;
}
[dir=rtl] .explore-ctl-label--inline {
  margin: 0 0 0 8px;
}
@media (max-width: 860px) {
  [dir=rtl] .explore-base {
    margin-right: 0;
  }
}

/* -----------------------------------------------------------------------
   12. "Explore this figure" link (lr-shell.css §11.6)
   -------------------------------------------------------------------- */
[dir=rtl] .chart-card__explore {
  text-align: left;
}

/* -----------------------------------------------------------------------
   13. Lightbox chart head (lr-shell.css §10.2)
   -------------------------------------------------------------------- */
[dir=rtl] .modal--chart .card__head {
  padding-right: 0;
  padding-left: 34px;
}

/* -----------------------------------------------------------------------
   14. Edit panel (lr-shell.css §14)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-edit-btn {
  margin-left: 0;
  margin-right: 8px;
}
[dir=rtl] #lr-edit-panel {
  right: auto;
  left: 0;
  box-shadow: 4px 0 24px rgba(0,0,0,.18);
}
[dir=rtl] .lr-edit__close {
  right: auto;
  left: 16px;
}
[dir=rtl] .lr-edit__box--red ul {
  padding-left: 0;
  padding-right: 20px;
}
[dir=rtl] .lr-draft-tag {
  margin-left: 0;
  margin-right: 10px;
}
[dir=rtl] .lr-lang-status {
  margin-left: 0;
  margin-right: 8px;
}

/* -----------------------------------------------------------------------
   15. Tables (brand.css §15)
   -------------------------------------------------------------------- */
[dir=rtl] table.data th,
[dir=rtl] table.data td {
  text-align: right;
}

/* -----------------------------------------------------------------------
   16. FAQ accordion (brand.css §16)
   -------------------------------------------------------------------- */
[dir=rtl] .faq-q {
  text-align: right;
}

/* -----------------------------------------------------------------------
   17. Pill menu + pill nav (brand.css §7–§8)
   -------------------------------------------------------------------- */
[dir=rtl] .pillmenu__list {
  left: auto;
  right: 0;
}
[dir=rtl] .pillmenu__list button {
  text-align: right;
}
[dir=rtl] .pillnav button.pill-cta svg {
  margin-right: 0;
  margin-left: 6px;
}

/* -----------------------------------------------------------------------
   18. Decision point callout (brand.css §11)
   -------------------------------------------------------------------- */
[dir=rtl] .decision::before {
  left: auto;
  right: 0;
}

/* -----------------------------------------------------------------------
   19. Pullquote + report callout + analysis quote (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .pullquote {
  border-left: 0;
  border-right: 3px solid var(--blue);
}
[dir=rtl] .report-callout {
  border-left: 0;
  border-right: 4px solid var(--blue);
  padding: 6px 22px 6px 0;
}
[dir=rtl] .analysis-quote {
  padding-left: 0;
  padding-right: 14px;
  border-left: 0;
  border-right: 3px solid var(--blue);
}
[dir=rtl] .bquote {
  padding-left: 0;
  padding-right: 16px;
  border-left: 0;
  border-right: 3px solid var(--blue);
}

/* -----------------------------------------------------------------------
   20. Value driver cards (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .driver {
  border-left: 0;
  border-right: 3px solid var(--blue);
}
[dir=rtl] .driver.invest {
  border-left-color: transparent;
  border-right-color: var(--amber);
}

/* -----------------------------------------------------------------------
   21. Waterfall row amounts (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .wf-row .amt {
  text-align: left;
}

/* -----------------------------------------------------------------------
   22. Content gate (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .gate__check {
  text-align: right;
}

/* -----------------------------------------------------------------------
   23. Fab cluster + AI panel (brand.css §19)
   -------------------------------------------------------------------- */
[dir=rtl] .fabcluster {
  right: auto;
  left: 22px;
}
[dir=rtl] .fabcluster__menu {
  right: auto;
  left: 0;
  transform-origin: bottom left;
}
[dir=rtl] .ai-panel {
  right: auto;
  left: 22px;
}
[dir=rtl] .ai-panel__close {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .ai-msg.user {
  border-bottom-right-radius: 14px;
  border-bottom-left-radius: 4px;
}
[dir=rtl] .ai-msg.bot {
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 4px;
}

/* -----------------------------------------------------------------------
   24. Modal close button (brand.css §19b)
   -------------------------------------------------------------------- */
[dir=rtl] .modal__close {
  right: auto;
  left: 16px;
}

/* -----------------------------------------------------------------------
   24b. Quotes modal list scrollbar gutter (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .qmodal__list {
  padding-right: 0;
  padding-left: 4px;
}

/* -----------------------------------------------------------------------
   25. Money input adornment (brand.css §17)
   -------------------------------------------------------------------- */
[dir=rtl] .input-money .adorn {
  border-right: 1px solid var(--border-2);
  border-left: 0;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
[dir=rtl] .input-money input {
  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
}

/* -----------------------------------------------------------------------
   26. Distribution toggle label (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .dist-toggle .toggle-label {
  margin-right: 0;
  margin-left: 2px;
}

/* -----------------------------------------------------------------------
   27. Department card present-value unit (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .dept-card__pv span {
  margin-left: 0;
  margin-right: 6px;
}

/* -----------------------------------------------------------------------
   28. Customize trigger selection (brand.css §20b)
   -------------------------------------------------------------------- */
[dir=rtl] .customize-trigger__sel {
  padding-left: 0;
  padding-right: 12px;
  border-left: 0;
  border-right: 1px solid var(--border-2);
}
[dir=rtl] .customize-trigger--hero .customize-trigger__caret {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .customize-trigger--hero .customize-trigger__sel {
  border-right: 0;
  padding-right: 0;
}
[dir=rtl] .customize-trigger--roi .customize-trigger__caret {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .customize-trigger--hero {
  text-align: right;
}
[dir=rtl] .customize-sel {
  text-align: left;
}

/* -----------------------------------------------------------------------
   29. Case-feature drop cap + sidebar (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .case-feature--about .case-feature__prose > p:first-child::first-letter,
[dir=rtl] .case-feature--lr .case-feature__prose > p:first-child::first-letter,
[dir=rtl] .case-feature--summary .case-feature__prose > p:first-child::first-letter {
  float: right;
  padding: 6px 0 0 12px;
}
[dir=rtl] .case-feature__side {
  border-left: 0;
  border-right: 1px solid var(--border-2);
  padding-left: 0;
  padding-right: 28px;
}
@media (max-width: 900px) {
  [dir=rtl] .case-feature__side {
    border-right: 0;
  }
}
/* Hover transform-origin for sidebar items */
[dir=rtl] .case-feature__side .cfsrc,
[dir=rtl] .case-feature__side .cfb,
[dir=rtl] .case-feature__side .cfstat {
  transform-origin: right center;
}

/* -----------------------------------------------------------------------
   30. Report TOC (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .report-toc {
  margin: -8px 16px 18px 0;
  border-radius: 0 0 16px 16px;
}
[dir=rtl] .report-toc__bar {
  left: auto;
  right: 0;
}
[dir=rtl] .report-toc__lab {
  margin: 0 8px 0 6px;
}
[dir=rtl] .report-toc__dl {
  margin-left: 0;
  margin-right: auto;
}
@media (max-width: 1180px) {
  [dir=rtl] .report-toc {
    margin-right: 0;
  }
}
@media (max-width: 900px) {
  [dir=rtl] .report-toc__dl {
    margin-right: 0;
  }
}

/* -----------------------------------------------------------------------
   31. Bullets (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .ro-bullets {
  padding-left: 0;
  padding-right: 22px;
}

/* -----------------------------------------------------------------------
   32. Methodology sponsor + list (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .method-open__sponsor {
  border-left: 0;
  padding-left: 0;
  border-right: 3px solid var(--blue);
  padding-right: 14px;
}
[dir=rtl] .method-list li {
  padding-left: 0;
  padding-right: 22px;
}
[dir=rtl] .method-list li::before {
  left: auto;
  right: 0;
}

/* -----------------------------------------------------------------------
   33. Note meta date + about LinkedIn link (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .note-meta__date {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .about__li {
  margin-left: 0;
  margin-right: auto;
}

/* -----------------------------------------------------------------------
   34. Ingest kind badge (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .ingest__kind {
  margin-left: 0;
  margin-right: 7px;
}

/* -----------------------------------------------------------------------
   35. Data currency livedot (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .currency-line .livedot {
  margin-right: 0;
  margin-left: 8px;
}

/* -----------------------------------------------------------------------
   36. Profile note (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .profile-note {
  margin-left: 0;
  margin-right: 6px;
}

/* -----------------------------------------------------------------------
   37. Self-assessment "You" label (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .sa-cap__you {
  margin-right: 0;
  margin-left: 6px;
}

/* -----------------------------------------------------------------------
   38. Personalized read (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .personalized-read {
  border-left: 0;
  border-right: 4px solid var(--green);
  border-radius: 6px 0 0 6px;
  padding: 30px 22px 6px 8px;
}
[dir=rtl] .personalized-read__tag {
  right: auto;
  left: 6px;
}

/* -----------------------------------------------------------------------
   39. LR segment view border (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] #lr-mount[data-lrview="segment"] .case-feature--lr {
  border-left: 0;
  padding-left: 0;
  border-right: 3px solid var(--green);
  padding-right: 22px;
}

/* -----------------------------------------------------------------------
   40. Command card section nav (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .cc-nav {
  left: auto;
  right: 0;
}
[dir=rtl] .cc-nav button {
  text-align: right;
}

/* -----------------------------------------------------------------------
   41. Expand-right nav variant (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .commandcard--expandright .cc-nav button + button {
  margin-left: 0;
  margin-right: 2px;
}
[dir=rtl] .commandcard--expandright .cc-nav button + button::before {
  left: auto;
  right: -2px;
}
[dir=rtl] .commandcard--expandright .cc-nav button.is-active::after {
  left: auto;
  right: 18px;
}

/* -----------------------------------------------------------------------
   42. Profile strip (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .profstrip__base {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .profnorm {
  margin-left: 0;
  margin-right: auto;
}
@media (max-width: 900px) {
  [dir=rtl] .profstrip__base {
    margin-right: 0;
  }
  [dir=rtl] .profnorm {
    margin-right: 0;
  }
}

/* -----------------------------------------------------------------------
   43. Profile switch knob (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .profsw__knob {
  margin-left: 0;
  margin-right: 1px;
}
[dir=rtl] .profsw[aria-checked="true"] .profsw__knob {
  transform: translateX(-12px);
}
[dir=rtl] .lrxc-overlays .profsw[aria-checked="true"] .profsw__knob {
  transform: translateX(-18px);
}

/* -----------------------------------------------------------------------
   44. Region chip (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-region-chip {
  margin-right: 0;
  margin-left: 8px;
}

/* -----------------------------------------------------------------------
   45. ROI hero card alignment (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .roi-hero-card {
  text-align: left;
}
[dir=rtl] .roi-hero-card__range {
  margin-left: 0;
  margin-right: auto;
}
[dir=rtl] .roi-hero-card__sub {
  justify-content: flex-start;
}
[dir=rtl] .roi-hero-card__sub > div {
  align-items: flex-start;
}
[dir=rtl] .roi-hero-card__sub .l {
  justify-content: flex-start;
}
@media (max-width: 900px) {
  [dir=rtl] #roi-mount .hero-grid--roi .roi-hero-card {
    text-align: center;
  }
  [dir=rtl] #roi-mount .roi-hero-card__range {
    margin-right: auto;
    margin-left: auto;
  }
  [dir=rtl] #roi-mount .roi-hero-card__sub {
    justify-content: center;
  }
  [dir=rtl] #roi-mount .roi-hero-card__sub > div {
    align-items: center;
  }
  [dir=rtl] #roi-mount .roi-hero-card__sub .l {
    justify-content: center;
  }
}

/* -----------------------------------------------------------------------
   46. Hero downloads menu anchor (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .hero-downloads__menu {
  left: 0;
  right: auto;
}
@media (max-width: 900px) {
  [dir=rtl] .hero-downloads__menu {
    left: 0;
    right: 0;
  }
}

/* -----------------------------------------------------------------------
   47. Inline value text-align (brand.css §17)
   -------------------------------------------------------------------- */
[dir=rtl] .input-row.inline .val {
  text-align: left;
}
[dir=rtl] .sa-input .val {
  text-align: left;
}
[dir=rtl] .sa-row__val {
  text-align: left;
}
[dir=rtl] .drv__val {
  text-align: left;
}

/* -----------------------------------------------------------------------
   48. Export-opt + ai-suggest text alignment (brand.css)
   -------------------------------------------------------------------- */
[dir=rtl] .export-opt {
  text-align: right;
}
[dir=rtl] .ai-suggest {
  text-align: right;
}
[dir=rtl] .ai-suggest b {
  display: block;
}
[dir=rtl] .ai-followup {
  text-align: right;
}
[dir=rtl] .gate__form {
  text-align: right;
}
[dir=rtl] .gatewrap__veil .gate__form {
  text-align: right;
}
[dir=rtl] .gatewrap__veil--unlocked .export-grid {
  text-align: right;
}

/* -----------------------------------------------------------------------
   49. Deck slides text alignment (lr-shell.css §9)
   -------------------------------------------------------------------- */
[dir=rtl] .lr-deck__slide--section .lr-deck__slide-inner,
[dir=rtl] .lr-deck__slide--explore .lr-deck__slide-inner {
  text-align: right;
}
[dir=rtl] .lr-deck .taki__metric {
  text-align: right;
}
[dir=rtl] .lr-deck__insights {
  text-align: right;
}
[dir=rtl] .lr-deck__chart-wrap {
  text-align: right;
}
[dir=rtl] .lr-deck__wtd-list {
  text-align: right;
}
[dir=rtl] .lr-deck__explore {
  text-align: right;
}

/* -----------------------------------------------------------------------
   50. Phone footer stack (lr-shell.css §13.9)
   -------------------------------------------------------------------- */
@media (max-width: 480px) {
  [dir=rtl] .site-footer .row {
    text-align: center;
  }
}

/* -----------------------------------------------------------------------
   51. Command card dropdown at 640px (brand.css)
   -------------------------------------------------------------------- */
@media (max-width: 640px) {
  [dir=rtl] .commandcard--dropdown .cc-nav {
    left: 0;
    right: 0;
  }
}
