/* =====================================================================
   NEDA eCAMPUS - RTL FOUNDATION
   ---------------------------------------------------------------------
   THE BUG THIS FIXES

   Before this file existed, `direction: rtl` was set in exactly nine
   places, ALL of them inside section 9 of neda-header.css, and every one
   of them scoped to a header component: .neda-header-row, the navigation
   submenu, the mobile overlay, the GTranslate switcher.

   Nothing ever set it on the document. So in Arabic, Persian or Kurdish
   the header mirrored correctly and then the entire page below it -
   front-page sections, course-type heroes, content pages, the FAQ and
   the footer - carried on rendering left to right. That is the
   "RTL rule is not maintained on any page" report: the rule was never
   written, not broken.

   THE FIX IS ONE SWITCH, NOT A PATCH PER PAGE

   This file flips `direction` once, on the root element. Everything
   downstream mirrors on its own, PROVIDED the sheets underneath use
   logical properties (margin-inline-start, inset-inline-end,
   text-align: start) rather than physical ones (margin-left, right,
   text-align: left). Converting those was the other half of this change;
   see the companion edits in neda-footer.css, neda-front-sections.css
   and neda-content-page.css.

   Sections 2 and 3 below are only for the handful of things that a
   direction switch CANNOT mirror on its own, and the things that must
   deliberately NOT mirror.

   WHY FIVE HOOKS

   There is no single reliable signal on this site:

     html[dir="rtl"]        the correct, standards signal. NOT currently
                            emitted by anything - GTranslate does not set
                            it and WordPress only sets it for a genuine
                            RTL site locale. It is listed FIRST because it
                            is
                            what the manual-translation work will set, and
                            when that lands the rest of this list becomes
                            belt and braces rather than the load-bearing
                            part.
     html.translated-rtl    what GTranslate actually sets today. This is
                            the hook doing the real work right now.
     html[lang^="ar"]       Arabic     - flag sa
     html[lang^="fa"]       Persian    - flag ir
     html[lang^="ckb"]      Kurdish Sorani - flag iq

   ckb WAS MISSING EVERYWHERE. Kurdish Sorani is one of the site's
   official languages (it has its own flag in the switcher and its own
   entry in the Moodle language menu) and it is written right to left,
   but every RTL hook in the codebase listed only ar and fa. Kurdish was
   therefore rendering fully left-to-right even in the header, which was
   the one place RTL had been done. Section 4 adds it to the header's own
   rules; it is included in every hook list here from the start.

   Prefix matching (^=) not exact matching: the language tag can arrive
   as `fa`, `fa-IR`, `ar-SA`, `ckb-IQ`. An exact `html[lang="fa"]` misses
   all the regional forms - there was one of those in
   neda-content-page.css and it is corrected in section 2.

   The hooks are written out longhand rather than grouped with :is().
   That is the same choice section 9 of neda-header.css documents: the
   linter built into the WordPress editor is old enough to flag :is() as
   a syntax error. These are plugin files rather than pasted boxes so the
   linter no longer reads them, but the rollback path in the plugin
   header still puts this CSS back into an admin box, and the house style
   is longhand. Verbose, identical behaviour.
   ===================================================================== */


/* =====================================================================
   1. THE SWITCH
   ---------------------------------------------------------------------
   On the root element, so it inherits into everything: the theme's
   blocks, the header, the footer, WooCommerce, and any page built later
   without anyone having to remember this file exists.

   `direction` alone is enough. `unicode-bidi` is deliberately NOT set:
   the default `normal` already does the right thing for inherited
   direction, and forcing `bidi-override` would break mixed Latin/Arabic
   strings - a course title like "Skill Bites - مهارت" would render its
   Latin half backwards.
   ===================================================================== */

html[dir="rtl"],
html.translated-rtl,
html[lang^="ar"],
html[lang^="fa"],
html[lang^="ckb"] {
    direction: rtl;
}

/* The theme paints the page background on body and sizes it from the
   root, so body needs the direction too on the (rare) themes that reset
   it. Harmless when it is already inherited. */
html[dir="rtl"] body,
html.translated-rtl body,
html[lang^="ar"] body,
html[lang^="fa"] body,
html[lang^="ckb"] body {
    direction: rtl;
    text-align: start;
}


