/* RTL (Right-to-Left) Styles for Arabic Support */

html[dir="rtl"] {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] body {
  direction: rtl;
}

/* Sidebar RTL adjustments */
html[dir="rtl"] .sidebar {
  border-right: 1px solid var(--color-slate, #1E293B);
  border-left: none;
}

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

/* Navigation items */
html[dir="rtl"] .nav-item {
  text-align: right;
  padding-right: 1rem;
  padding-left: 0;
}

html[dir="rtl"] .nav-item.active {
  border-right: 4px solid var(--color-teal, #0D9488);
  border-left: none;
}

/* Flex direction reversal */
html[dir="rtl"] .flex {
  direction: rtl;
}

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

html[dir="rtl"] .flex.space-x-6 {
  gap: 1.5rem;
}

/* Margin and padding adjustments */
html[dir="rtl"] .ml-auto {
  margin-left: 0;
  margin-right: auto;
}

html[dir="rtl"] .ml-2 {
  margin-left: 0;
  margin-right: 0.5rem;
}

html[dir="rtl"] .mr-2 {
  margin-right: 0;
  margin-left: 0.5rem;
}

html[dir="rtl"] .pl-4 {
  padding-left: 0;
  padding-right: 1rem;
}

html[dir="rtl"] .pr-4 {
  padding-right: 0;
  padding-left: 1rem;
}

html[dir="rtl"] .px-4 {
  padding-right: 1rem;
  padding-left: 1rem;
}

/* Border adjustments */
html[dir="rtl"] .border-l {
  border-left: none;
  border-right: 1px solid currentColor;
}

html[dir="rtl"] .border-r {
  border-right: none;
  border-left: 1px solid currentColor;
}

/* Text alignment */
html[dir="rtl"] .text-left {
  text-align: right;
}

html[dir="rtl"] .text-right {
  text-align: left;
}

/* Float reversal */
html[dir="rtl"] .float-left {
  float: right;
}

html[dir="rtl"] .float-right {
  float: left;
}

/* Position adjustments */
html[dir="rtl"] .left-0 {
  left: auto;
  right: 0;
}

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

/* Header and navigation bar */
html[dir="rtl"] header {
  direction: rtl;
}

html[dir="rtl"] nav {
  direction: rtl;
}

/* Dropdown and menu adjustments */
html[dir="rtl"] .absolute.right-0 {
  right: auto;
  left: 0;
}

html[dir="rtl"] .absolute.left-0 {
  left: auto;
  right: 0;
}

/* Transform scale adjustments */
html[dir="rtl"] .scale-x-100 {
  transform: scaleX(-1);
}

/* Space between adjustments */
html[dir="rtl"] .space-x-2 > * + * {
  margin-left: 0;
  margin-right: 0.5rem;
}

html[dir="rtl"] .space-x-4 > * + * {
  margin-left: 0;
  margin-right: 1rem;
}

html[dir="rtl"] .space-x-6 > * + * {
  margin-left: 0;
  margin-right: 1.5rem;
}

html[dir="rtl"] .space-x-8 > * + * {
  margin-left: 0;
  margin-right: 2rem;
}

/* Input and form elements */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
  text-align: right;
  direction: rtl;
}

/* Badge and labels */
html[dir="rtl"] .badge {
  direction: rtl;
}

/* Table adjustments */
html[dir="rtl"] table {
  direction: rtl;
  text-align: right;
}

/* Modal and overlay */
html[dir="rtl"] .modal {
  direction: rtl;
}

/* Notification panel */
html[dir="rtl"] .notification {
  direction: rtl;
  text-align: right;
}

/* Language switcher link styles */
html[dir="rtl"] .lang-switcher {
  direction: rtl;
}

/* Ensure proper RTL body class */
html[dir="rtl"].rtl-body,
html[dir="rtl"] body.rtl-body {
  direction: rtl;
  text-align: right;
}

/* Grid and layout */
html[dir="rtl"] .grid {
  direction: rtl;
}

/* Overlay and containers */
html[dir="rtl"] .container {
  direction: rtl;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  html[dir="rtl"] .sidebar {
    position: fixed;
    right: 0;
    left: auto;
  }

  html[dir="rtl"] .flex-1 {
    direction: rtl;
  }
}