/* ============================================================================
   MGIOT Dashboard — LTR mirror (Phase 8 polish)
   ----------------------------------------------------------------------------
   The legacy style.css + mgiot-pro.css hardcode the sidebar to the inline-end
   (right) with `!important`. That is correct for Arabic (the default), but
   when the user toggles to English the sidebar never flips to the left.
   This sheet activates ONLY under `html[dir="ltr"]` and rewrites the few
   absolute-direction rules that fight LTR. It is intentionally short.

   Loaded last so it can break the `!important` chain.
   ============================================================================ */

html[dir="ltr"] body {
  font-family: 'Inter', 'Segoe UI', -apple-system, system-ui, Arial, sans-serif;
  direction: ltr !important;
  text-align: left !important;
}

/* ── Sidebar: pin to the left in LTR ─────────────────────────────────────── */
html[dir="ltr"] .app-page.active > .sidebar,
html[dir="ltr"] .sidebar {
  right: auto !important;
  left: 0 !important;
  border-left: 0 !important;
  border-right: 1px solid var(--mg-border, #E2E8F0) !important;
}

html[dir="ltr"] .app-page.active > .main,
html[dir="ltr"] .main {
  margin-right: 0 !important;
  margin-left: var(--sidebar-width, 260px) !important;
}

html[dir="ltr"] .main-header {
  left: var(--sidebar-width, 260px);
  right: 0;
}

/* ── Sidebar contents: flip nav rows to natural LTR ──────────────────────── */
html[dir="ltr"] .sidebar .nav-item,
html[dir="ltr"] .sidebar .nav-section-hdr,
html[dir="ltr"] .sidebar .footer-brand {
  direction: ltr !important;
  text-align: left !important;
}
html[dir="ltr"] .sidebar .nav-top-item {
  direction: ltr !important;
  text-align: left !important;
  justify-content: flex-start !important;
}
html[dir="ltr"] .sidebar .nav-item.active:before { right: auto !important; left: 0 !important; }
html[dir="ltr"] .sidebar-footer { right: auto !important; left: 0 !important; border-right: 1px solid var(--mg-border, #E2E8F0) !important; border-left: 0 !important; }
html[dir="ltr"] .sidebar .nav-item,
html[dir="ltr"] .sidebar .nav-section-hdr {
  justify-content: flex-start !important;
}
html[dir="ltr"] .sidebar .nav-section.collapsed .section-arrow {
  transform: rotate(-90deg) !important;
}
html[dir="ltr"] .sidebar .nav-item-icon,
html[dir="ltr"] .sidebar .section-icon,
html[dir="ltr"] .sidebar .section-arrow {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
html[dir="ltr"] .sidebar .nav-text,
html[dir="ltr"] .sidebar .section-label {
  text-align: left !important;
}

/* ── Warehouse switcher in English (LTR) ─────────────────────────────────── */
html[dir="ltr"] .wh-switcher,
html[dir="ltr"] #whSwitcher {
  display: flex !important;
  flex-direction: row !important;
  direction: ltr !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
html[dir="ltr"] .wh-btn {
  direction: ltr !important;
  text-align: center !important;
}

/* ── General controls/content in LTR (override RTL defaults in pro/parity) ── */
html[dir="ltr"] input:not([dir="rtl"]),
html[dir="ltr"] select,
html[dir="ltr"] textarea:not([dir="rtl"]) {
  direction: ltr !important;
  text-align: left !important;
}
html[dir="ltr"] .main-header,
html[dir="ltr"] .mg-card,
html[dir="ltr"] .mg-card-head,
html[dir="ltr"] .mg-toolbar,
html[dir="ltr"] .toolbar,
html[dir="ltr"] .filter-bar,
html[dir="ltr"] .form-row,
html[dir="ltr"] .mg-form-row,
html[dir="ltr"] .modal-card,
html[dir="ltr"] .modal-actions,
html[dir="ltr"] .modal-footer,
html[dir="ltr"] .mg-table,
html[dir="ltr"] .mg-table th,
html[dir="ltr"] .mg-table td,
html[dir="ltr"] table th,
html[dir="ltr"] table td {
  direction: ltr !important;
  text-align: left !important;
}
html[dir="ltr"] .mg-search-icon { right: auto !important; left: 12px !important; }

/* ── Mobile: slide in from the left in LTR ───────────────────────────────── */
@media (max-width: 768px) {
  html[dir="ltr"] .app-page.active > .sidebar,
  html[dir="ltr"] .sidebar {
    transform: translateX(-105%) !important;
    box-shadow: 18px 0 45px rgba(15,23,42,.22) !important;
  }
  html[dir="ltr"] body.sidebar-open .app-page.active > .sidebar,
  html[dir="ltr"] body.sidebar-open .sidebar {
    transform: translateX(0) !important;
  }
  html[dir="ltr"] .app-page.active > .main,
  html[dir="ltr"] .main {
    margin-left: 0 !important;
  }
}

/* ── Tables: header rounding mirrors in LTR ──────────────────────────────── */
html[dir="ltr"] .card thead th:first-child {
  border-start-start-radius: var(--radius, 8px);
  border-start-end-radius: 0;
}
html[dir="ltr"] .card thead th:last-child {
  border-start-end-radius: var(--radius, 8px);
  border-start-start-radius: 0;
}

/* ── Inputs with currency / numeric content stay LTR-friendly ────────────── */
html[dir="ltr"] input[type="email"],
html[dir="ltr"] input[type="tel"],
html[dir="ltr"] input[type="number"] {
  text-align: left;
}