/* CBASCO — Language Direction Support
 *
 * The site is built RTL-first (Persian). When a visitor switches to an
 * LTR language (English, etc.) we re-flow:
 *   - text direction
 *   - flex/grid item order (so the "first" cell sits on the left)
 *   - physical margins/paddings that were tuned for the RTL flow
 *
 * The header itself is INTENTIONALLY left untouched — per the user's
 * request, the header stays in its RTL layout regardless of the body
 * language so the logo + apps + lang switcher + CTA + burger keep their
 * familiar positions.
 *
 * Selector strategy: everything is scoped to `body.cbasco-dir-ltr` so
 * Persian visitors see zero overrides. The ONLY element kept RTL in LTR
 * mode is `.cbasco-header` (and its non-language-switcher children) —
 * per the user's request the header logo / apps icon / lang switcher /
 * CTA / burger should keep their familiar positions in every language.
 * Everything else — including the hamburger menu panel (.cbnav-panel),
 * the apps-launcher dropdown (.cbapps-panel), and the marquee
 * announcement bar (.cbasco-marquee) — re-aligns to the selected
 * language direction so menu items, system tiles and announcements
 * read naturally.
 * ═══════════════════════════════════════════════════════════════════ */

/* ──────────── 1) Document-level direction ──────────── */
body.cbasco-dir-ltr { direction: ltr; text-align: start; }

/* Force ONLY the visual header itself to keep its RTL layout no matter
 * what the body says — the user wants the logo + apps trigger + lang
 * switcher + CTA + burger to keep their familiar positions. The panels
 * those triggers open (hamburger nav, apps launcher) and the marquee
 * announcement bar DO follow the selected language so their content
 * (menu items, system tiles, announcements) reads naturally. */
body.cbasco-dir-ltr .cbasco-header,
body.cbasco-dir-ltr .cbasco-header *:not(.cblang-switcher-panel):not(.cblang-switcher-panel *):not(.cbapps-panel):not(.cbapps-panel *) { direction: rtl; }

/* Hamburger panel, Apps launcher dropdown, and Marquee announcement bar
 * all follow the body direction in LTR mode. Their FIXED-position
 * placement on screen (panel slides from screen-LEFT, apps dropdown
 * anchors to its trigger) stays the same — only the INSIDE content
 * re-aligns to LTR (text-align, sub-menu indent, item-icon-text pairs,
 * scrolling direction of the marquee animation). */
body.cbasco-dir-ltr .cbnav-panel,
body.cbasco-dir-ltr .cbnav-panel *,
body.cbasco-dir-ltr .cbapps-panel,
body.cbasco-dir-ltr .cbapps-panel *,
body.cbasco-dir-ltr .cbasco-marquee,
body.cbasco-dir-ltr .cbasco-marquee * { direction: ltr; text-align: start; }

/* The language switcher panel itself must follow current language so the
 * native names align correctly. */
body.cbasco-dir-ltr .cblang-switcher-panel { direction: ltr; text-align: left; }

/* ──────────── 2) Main content — text direction only, NOT alignment ────────────
 * IMPORTANT: we don't force text-align on individual headings/paragraphs.
 * Elements that the theme deliberately centered (hero titles, section
 * titles with `text-align: center`, CTA blocks, etc.) MUST stay centered
 * in every language. We only flip `direction: ltr` on the container,
 * which makes child text flow correctly without overriding their own
 * center alignment. */
body.cbasco-dir-ltr main,
body.cbasco-dir-ltr #primary,
body.cbasco-dir-ltr .cbasco-footer,
/* Page-template wrappers that hard-code `direction: rtl` in their own CSS
 * (history.css, strategy.css, csr.css, packaging.css …). The body-level
 * rule alone wouldn't override the id-scoped rule due to specificity. */
body.cbasco-dir-ltr #cbas-history,
body.cbasco-dir-ltr #cbas-strategy,
body.cbasco-dir-ltr #cbas-csr,
body.cbasco-dir-ltr [class*="cbas-"],
body.cbasco-dir-ltr [id^="cbas-"],
body.cbasco-dir-ltr [class*="cbab-"],
body.cbasco-dir-ltr [class*="cbcat-"],
body.cbasco-dir-ltr [class*="cbsh-"],
body.cbasco-dir-ltr [class*="cbsp-"],
body.cbasco-dir-ltr [class*="cbpk-"],
body.cbasco-dir-ltr [class*="cbcert-"],
body.cbasco-dir-ltr [class*="cbcon-"],
body.cbasco-dir-ltr [class*="cbtour-"],
body.cbasco-dir-ltr [class*="cbpl-"],
body.cbasco-dir-ltr [class*="cbf-"] { direction: ltr; }

/* Hard-coded inline `text-align:right` inside post content (which was
 * meant for RTL) becomes wrong in LTR — flip it.  We DO NOT touch
 * `text-align:center` or `text-align:justify`. */
