/*!/wp-content/plugins/mwai-gapgpt-connector/assets/persian.css*//*
 * Persian presentation for AI Engine screens.
 *
 * Scoped to AI Engine's own containers so wp-admin keeps WordPress's styling.
 * The font is declared with a local-first stack: if the visitor already has a
 * good Persian face installed we use it, and the bundled webfont is only the
 * fallback that guarantees identical rendering everywhere. That avoids shipping
 * a large font file to people who do not need it while keeping the layout
 * deterministic on machines that have no Persian font at all.
 *
 * `font-display: swap` keeps first paint fast: text renders in the fallback and
 * is re-rendered when the font arrives, rather than blocking the whole SPA.
 */

/*
 * Vazirmatn, SIL Open Font License 1.1 (see fonts/Vazirmatn-OFL.txt). A freely
 * redistributable face is the only kind that belongs in a distributed package.
 *
 * `local()` is tried first: an operator who already has Vazirmatn or IRANSansX
 * installed gets the installed copy and no download at all. `unicode-range`
 * limits the download to the blocks Persian actually uses, so a browser that
 * never renders Persian text never fetches the file.
 */
@font-face{font-family:"MWAI Persian";src:local("Vazirmatn Regular"),
local("Vazirmatn"),
url("/wp-content/plugins/mwai-gapgpt-connector/assets/fonts/vazirmatn-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200D, U+0020-007E;}

@font-face{font-family:"MWAI Persian";src:local("Vazirmatn Medium"),
local("Vazirmatn Medium Regular"),
url("/wp-content/plugins/mwai-gapgpt-connector/assets/fonts/vazirmatn-medium.woff2") format("woff2");font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200D, U+0020-007E;}

:root {
  --mwai-persian-font: "MWAI Persian", -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, sans-serif;
}

/*
 * Typography.
 *
 * Persian needs more line height than Latin at the same size (the ascenders and
 * descenders are taller and the diacritics sit above them), and it needs
 * slightly larger sizes to stay legible. Neither of those is a stylistic
 * preference: text that fits in the Latin layout clips in Persian.
 */
#mwai-admin-settings,
#mwai-playground,
#mwai-dashboard,
#mwai-content-generator,
#mwai-image-generator,
#mwai-video-generator,
.mwai-chatbot,
.mwai-form-container {
  font-family: var(--mwai-persian-font);
}

#mwai-admin-settings,
#mwai-playground,
#mwai-dashboard,
#mwai-content-generator,
#mwai-image-generator,
#mwai-video-generator {
  line-height: 1.75;
}

/*
 * Persians numbers: the SPA sometimes writes Western digits inside Persian
 * sentences, which is normal in technical UI — so nothing is converted. What is
 * fixed here is the *direction* of purely numeric content, which must stay LTR
 * or "1536" renders as "6351".
 */
#mwai-admin-settings input[type="number"],
#mwai-admin-settings input[type="url"],
#mwai-admin-settings input[type="email"],
#mwai-admin-settings input[type="tel"],
#mwai-admin-settings code,
#mwai-admin-settings pre,
#mwai-admin-settings .components-text-control__input[type="url"],
#mwai-admin-settings .components-text-control__input[type="number"],
.mwai-chatbot code,
.mwai-chatbot pre {
  direction: ltr;
  text-align: left;
  unicode-bidi: embed;
}

/*
 * Do NOT letter-space Arabic script: the letters are joined, and adding space
 * between them breaks the word shape visually. This undoes any Latin-oriented
 * `letter-spacing` a theme or the SPA may apply to headings and buttons.
 */
#mwai-admin-settings h1,
#mwai-admin-settings h2,
#mwai-admin-settings h3,
#mwai-admin-settings h4,
.mwai-chatbot h1,
.mwai-chatbot h2,
.mwai-chatbot button,
.mwai-chatbot .mwai-button {
  letter-spacing: normal;
  word-spacing: normal;
}

/*
 * Icons and chevrons are direction-sensitive: the SPA draws "next" as a
 * right-pointing chevron, which reads as "back" in Persian. Mirror only the
 * directional glyphs, never the icons that carry meaning by their own shape.
 */
[dir="rtl"] #mwai-admin-settings .components-panel__arrow,
[dir="rtl"] #mwai-admin-settings .dashicons-arrow-right-alt2,
[dir="rtl"] #mwai-admin-settings .dashicons-arrow-left-alt2,
[dir="rtl"] #mwai-admin-settings .mwai-chevron {
  transform: scaleX(-1);
}

