/* AqaryPro Skin — RTL direction fixes
 * Bootstrap 4 uses physical properties (left/right) rather than logical ones.
 * This file patches direction-sensitive components when dir="rtl".
 * Loaded only in css-files.php (the Arabic/RTL loader), after aqary-skin.css.
 */

@media screen {

/* ── Alert accent border ──────────────────────────────────── */
/* In RTL, the leading edge is the right side */
[dir="rtl"] .alert-success,
[dir="rtl"] .alert-warning,
[dir="rtl"] .alert-danger,
[dir="rtl"] .alert-info {
  border-left: none !important;
}
[dir="rtl"] .alert-success { border-right: 3px solid #10B981 !important; }
[dir="rtl"] .alert-warning { border-right: 3px solid #F59E0B !important; }
[dir="rtl"] .alert-danger  { border-right: 3px solid #EF4444 !important; }
[dir="rtl"] .alert-info    { border-right: 3px solid #1E9FF2 !important; }

/* ── Select2 caret (arrow) ───────────────────────────────── */
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow {
  left: 8px !important;
  right: auto !important;
}
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding-right: 0 !important;
  padding-left: 20px !important;
}

/* ── DataTables filter/length float swap ─────────────────── */
[dir="rtl"] .dataTables_wrapper .dataTables_filter { float: left !important; text-align: left !important; }
[dir="rtl"] .dataTables_wrapper .dataTables_length { float: right !important; }
[dir="rtl"] .dataTables_wrapper .dataTables_info   { float: right !important; }

/* ── Dropdown menu text alignment ───────────────────────── */
[dir="rtl"] .dropdown-menu { text-align: right !important; }

/* ── Breadcrumb separator float ──────────────────────────── */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
  float: right !important;
  padding-right: 0 !important;
  padding-left: .5rem !important;
}

/* ── Modal close button ──────────────────────────────────── */
[dir="rtl"] .modal-header .close {
  margin: 0 !important;
}

/* ── DataTables export button margin ────────────────────── */
[dir="rtl"] .dt-buttons .dt-button {
  margin-right: 0 !important;
  margin-left: 4px !important;
}

/* ── Form-group row label padding in RTL ────────────────── */
[dir="rtl"] .form-group [class*="col-"] label { padding-right: 0; }

/* ── Sidebar — RTL mirror ──────────────────────────────── */

/* Panel border flips from right to left edge */
[dir="rtl"] .main-menu,
[dir="rtl"] .main-menu.menu-light {
  border-right: none !important;
  border-left: 1px solid var(--aq-surface-border) !important;
}

/* Submenu indent flips — leading edge in RTL is the right */
[dir="rtl"] .main-menu .navigation li ul.menu-content > li > a,
[dir="rtl"] .main-menu .navigation li ul.menu-content li > a.menu-item {
  padding: 8px 46px 8px 14px !important;
}
[dir="rtl"] .main-menu .navigation li ul.menu-content > li > a > i,
[dir="rtl"] .main-menu .navigation li ul.menu-content li > a.menu-item > i {
  left: auto !important;
  right: 24px !important;
}

/* Nested Reports items — flip extra indent */
[dir="rtl"] .main-menu .navigation li ul.menu-content li > ul li > a.menu-item {
  padding: 8px 60px 8px 14px !important;
}
[dir="rtl"] .main-menu .navigation li ul.menu-content li > ul li > a.menu-item > i {
  right: 36px !important;
  left: auto !important;
}

/* Accent bar flips to right edge */
[dir="rtl"] .main-menu .navigation > li.nav-item:not(.open) > a.active {
  box-shadow: inset -3px 0 0 var(--aq-brand-500) !important;
}
[dir="rtl"] .main-menu .navigation li ul.menu-content a.menu-item.active {
  box-shadow: inset -3px 0 0 var(--aq-brand-500) !important;
}
[dir="rtl"] .main-menu .navigation > li.nav-item.open:not(:has(a.menu-item.active)) > a.active {
  box-shadow: inset -3px 0 0 var(--aq-brand-500) !important;
}
[dir="rtl"] body.menu-collapsed .main-menu .navigation > li.nav-item:not(.open) > a.active {
  box-shadow: inset -3px 0 0 var(--aq-brand-500) !important;
}

/* Collapsed fly-out — dot position flipped */
[dir="rtl"] body.menu-collapsed .main-menu .navigation li ul.menu-content > li > a,
[dir="rtl"] body.menu-collapsed .main-menu .navigation li ul.menu-content li > a.menu-item {
  padding: 8px 38px 8px 16px !important;
}
[dir="rtl"] body.menu-collapsed .main-menu .navigation li ul.menu-content > li > a > i,
[dir="rtl"] body.menu-collapsed .main-menu .navigation li ul.menu-content li > a.menu-item > i {
  right: 16px !important;
  left: auto !important;
}

} /* end @media screen */