/* Add this to your style.css or create rtl.css */
[dir="rtl"] body {
    text-align: right;
    direction: rtl;
  }

  [dir="rtl"] .sidebar {
    right: 0;
    left: auto;
  }

  [dir="rtl"] .right-content {
    margin-right: 350px;
    margin-left: 0;
  }

  [dir="rtl"] .header .title-control {
    flex-direction: row-reverse;
  }

  [dir="rtl"] .header .head-control {
    flex-direction: row-reverse;
  }

  [dir="rtl"] .dropdown-menu {
    text-align: right;
  }
  /* Override LTR styles for RTL */
.dropright .dropdown-menu {
  left: 0 !important;
  right: auto !important;
  text-align: right;
}

.dropdown-item {
  flex-direction: row-reverse;
}

.dropdown-item img {
  margin-left: 8px;
  margin-right: 0;
}

  [dir="rtl"] .table th,
  [dir="rtl"] .table td {
    text-align: right;
  }

  [dir="rtl"] .form-control,
  [dir="rtl"] .custom-select {
    text-align: right;
  }

  [dir="rtl"] .sidebar .side-menu a .menu-icon {
    margin-right: 0;
    margin-left: 12px;
  }

  [dir="rtl"] .sidebar .side-menu .active a:after {
    right: auto;
    left: 7px;
  }