/* rtl.css -- right-to-left layout (Arabic, and any language an admin marks
   RTL). app/js/i18n.js sets <html dir="rtl">; flex rows and grids already
   flip on their own, so this only mirrors the rules written with a fixed
   left / right. Loaded after the other stylesheets. */

/* ---------- language switcher (every direction) ---------- */
.lang-switch{ display:inline-flex; align-items:center; gap:5px; width:auto !important; padding:0 8px; font:inherit; font-size:11.5px; font-weight:600; letter-spacing:.04em; color:var(--ink-soft); }
.lang-switch-code{ line-height:1; }
.lang-menu{
  position:fixed; z-index:1000; min-width:200px; max-height:min(420px, 70vh); overflow-y:auto; padding:6px;
  background:var(--surface, #fff); border:1px solid var(--line, #e5e5e5); border-radius:12px;
  box-shadow:0 12px 32px -12px rgba(0,0,0,.28); animation:langMenuIn .14s ease-out;
}
.lang-menu-item{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px; width:100%; padding:8px 10px;
  border:0; border-radius:8px; background:none; font:inherit; font-size:13.5px; color:var(--ink, #111); cursor:pointer; text-align:start;
}
.lang-menu-item:hover, .lang-menu-item:focus-visible{ background:var(--row-hover, #f4f4f5); outline:none; }
.lang-menu-item.is-active{ font-weight:600; color:var(--accent, #2563eb); background:var(--accent-soft, #eef2ff); }
.lang-menu-name{ font-size:11.5px; color:var(--ink-faint, #888); }
@keyframes langMenuIn{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .lang-menu{ animation:none; } }
.shell-topbar-actions{ margin-inline-start:auto; display:flex; align-items:center; gap:4px; }
.login-topline{ position:absolute; top:24px; left:28px; right:28px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.login-topline .login-back{ position:static; }
.login-lang{ height:36px; border-radius:999px; border:1px solid var(--line); background:var(--surface); cursor:pointer; padding:0 12px; }
.login-lang:hover{ border-color:var(--accent); color:var(--ink); }
@media (max-width:900px){ .login-topline{ left:16px; right:16px; top:18px; } }

/* ---------- RTL ---------- */
[dir="rtl"] body{ text-align:right; }
[dir="rtl"] .icon[data-icon="chevronLeft"], [dir="rtl"] .icon[data-icon="chevronRight"],
[dir="rtl"] .icon[data-icon="arrowRight"], [dir="rtl"] .icon[data-icon="arrowLeft"],
[dir="rtl"] .icon[data-icon="logOut"], [dir="rtl"] .icon[data-icon="panelLeft"]{ transform:scaleX(-1); }

/* shell */
[dir="rtl"] .admin-sidebar{ border-right:0; border-left:1px solid var(--line); }
[dir="rtl"] .admin-nav-search .icon{ left:auto; right:10px; }
[dir="rtl"] .admin-nav-search input{ padding-left:10px; padding-right:32px; }
[dir="rtl"] .admin-nav-item, [dir="rtl"] .admin-nav-group-label{ text-align:right; }
[dir="rtl"] .admin-nav-item:hover .icon{ transform:translateX(-1px); }
[dir="rtl"] .admin-nav-item.is-active::before{ left:auto; right:-12px; }
[dir="rtl"] .is-rail .admin-nav-item.is-active::before{ right:-14px; }
[dir="rtl"] .admin-nav-group-label .icon, [dir="rtl"] .nav-badge{ margin-left:0; margin-right:auto; }
[dir="rtl"] .admin-nav-group-label .nav-badge{ margin-right:6px; }
[dir="rtl"] .is-rail .nav-badge{ right:auto; left:3px; }
[dir="rtl"] .shell-rail-tip{ transform:translateY(-50%) translateX(calc(-100% - 20px)); }
@media (max-width:860px){
  [dir="rtl"] .admin-sidebar{ left:auto; right:0; transform:translateX(102%); }
  [dir="rtl"] .is-drawer-open .admin-sidebar{ transform:none; }
}

/* dashboard pieces */
[dir="rtl"] .attn-label{ margin-right:0; margin-left:4px; }
[dir="rtl"] .mg-legend-item{ text-align:right; }
[dir="rtl"] .mg-chart-donut .mg-legend-item b{ margin-left:0; margin-right:auto; padding-left:0; padding-right:10px; }
[dir="rtl"] .mg-data th, [dir="rtl"] .mg-data td, [dir="rtl"] .mg-rows .num, [dir="rtl"] .acct-row dd{ text-align:left; }
[dir="rtl"] .mg-data th:first-child, [dir="rtl"] .mg-rows th{ text-align:right; }
[dir="rtl"] .mg-rows th:first-child, [dir="rtl"] .mg-rows td:first-child{ padding-left:12px; padding-right:18px; }
[dir="rtl"] .mg-rows th:last-child, [dir="rtl"] .mg-rows td:last-child{ padding-right:12px; padding-left:18px; }
[dir="rtl"] .mg-timeline-item:not(:last-child)::before{ left:auto; right:13px; }
[dir="rtl"] .quick-link{ text-align:right; }
[dir="rtl"] .quick-link .icon:last-child{ margin-left:0; margin-right:auto; transform:translateX(3px) scaleX(-1); }
[dir="rtl"] .theme-group legend{ float:right; }
[dir="rtl"] .theme-status{ margin-right:0; margin-left:auto; }
[dir="rtl"] .rep-perf-top .rep-name-link{ text-align:right; }

/* tables, rows, detail pages (style.css / admin.css / portal.css) */
[dir="rtl"] table.order-table th, [dir="rtl"] .order-table td, [dir="rtl"] th{ text-align:right; }
[dir="rtl"] .detail-row-value, [dir="rtl"] .draftbar-item-total, [dir="rtl"] .dfs-opt-n{ text-align:left; }
[dir="rtl"] .line-item-cell, [dir="rtl"] button.line-item-name, [dir="rtl"] .cm-name, [dir="rtl"] .pb-cust-sugg button{ text-align:right; }
[dir="rtl"] .filter-pill b, [dir="rtl"] .cust-filter-pills b, [dir="rtl"] .list-price-was{ margin-left:0; margin-right:4px; }
[dir="rtl"] .ofb-actions, [dir="rtl"] .portal-shop-actions [data-eye-image]{ margin-left:0; margin-right:auto; }
[dir="rtl"] .pd-buy-price{ margin-right:0; margin-left:auto; }
[dir="rtl"] .bo-qty + .bo-qty{ margin-left:0; margin-right:6px; }
[dir="rtl"] .delivery-tracker-line{ left:auto; right:-50%; }
[dir="rtl"] .shop-gallery-nav.prev{ left:auto; right:12px; }
[dir="rtl"] .shop-gallery-nav.next{ right:auto; left:12px; }
[dir="rtl"] .pb-prev{ left:auto; right:10px; } [dir="rtl"] .pb-next{ right:auto; left:10px; }
[dir="rtl"] .cust-combo > .icon{ left:auto; right:11px; }
[dir="rtl"] .cust-combo input{ padding-left:34px; padding-right:32px; }
[dir="rtl"] .cust-combo-toggle{ right:auto; left:4px; }
[dir="rtl"] .search-box .icon{ left:auto; right:12px; }
[dir="rtl"] .search-box input{ padding-left:12px; padding-right:38px; }
[dir="rtl"] .popup-close{ right:auto; left:14px; }
[dir="rtl"] .toast-stack{ right:auto; left:20px; }
[dir="rtl"] .bo-card, [dir="rtl"] [style*="border-left: 3px"]{ border-left-width:1px; border-right:3px solid var(--warning, #b4820a); }

/* login */
[dir="rtl"] .login-back{ padding:8px 10px 8px 14px; }
[dir="rtl"] .login-main{ background:
  radial-gradient(ellipse 60% 50% at 0% 0%, rgba(211,160,52,.10), transparent 70%),
  linear-gradient(180deg, #FFFDF8 0%, var(--bg) 100%); }

/* numbers, codes, emails and SKUs read left-to-right inside RTL text */
[dir="rtl"] input[type="email"], [dir="rtl"] input[type="tel"], [dir="rtl"] input[type="number"], [dir="rtl"] .sku{ direction:ltr; text-align:right; }

/* public website header switcher -- matches .admin-login-link */
.site-lang{ height:38px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:transparent; color:#fff; cursor:pointer; padding:0 12px; flex-shrink:0; }
.site-lang:hover{ border-color:var(--accent); color:var(--accent); }
[dir="rtl"] .topbar-actions{ margin-left:0; margin-right:auto; }
@media (max-width:900px){ [dir="rtl"] .topbar-actions{ margin-left:0; margin-right:auto; } }