/*
 * Scrollbars and overflow: in RTL the horizontal scrollbar starts on the right,
 * and a container that only ever had a left margin looks like it is cut off.
 * Both are corrected by using logical properties where the SPA used physical
 * ones on the containers we own.
 */
[dir="rtl"] #mwai-admin-settings,
[dir="rtl"] #mwai-dashboard,
[dir="rtl"] #mwai-playground {
  text-align: right;
}

[dir="rtl"] #mwai-admin-settings .components-panel__body,
[dir="rtl"] #mwai-dashboard .components-panel__body {
  padding-inline: 16px;
  padding-left: 16px;
  padding-right: 16px;
}

/*
 * Tables: the first column is the label and must lead on the right. Cell
 * alignment follows the text direction, but numeric columns keep their LTR
 * order so figures stay comparable at a glance.
 */
[dir="rtl"] #mwai-admin-settings table {
  text-align: right;
}

[dir="rtl"] #mwai-admin-settings table td.mwai-numeric,
[dir="rtl"] #mwai-admin-settings table th.mwai-numeric {
  direction: ltr;
  text-align: left;
  unicode-bidi: embed;
}

/* Form controls inherit the font; browsers do not do this by default. */
#mwai-admin-settings input,
#mwai-admin-settings select,
#mwai-admin-settings textarea,
#mwai-admin-settings button,
.mwai-chatbot input,
.mwai-chatbot textarea,
.mwai-chatbot button {
  font-family: inherit;
}

/*
 * The chatbot's own message bubbles: the operator's typing area grows with the
 * content, and Persian metrics make it a little taller than the Latin default.
 */
.mwai-chatbot .mwai-input,
.mwai-chatbot textarea {
  line-height: 1.8;
  min-height: 2.75em;
}

/*
 * The SPA's outer gutter, which is hard-coded to one physical side.
 *
 * Measured on the live admin screen: AI Engine writes
 *
 *   .ljTBFJ { margin-left: -20px; margin-bottom: -26px; }
 *
 * onto the element that also carries the stable class `neko-page`. The -20px
 * is not arbitrary: wp-admin gives `#wpcontent` a 20px padding, and the SPA
 * reaches into that gutter so its content runs edge to edge. WordPress mirrors
 * that padding in RTL (`#wpcontent` keeps its 20px on the RIGHT), but AI Engine's
 * margin is physical, not logical, so it still pulls 20px to the LEFT. The
 * result is measured and concrete: the SPA box starts at x = -20 and the page
 * grows 20px wider than the viewport.
 *
 * Mirrored would be `margin-right: -20px; margin-left: 0`, which reaches into
 * the right-hand gutter that actually exists in RTL. `margin-bottom` is vertical
 * and is deliberately left alone. The selector uses `neko-page` rather than the
 * styled-components hash (`ljTBFJ`), because the hash is regenerated whenever AI
 * Engine rebuilds its bundle; the semantic class is the part that is meant to
 * stay.
 *
 * The rule is placed at the end of this file and wins on specificity
 * (`[dir=rtl] #mwai-admin-settings .neko-page` is two classes and an id against
 * the bundle's single class), not on source order, so it does not depend on
 * being enqueued after the SPA's own injected styles.
 */
[dir="rtl"] #mwai-admin-settings .neko-page,
[dir="rtl"] #mwai-dashboard .neko-page,
[dir="rtl"] #mwai-playground .neko-page {
  margin-left: 0;
  margin-right: -20px;
}