body.cbasco-dir-ltr main [style*="text-align:right" i],
body.cbasco-dir-ltr main [style*="text-align: right" i] { text-align: left !important; }
body.cbasco-dir-ltr main [style*="text-align:left" i],
body.cbasco-dir-ltr main [style*="text-align: left" i]  { text-align: right !important; }

/* ──────────── 3) Flex/grid item order — reverse the "first wins right" ──────────── */
/* Most cards in the theme use plain flex-row / grid. With direction:ltr
 * applied, browsers automatically reverse the visual order of children
 * for those direction-sensitive layouts. */

/* Explicit reversals where the theme used `flex-direction: row-reverse`
 * (intended for RTL but now reads "backwards" in LTR) */
body.cbasco-dir-ltr .cbf-intro-grid,
body.cbasco-dir-ltr .cbf-cta-card,
body.cbasco-dir-ltr .cbf-news-head,
body.cbasco-dir-ltr .cbab-grid,
body.cbasco-dir-ltr .cbsh-row,
body.cbasco-dir-ltr .cbsp-grid,
body.cbasco-dir-ltr .cbpk-modes,
body.cbasco-dir-ltr .cbcat-grid,
body.cbasco-dir-ltr .cbtour-grid,
body.cbasco-dir-ltr .cbcon-grid {
	direction: ltr;
}

/* ──────────── 4) Physical margins/paddings → logical equivalents ──────────── */
/* Common patterns from the theme that used margin-right/left for spacing
 * between an icon and its text. In LTR we swap them. */
body.cbasco-dir-ltr .cbasco-sec-tag        { padding-inline: 1rem; }
body.cbasco-dir-ltr .cbf-pill              { padding-inline: 1rem; }
body.cbasco-dir-ltr .cbn-card .cbn-card-meta { gap: .5rem; }

/* News/notice cards icon-text pairing */
body.cbasco-dir-ltr .cbn-card-icon  { margin-inline-end: .5rem; margin-right: 0 !important; margin-left: 0 !important; }
body.cbasco-dir-ltr .cbn-card-arrow { transform: scaleX(-1); }   /* arrow points to where text ends */
body.cbasco-dir-ltr .cbasco-btn .cbasco-btn-arrow,
body.cbasco-dir-ltr .cbasco-btn svg[viewBox="0 0 24 24"] { transform: scaleX(-1); }

/* ──────────── 5) Borders that were on a specific side ──────────── */
/* If the original used `border-right: 4px solid` to draw an RTL leading bar,
 * we move it to the LTR leading edge. */
body.cbasco-dir-ltr [class*="border-right"],
body.cbasco-dir-ltr .cbasco-sec-tag,
body.cbasco-dir-ltr .cb-feat-card,
body.cbasco-dir-ltr .cbf-feat-card {
	/* leave borders unchanged but ensure padding flows from the leading edge */
	padding-inline-start: 1rem;
}

/* ──────────── 6) Breadcrumbs ──────────── */
body.cbasco-dir-ltr .cbasco-breadcrumbs-list { flex-direction: row; }

/* ──────────── 7) Pagination + lists ──────────── */
body.cbasco-dir-ltr .nav-links { direction: ltr; }
body.cbasco-dir-ltr .page-numbers { direction: ltr; }

/* ──────────── 8) Tables — numeric columns prefer right-align in LTR too ──────────── */
body.cbasco-dir-ltr table th,
body.cbasco-dir-ltr table td { text-align: start; }
body.cbasco-dir-ltr table th.numeric,
body.cbasco-dir-ltr table td.numeric { text-align: end; }

/* ──────────── 9) Inline form widgets ──────────── */
body.cbasco-dir-ltr input,
body.cbasco-dir-ltr textarea,
body.cbasco-dir-ltr select { direction: ltr; text-align: start; }
/* But form labels and help text follow language direction naturally */
body.cbasco-dir-ltr label { text-align: start; }

/* ──────────── 10) Reveal animations — flip slide direction ──────────── */
@keyframes cbasco-reveal-fade-up-ltr {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}
body.cbasco-dir-ltr .cbasco-reveal { animation-name: cbasco-reveal-fade-up-ltr; }

/* ──────────── 11) The hero "scroll" indicator + carat icons ──────────── */
/* .cbf-hero-scroll already centers itself via `left:0;right:0;margin:0 auto;
 * width:fit-content` in front-page.css — works identically in RTL & LTR.
 * No override needed. */

/* ──────────── 12) Marquee — text direction + scroll direction follow language ──────────── */
/* Inner text direction is handled by the `body.cbasco-dir-ltr .cbasco-marquee *`
 * rule near the top. The marquee animation keyframes (LTR vs RTL scroll)
 * are picked up automatically from `html[dir=...]` because WordPress
 * sets the dir attribute based on the active locale. */

/* ──────────── 13) Apps launcher dropdown — follows language too ──────────── */
/* Handled by the `body.cbasco-dir-ltr .cbapps-panel *` rule near the
 * top — system tile titles + subtitles re-align to LTR in English. */

body.cbasco-dir-ltr .cbasco-footer-cols { direction: ltr; }
body.cbasco-dir-ltr .