/* =====================================================================
   2. WHAT A DIRECTION SWITCH CANNOT MIRROR
   ---------------------------------------------------------------------
   Three categories: rotated glyphs drawn from borders, `object-position`
   (which has no logical keyword with usable support), and background
   positions. Everything else in the codebase is now logical and needs
   nothing here.
   ===================================================================== */

/* ---- Carousel arrows ------------------------------------------------
   The chevrons are drawn from two borders on a square and rotated, so
   the direction switch moves the BUTTONS to the correct sides (they use
   inset-inline-* now) but leaves each glyph pointing the way it was
   drawn. In RTL "previous" points right and "next" points left, so the
   two rotations swap.

   The 3px optical nudge is already logical (margin-inline-start), so it
   follows the flip on its own and is not repeated here.
   The front-page hero slider draws the same glyph, and is flipped
   alongside. */
html[dir="rtl"] .neda-fc__nav--prev span,
html.translated-rtl .neda-fc__nav--prev span,
html[lang^="ar"] .neda-fc__nav--prev span,
html[lang^="fa"] .neda-fc__nav--prev span,
html[lang^="ckb"] .neda-fc__nav--prev span,
html[dir="rtl"] .neda-hero-slider__nav--prev span,
html.translated-rtl .neda-hero-slider__nav--prev span,
html[lang^="ar"] .neda-hero-slider__nav--prev span,
html[lang^="fa"] .neda-hero-slider__nav--prev span,
html[lang^="ckb"] .neda-hero-slider__nav--prev span {
    transform: rotate(-45deg);
}

html[dir="rtl"] .neda-fc__nav--next span,
html.translated-rtl .neda-fc__nav--next span,
html[lang^="ar"] .neda-fc__nav--next span,
html[lang^="fa"] .neda-fc__nav--next span,
html[lang^="ckb"] .neda-fc__nav--next span,
html[dir="rtl"] .neda-hero-slider__nav--next span,
html.translated-rtl .neda-hero-slider__nav--next span,
html[lang^="ar"] .neda-hero-slider__nav--next span,
html[lang^="fa"] .neda-hero-slider__nav--next span,
html[lang^="ckb"] .neda-hero-slider__nav--next span {
    transform: rotate(135deg);
}

/* ---- Content-page icons --------------------------------------------
   REPLACES the pair of rules that used to sit at neda-content-page.css
   line 552. Those were wrong twice over: they matched `html[lang="fa"]`
   exactly, so fa-IR missed, and they never listed ar or ckb at all - so
   the icons stayed pinned to the left edge in two of the three RTL
   languages and in every regional variant of the third.

   object-position takes no logical keyword that is safe to ship, so this
   stays a hook-based mirror. It is the only one left in the codebase. */
html[dir="rtl"] .neda-cp-icon img,
html.translated-rtl .neda-cp-icon img,
html[lang^="ar"] .neda-cp-icon img,
html[lang^="fa"] .neda-cp-icon img,
html[lang^="ckb"] .neda-cp-icon img {
    object-position: right center;
}


/* =====================================================================
   3. WHAT MUST NOT MIRROR
   ---------------------------------------------------------------------
   Mirroring is about layout, not about content that has its own
   direction. These are the things that read wrong when flipped.
   ===================================================================== */

/* Latin-script data keeps its own direction inside an RTL paragraph.
   An email address, a URL or a phone number rendered with inherited RTL
   gets its punctuation shuffled to the wrong end - `info@neda-els.com`
   renders as `com.neda-els@info` - because the bidi algorithm treats the
   dots and the @ as neutral and resolves them to the paragraph
   direction. `direction: ltr` plus `unicode-bidi: isolate` fixes it
   without affecting the Arabic text either side.

   isolate, not embed: isolate also stops the run from disturbing the
   ordering of the RTL text around it. */
html[dir="rtl"] .neda-footer-mail,
html.translated-rtl .neda-footer-mail,
html[lang^="ar"] .neda-footer-mail,
html[lang^="fa"] .neda-footer-mail,
html[lang^="ckb"] .neda-footer-mail,
html[dir="rtl"] .neda-footer-tel,
html.translated-rtl .neda-footer-tel,
html[lang^="ar"] .neda-footer-tel,
html[lang^="fa"] .neda-footer-tel,
html[lang^="ckb"] .neda-footer-tel,
html[dir="rtl"] a[href^="mailto:"],
html.translated-rtl a[href^="mailto:"],
html[lang^="ar"] a[href^="mailto:"],
html[lang^="fa"] a[href^="mailto:"],
html[lang^="ckb"] a[href^="mailto:"],
html[dir="rtl"] a[href^="tel:"],
html.translated-rtl a[href^="tel:"],
html[lang^="ar"] a[href^="tel:"],
html[lang^="fa"] a[href^="tel:"],
html[lang^="ckb"] a[href^="tel:"] {
    direction: ltr;
    unicode-bidi: isolate;
}