/*
 * --- The trigger bubble ("Icon Text"): a compact greeting chip -------------
 *
 * HISTORY, because this rule has been corrected once and the reason matters.
 *
 * A site-level stylesheet (an AI Engine theme "Custom CSS" override, injected by
 * the chatbot bundle as an inline <style> inside `#mwai-chatbot-default`) was
 * pinning the greeting bubble with `!important` to:
 *
 *   font-size: 8px;  line-height: 1.1;  max-width: 75px;  padding: 2px 4px;
 *   white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;
 *
 * 8px is below every legibility floor, and `nowrap` + `75px` + ellipsis clipped
 * the text instead of sizing it. The first correction re-asserted AI Engine's
 * OWN theme defaults from `themes/messages.css:1901` (`font-size: 14px;
 * line-height: 1.45; max-width: 270px; padding: 12px 16px; border-radius: 12px`),
 * which stopped the clipping - and that was reported as fixed.
 *
 * MEASURED AGAIN, 2026-10-21, at 1440x900, 834x1112 and 390x844: those defaults
 * are wrong for a two-word greeting. The bubble renders 66.2 x 73.3 px - TALLER
 * than the 64 px launcher it points at - because `max-width: 270px` is only a
 * ceiling: the bubble is a child of the 66.2 px wide `.mwai-trigger`, so its
 * available width is ~66 px, and with 32 px of horizontal padding only ~34 px
 * remained for "سلام!". The text wrapped to two lines and the 22 px header row
 * plus 5 px margin (`themes/messages.css:1918`) sat on top of that. The
 * operator's report is exactly this: the popup is far too large on desktop as
 * well as on mobile.
 *
 * The values below are therefore a deliberate compact design, not a restoration:
 *
 *   font-size: 11px / line-height: 1.3   legible, and the same floor this file
 *                                        uses elsewhere for secondary UI text
 *   padding: 5px 10px                    a chip, not a panel
 *   border-radius: 10px                  reads as a small pill
 *   max-width: none                      sizes to its own content instead of
 *                                        inheriting the 66 px trigger width,
 *                                        which is what forced the wrap
 *   white-space: nowrap                  "سلام!" is one short line; wrapping is
 *                                        what made the bubble tall
 *
 * Why `!important` and why the extra `.mwai-chatbot-container` ancestor:
 * the override we are answering carries `!important` itself and is emitted
 * AFTER this stylesheet (it is appended into the chatbot container at runtime,
 * near the end of <body>), so source order would lose the tie. The extra
 * ancestor raises specificity to (0,5,0) against the override's (0,4,0), and
 * the `!important` settles the remaining tie. It is the only way to win
 * against a third-party `!important` without editing that third party.
 *
 * Scope: the trigger bubble only. Nothing else about the chatbot is touched.
 */
:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-trigger .mwai-icon-text-container,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme) .mwai-trigger .mwai-icon-text-container {
  position: relative !important;
  bottom: auto !important;
  right: auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
}

:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-trigger .mwai-icon-text-container .mwai-icon-text,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme) .mwai-trigger .mwai-icon-text-container .mwai-icon-text {
  max-width: none !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  padding: 5px 10px !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/*
 * The bubble-to-launcher alignment is NOT here. It lives in
 * assets/persian-rtl.css (section 2), because the guard this rule used was
 * inert and the defect it was written to fix therefore came back.
 *
 * MEASURED, 2026-10-21, 1440x900 / 834x1112 / 390x844 on the local install:
 * this rule declared `:dir(rtl)`, and `:dir(rtl)` matched NOTHING.
 * `document.documentElement.matches(":dir(rtl)")` is false, and so is the same
 * test on the trigger, on `.mwai-icon-text-container` and on the chip itself.
 * `:dir()` resolves from the direction of the element or an ANCESTOR; it does
 * not match an element whose own `direction` was set by a stylesheet, which is
 * exactly how this layer establishes RTL. This install is an LTR locale
 * (`document.dir === ""`, no `dir` attribute on html or body), so the
 * pseudo-class had nothing to resolve against and `align-items` stayed at
 * upstream's `end` / `flex-end`. Result: `bubble.right - trigger.right`
 * measured -24.4 px - the chip sat 24.4 px to the LEFT of the launcher, the
 * same class of defect the rule existed to remove (17.1 px before the compact
 * sizing landed).
 *
 * This sheet is the typography layer and is loaded on every locale, so it is
 * the wrong home for a rule that is only correct once the widget is RTL. The
 * rule now lives in the RTL sheet, whose own existence is the condition.
 */

/*
 * The bubble header is collapsed, because in this install it holds nothing but
 * the close button.
 *
 * MEASURED: the header is `display: flex; min-height: 22px; margin-bottom: 5px`
 * (`themes/messages.css:1918`), and the React tree renders it with the avatar
 * and the name only when those are configured
 * (`app/chatbot.js:2:235794` - `React.createElement("div",{className:"mwai-icon-text-header"}, t, r && ...name, closeButton)`).
 * This chatbot sets `aiName: ""` and no avatar, so `t` and `r` are falsy and the
 * header is 22px of empty box plus a 5px margin above a one-line greeting. That
 * is 27 of the measured 73.3px bubble height, i.e. the popup was taller than
 * the robot it points at.
 *
 * Taking the header out of flow removes those 27px and lets the close button be
 * positioned against the chip's corner instead of inside a header row.
 *
 * CORRECTION (1.3.7): out of flow was not enough. The close control inside the
 * header is absolutely positioned at a negative offset, so collapsing the header
 * to `height: 0` still left the X painting over the chip - the operator's
 * "the X is still huge". `display: none` is the correct value: it removes the
 * header, its "AI" label and the close control from paint and from the
 * accessibility tree in one declaration.
 */
:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-header,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme) .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-header {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  display: none !important;
  pointer-events: none !important;
}

