/* Right-to-left layout for Arabic (loaded on every page, rules are scoped).
   Only physical left/right properties are mirrored here: flex/grid ordering,
   inline text flow and form controls already follow the <html dir> attribute. */
html[dir="rtl"] body{
  font-family:"Segoe UI",Tahoma,"Noto Sans Arabic","Noto Kufi Arabic",Arial,sans-serif;
}
/* Arabic is a connected script: letter-spacing breaks the glyph joining. */
html[dir="rtl"] *{letter-spacing:normal!important}

/* ---------------------------- public site ---------------------------- */
html[dir="rtl"] .announce a{margin-left:0;margin-right:8px}
html[dir="rtl"] .main-nav{margin-left:0;margin-right:auto}
html[dir="rtl"] .caret{margin-left:0;margin-right:3px}
html[dir="rtl"] .dropdown-menu{left:auto;right:-14px}
html[dir="rtl"] .hero-visual{inset:0 44% 0 0}
html[dir="rtl"] .hero::before{
  background:radial-gradient(circle at 22% 30%,rgba(127,166,80,.28),transparent 52%),
             linear-gradient(250deg,rgba(10,38,29,.97) 0%,rgba(12,42,32,.86) 52%,rgba(12,42,32,.35) 100%);
}
html[dir="rtl"] .stat-item{border-right:0;border-left:1px solid rgba(255,255,255,.14)}
html[dir="rtl"] .stat-item:first-child{padding-left:24px;padding-right:0}
html[dir="rtl"] .stat-item:last-child{border-left:0}
html[dir="rtl"] .category-media .grade-no{left:auto;right:16px}
html[dir="rtl"] .product-badge{left:auto;right:14px}
html[dir="rtl"] .product-sku{right:auto;left:14px}
html[dir="rtl"] .filter-chip small{margin-left:0;margin-right:5px}
html[dir="rtl"] .search-form{margin-left:0;margin-right:auto}
html[dir="rtl"] .strength-num small{margin-left:0;margin-right:6px}
html[dir="rtl"] .list-check li{padding-left:0;padding-right:30px}
html[dir="rtl"] .list-check li::before{left:auto;right:0}
html[dir="rtl"] .oem-section::after{right:auto;left:-160px}
html[dir="rtl"] .spec-table th,
html[dir="rtl"] .admin-table th{text-align:right}
html[dir="rtl"] .wa-float{right:auto;left:24px}
html[dir="rtl"] .wa-float-tip{right:auto;left:calc(100% + 12px);
  transform:translateY(-50%) translateX(-6px)}
html[dir="rtl"] .wa-float:hover .wa-float-tip,
html[dir="rtl"] .wa-float:focus-visible .wa-float-tip{transform:translateY(-50%) translateX(0)}
html[dir="rtl"] .toast{right:auto;left:24px}
html[dir="rtl"] .hp{left:auto!important;right:-9999px!important}
html[dir="rtl"] .lang-menu{right:auto;left:0}
html[dir="rtl"] .lang-menu a small{direction:ltr;text-align:right}
html[dir="rtl"] .lang-current{direction:rtl}
/* Latin-script data stays LTR even inside an Arabic page. */
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="url"],
html[dir="rtl"] a[href^="mailto:"],
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] .product-sku,
html[dir="rtl"] .contact-value{direction:ltr;unicode-bidi:isolate;display:inline-block;text-align:left}

/* ---------------------------- back office ---------------------------- */
html[dir="rtl"] .sidebar{inset:0 0 0 auto}
html[dir="rtl"] .main{margin-left:0;margin-right:var(--sidebar)}
html[dir="rtl"] .nav-item .count{margin-left:0;margin-right:auto}
html[dir="rtl"] .topbar-right{margin-left:0;margin-right:auto}
html[dir="rtl"] .steps li:not(:last-child):before{left:auto;right:13px}
html[dir="rtl"] .note-box{border-left:0;border-right:3px solid var(--green)}
html[dir="rtl"] .export-menu .export-caret{margin-left:0;margin-right:1px}
html[dir="rtl"] .export-pop{right:auto;left:0}
html[dir="rtl"] .login-lang{right:auto;left:22px}
html[dir="rtl"] .lang-tabs-note{margin-left:0;margin-right:auto}
html[dir="rtl"] .manual-list{padding-left:0;padding-right:20px}
html[dir="rtl"] .tr-table th,
html[dir="rtl"] .admin-table th,
html[dir="rtl"] .data-table th{text-align:right}
html[dir="rtl"] .tr-src,
html[dir="rtl"] code,
html[dir="rtl"] .tr-table code{direction:ltr;text-align:left;unicode-bidi:isolate}
html[dir="rtl"] .tr-table input,
html[dir="rtl"] .tr-table textarea{direction:rtl;text-align:right}
html[dir="rtl"] .table td:first-child,
html[dir="rtl"] .table th:first-child{text-align:right}
html[dir="rtl"] .brand-img{object-position:right center}
html[dir="rtl"] .logo-preview{border-right:none;border-left:1px solid var(--line)}

@media(max-width:900px){
  html[dir="rtl"] .main{margin-right:0}
  html[dir="rtl"] .sidebar{transform:translateX(100%)}
  html[dir="rtl"] .sidebar.open{transform:none}
}
@media(max-width:600px){
  html[dir="rtl"] .wa-float{right:auto;left:16px}
  html[dir="rtl"] .search-form{margin-right:0}
  html[dir="rtl"] .main-nav{padding:12px 24px 20px}
}