/* The brand logo is artwork, not layout. It carries the wordmark, so
   flipping it would render the name backwards. Nothing in the codebase
   flips it today - this is a guard so that a future `transform: scaleX`
   mirror applied wholesale cannot reach it. */
html[dir="rtl"] .neda-header-logo img,
html.translated-rtl .neda-header-logo img,
html[lang^="ar"] .neda-header-logo img,
html[lang^="fa"] .neda-header-logo img,
html[lang^="ckb"] .neda-header-logo img,
html[dir="rtl"] .neda-footer-logo img,
html.translated-rtl .neda-footer-logo img,
html[lang^="ar"] .neda-footer-logo img,
html[lang^="fa"] .neda-footer-logo img,
html[lang^="ckb"] .neda-footer-logo img {
    transform: none;
}


/* =====================================================================
   4. ADDING ckb TO THE HEADER'S OWN RTL RULES
   ---------------------------------------------------------------------
   Section 9 of neda-header.css hooks ar and fa only. Rather than editing
   nine multi-selector rules in a 2,500-line file and risking the mobile
   panel's carefully-tied specificity (its comment warns that a shorter
   selector loses the tie and the panel stays on the left), the Kurdish
   hook is added here as a parallel set.

   This file loads AFTER neda-header.css - the enqueue declares it as a
   dependency - so equal-specificity rules land later and win, and the
   selectors below match the originals class for class so the tie
   resolves on order. Where the original carried !important, so does the
   copy.
   ===================================================================== */

html[lang^="ckb"] .neda-header-row {
    direction: rtl;
}

@media (min-width: 1200px) {
    html[lang^="ckb"] .neda-header-row:not(.is-neda-collapsed)
    .neda-header-nav .wp-block-navigation__container {
        justify-content: flex-start;
    }
}

html[lang^="ckb"] .wp-block-navigation__submenu-container {
    direction: rtl;
    text-align: right;
}

html[lang^="ckb"] .wp-block-navigation__responsive-container-content,
html[lang^="ckb"] .wp-block-navigation__responsive-container-content
.wp-block-navigation__container {
    direction: rtl;
    text-align: right;
    align-items: flex-start !important;
}

html[lang^="ckb"] .gt_float_switcher .gt_options,
html[lang^="ckb"] .gt_float_switcher .gt-current-lang {
    direction: rtl;
    text-align: right;
}

/* Mobile panel. The full .is-menu-open chain is repeated deliberately -
   see the warning in neda-header.css section 9. */
html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open {
    justify-content: flex-end !important;
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-close {
    direction: rtl;
    animation-name: neda-panel-in-rtl;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content,
html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content
.wp-block-navigation__container {
    direction: rtl !important;
    text-align: right !important;
    align-items: flex-start !important;
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content {
    text-align: right !important;
    direction: rtl;
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container {
    padding: 0 14px 4px 0 !important;
    text-align: right !important;
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-close {
    right: auto !important;
    left: 0 !important;
}

html[lang^="ckb"]
.wp-block-navigation__responsive-container-content
.gtranslate_wrapper[data-neda-parked] {
    direction: rtl;
    text-align: right;
}


/* =====================================================================
   5. THE dir ATTRIBUTE, FOR WHEN MANUAL TRANSLATION LANDS
   ---------------------------------------------------------------------
   Once the site serves real translated pages rather than GTranslate's
   client-side rewrite, the correct thing is for the server to emit
   `<html dir="rtl" lang="fa">` and for every hook above except the first
   to become redundant. In WordPress that is the `language_attributes`
   filter plus an `is_rtl()` that knows about ckb.

   Nothing here depends on that happening. The hooks are additive: when
   dir="rtl" starts arriving, this file already matches it, and the lang
   and class hooks simply stop being the ones doing the work.
   ===================================================================== */
