/**
 * Tool Fixt - Comprehensive RTL (Right-to-Left) Stylesheet
 * Automatically applied when Arabic (ar), Urdu (ur), Persian/Farsi (fa), or Hebrew (he) is selected.
 */

html[dir="rtl"],
body[dir="rtl"],
.rtl-active {
  direction: rtl !important;
  text-align: right !important;
}

html[dir="rtl"] body {
  font-family: 'Cairo', 'Noto Sans Arabic', 'Noto Nastaliq Urdu', 'Segoe UI', Tahoma, Arial, sans-serif;
}

html[dir="rtl"][lang="ur"] body {
  font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', Tahoma, sans-serif;
}

html[dir="rtl"][lang="he"] body {
  font-family: 'Noto Sans Hebrew', 'Arial Hebrew', 'Segoe UI', Tahoma, sans-serif;
}

/* Flipped Chevron & Arrow Icons */
html[dir="rtl"] .nav-chevron,
html[dir="rtl"] .user-avatar-chevron,
html[dir="rtl"] .lang-chevron,
html[dir="rtl"] .section-ref-link svg,
html[dir="rtl"] .breadcrumb-separator,
html[dir="rtl"] .tool-card-arrow,
html[dir="rtl"] .btn-arrow-icon {
  transform: scaleX(-1);
}

/* Header & Navigation Mirroring */
html[dir="rtl"] .header-actions {
  flex-direction: row-reverse;
}

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

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

/* Language Dropdown Menu Positioning in RTL */
html[dir="rtl"] .lang-dropdown-menu {
  left: 0;
  right: auto;
  text-align: right;
}

html[dir="rtl"] #userDropdownMenu {
  left: 0;
  right: auto;
  text-align: right;
}

/* Mobile Navigation Drawer in RTL */
html[dir="rtl"] .mobile-nav-drawer {
  right: auto;
  left: 0;
  border-left: none;
  border-right: 1px solid var(--border-color);
  transform: translateX(-100%);
}

html[dir="rtl"] .mobile-nav-drawer.active,
html[dir="rtl"] .mobile-nav-drawer.open {
  transform: translateX(0);
}

html[dir="rtl"] .mobile-drawer-close-btn {
  margin-left: 0;
  margin-right: auto;
}



/* Search Input Icon Positioning */
html[dir="rtl"] .header-search-box svg,
html[dir="rtl"] .hero-search-bar svg,
html[dir="rtl"] .mobile-drawer-body svg,
html[dir="rtl"] .lang-search-wrap svg {
  left: auto !important;
  right: 0.85rem !important;
}

html[dir="rtl"] .hero-search-input,
html[dir="rtl"] .global-search-input,
html[dir="rtl"] .lang-dropdown-search {
  padding-left: 1rem !important;
  padding-right: 2.5rem !important;
  text-align: right !important;
}

/* Tool Cards & Grids */
html[dir="rtl"] .tool-card,
html[dir="rtl"] .category-card,
html[dir="rtl"] .feature-card,
html[dir="rtl"] .blog-card {
  text-align: right;
}

html[dir="rtl"] .tool-card-header,
html[dir="rtl"] .tool-card-footer {
  flex-direction: row-reverse;
}

html[dir="rtl"] .tool-badge,
html[dir="rtl"] .category-badge {
  margin-left: 0.5rem;
  margin-right: 0;
}

/* Form Controls & Inputs */
html[dir="rtl"] .form-label,
html[dir="rtl"] .control-label {
  text-align: right;
}

html[dir="rtl"] .form-control,
html[dir="rtl"] .control-input,
html[dir="rtl"] .control-textarea,
html[dir="rtl"] .control-select {
  text-align: right;
  direction: rtl;
}

/* Buttons with Icons */
html[dir="rtl"] .btn-primary svg,
html[dir="rtl"] .btn-secondary svg,
html[dir="rtl"] .action-btn svg {
  margin-right: 0;
  margin-left: 0.4rem;
}

/* Floating AI Assistant Widget */
html[dir="rtl"] .floating-ai-launcher {
  left: 1.5rem;
  right: auto;
}

html[dir="rtl"] .floating-ai-panel {
  left: 1.5rem;
  right: auto;
  text-align: right;
}

html[dir="rtl"] .floating-ai-msg.bot {
  flex-direction: row;
}

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

/* Workspace Layout */
html[dir="rtl"] .workspace-toolbar-top {
  flex-direction: row-reverse;
}

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

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

html[dir="rtl"] .breadcrumb-nav {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

html[dir="rtl"] .breadcrumb-separator {
  display: inline-block;
  transform: rotate(180deg);
}

html[dir="rtl"] .color-swatches-grid {
  justify-content: flex-start;
}

/* AI Banner Checklist */
html[dir="rtl"] .ai-checklist-item {
  flex-direction: row;
}

html[dir="rtl"] .ai-check-icon {
  margin-left: 0.65rem;
  margin-right: 0;
}

/* Modals & Dialogs */
html[dir="rtl"] .modal-header {
  flex-direction: row-reverse;
}

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

/* Language selector item alignment */
html[dir="rtl"] .lang-item {
  text-align: right;
}

html[dir="rtl"] .lang-rtl-badge {
  display: inline-block;
  font-size: 0.65rem;
  padding: 1px 4px;
  background: rgba(79, 70, 229, 0.2);
  color: #818cf8;
  border-radius: 4px;
  margin-right: 4px;
}