/*
 * The close control: a small glyph in the chip's top-right corner, with a hit
 * area that stays a full 24 x 24 px.
 *
 * Two competing requirements, both real. The operator's is that the control is
 * far too large today. The accessibility one is WCAG 2.2 SC 2.5.8 (Target Size
 * Minimum, AA), which wants a 24 x 24 CSS px target - and the bubble itself is
 * also a target (clicking it opens the chatbot), so a genuinely tiny close
 * button would be mis-tapped and would open the chat when the visitor meant to
 * dismiss the greeting.
 *
 * The two are reconciled by separating the VISUAL box from the HIT box: the
 * glyph and its background are 16 x 16 px, and an `::after` overlay expands the
 * clickable region to 24 x 24 px. Nothing about the chip grows.
 *
 * `right`/`top` are physical on purpose: the close is pinned to the physical
 * top-right corner of the chip, which is where a dismiss control is expected in
 * both directions and where it does not sit on top of the greeting text.
 */
:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-close,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme) .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-close {
  --mwai-icon-close-size: 16px;
  position: absolute !important;
  top: -7px !important;
  right: -7px !important;
  left: auto !important;
  bottom: auto !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  font-size: 9px !important;
  line-height: 1 !important;
  border-radius: 50% !important;
  background: rgba(0, 0, 0, 0.55) !important;
  color: #fff !important;
  opacity: 0.9 !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-close::after,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme) .mwai-trigger .mwai-icon-text-container .mwai-icon-text .mwai-icon-text-close::after {
  content: "" !important;
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  bottom: -4px !important;
  left: -4px !important;
}

/*
 * The gap between the bubble and the chat icon is deliberately NOT set above.
 * AI Engine puts the bubble 15px ABOVE the icon for a bottom-anchored chatbot
 * and 15px BELOW it for a top-anchored one (`.mwai-window.mwai-top-right`
 * / `.mwai-top-left` in `themes/messages.css`), so a single blanket margin
 * would be correct in one anchor and wrong in the other. These two rules mirror
 * AI Engine's own split instead of guessing.
 */
:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-window:is(.mwai-bottom-right, .mwai-bottom-left) .mwai-trigger .mwai-icon-text,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-window:is(.mwai-bottom-right, .mwai-bottom-left) .mwai-trigger .mwai-icon-text {
  margin-bottom: 15px !important;
  margin-top: 0 !important;
}

:is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-chatbot-container .mwai-window:is(.mwai-top-right, .mwai-top-left) .mwai-trigger .mwai-icon-text,
.mwai-chatbot-container :is(.mwai-chatgpt-theme, .mwai-foundation-theme, .mwai-glass-theme, .mwai-messages-theme, .mwai-timeless-theme).mwai-window:is(.mwai-top-right, .mwai-top-left) .mwai-trigger .mwai-icon-text {
  margin-bottom: 0 !important;
  margin-top: 15px !important;
}