/* ============================================================
   RIDKK app panel — Arabic (RTL) layer. Loaded only when the
   dashboard locale is `ar`. Filament flips its own components;
   this file fixes our custom .rdk-* / .rdkx-* / .rsw-* blocks
   and gives Arabic a proper UI typeface.
   ============================================================ */

html[dir="rtl"] body,
html[dir="rtl"] .fi-body,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] button {
  font-family: "IBM Plex Sans Arabic", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  letter-spacing: 0 !important;
}

/* Latin-only tokens (numbers, IDs, codes, emails) keep tabular western digits. */
html[dir="rtl"] .fi-ta-text-item-label,
html[dir="rtl"] .rdk-inv td.num,
html[dir="rtl"] .rdk-inv th.num,
html[dir="rtl"] .rdk-inv-balance { font-variant-numeric: tabular-nums; }

/* Headings in Arabic look cramped with negative tracking. */
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] h4,
html[dir="rtl"] .fi-header-heading,
html[dir="rtl"] .rdk-inv-title,
html[dir="rtl"] .rdk-inv-balance,
html[dir="rtl"] .rdk-kpi b { letter-spacing: 0 !important; }

/* ---- Deal stage stepper (chevrons point the other way) ---- */
html[dir="rtl"] .rdk-step {
  padding: 6px 18px 6px 12px;
  clip-path: polygon(100% 0, 12px 0, 0 50%, 12px 100%, 100% 100%, calc(100% - 12px) 50%);
}
html[dir="rtl"] .rdk-step:first-child {
  clip-path: polygon(100% 0, 12px 0, 0 50%, 12px 100%, 100% 100%);
  padding-right: 14px; padding-left: 12px;
  border-radius: 0 10px 10px 0;
}
html[dir="rtl"] .rdk-step:last-child {
  clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%, calc(100% - 12px) 50%);
  border-radius: 10px 0 0 10px;
}

/* ---- Invoice / quotation paper ---- */
html[dir="rtl"] .rdk-inv thead th { text-align: right; }
html[dir="rtl"] .rdk-inv td.num, html[dir="rtl"] .rdk-inv th.num { text-align: left; }
html[dir="rtl"] .rdk-inv-totals { margin-left: 0; margin-right: auto; }

/* ---- Inbox thread ---- */
html[dir="rtl"] .rdkx-b .who { margin-right: 0; margin-left: auto; }
html[dir="rtl"] .rdkx-mail.out { border-left: 0; border-right: 4px solid var(--wa-teal); }
html[dir="rtl"] .rdkx-mail-date { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .rdkx-mail-body blockquote { padding-left: 0; padding-right: 10px; border-left: 0; border-right: 3px solid #d1d5db; }
html[dir="rtl"] .rdkx-notebox .re { margin-left: 0; margin-right: auto; }

/* Customer messages (often Arabic) and agent replies: let each bubble pick its own direction. */
html[dir="rtl"] .rdkx-b .txt, html[dir="rtl"] .rdkx-mail-body { unicode-bidi: plaintext; }

/* ---- AI accountant tables ---- */
html[dir="rtl"] .rdk-acc-bubble td, html[dir="rtl"] .rdk-acc-bubble th { text-align: right; }

/* ---- Accounting connection toggle ---- */
html[dir="rtl"] .rdk-conn-toggle i::after { left: auto; right: 2px; }
html[dir="rtl"] .rdk-conn-toggle i.on::after { left: auto; right: 16px; }

/* ---- Support widget (already has [dir=rtl] rules; badge corner) ---- */
html[dir="rtl"] .rsw-fab .rsw-dot { right: auto; left: -4px; }
html[dir="rtl"] .rsw-thumb button { right: auto; left: 2px; }

/* ---- Kanban / CRM board scroll direction ---- */
html[dir="rtl"] .rdk-board { direction: rtl; }