/* 
 * WeWeb Complete RTL CSS
 * Filename: weweb-rtl.css
 * Description: Comprehensive RTL support for all WeWeb elements
 * Usage: Apply data-user-language="ar" or data-user-language="he" to trigger RTL styling
 * Author: Deciza
 * Version: 1.0
 */

/* =================================================== */
/* MANUAL ALIGNMENT CLASSES FOR NUMBERS */
/* Use these classes in WeWeb to control number alignment */
/* =================================================== */

/* For numbers that should be RIGHT in LTR, LEFT in RTL */
.number-align-end {
    text-align: right;
}

[data-user-language="ar"] .number-align-end,
[data-user-language="he"] .number-align-end,
section[data-user-language="ar"] .number-align-end,
section[data-user-language="he"] .number-align-end,
div[data-user-language="ar"] .number-align-end,
div[data-user-language="he"] .number-align-end {
    text-align: left !important;
    direction: ltr !important;
}

/* For numbers that should be LEFT in LTR, RIGHT in RTL */
.number-align-start {
    text-align: left;
}

[data-user-language="ar"] .number-align-start,
[data-user-language="he"] .number-align-start,
section[data-user-language="ar"] .number-align-start,
section[data-user-language="he"] .number-align-start,
div[data-user-language="ar"] .number-align-start,
div[data-user-language="he"] .number-align-start {
    text-align: right !important;
    direction: ltr !important;
}

/* For numbers that should be CENTERED (no flip needed) */
.number-align-center {
    text-align: center;
}

/* =================================================== */
/* BASE RTL SETUP - Apply to all container elements */
/* =================================================== */

section[data-user-language="ar"],
section[data-user-language="he"],
.container[data-user-language="ar"],
.container[data-user-language="he"],
div[data-user-language="ar"],
div[data-user-language="he"] {
    direction: rtl;
    text-align: start;
}

/* Global RTL inheritance for all child elements */
section[data-user-language="ar"] *,
section[data-user-language="he"] *,
.container[data-user-language="ar"] *,
.container[data-user-language="he"] *,
div[data-user-language="ar"] *,
div[data-user-language="he"] * {
    direction: inherit;
}

/* =================================================== */
/* FLEX LAYOUTS */
/* =================================================== */

/* Horizontal Flex - Reverse row direction */
.h-flex[data-user-language="ar"],
.h-flex[data-user-language="he"],
.flex-horizontal[data-user-language="ar"],
.flex-horizontal[data-user-language="he"],
[data-user-language="ar"] .h-flex,
[data-user-language="he"] .h-flex,
[data-user-language="ar"] .flex-horizontal,
[data-user-language="he"] .flex-horizontal {
    direction: rtl;
    flex-direction: row-reverse;
}

/* Vertical Flex - Keep normal unless specific reversal needed */
.v-flex[data-user-language="ar"],
.v-flex[data-user-language="he"],
.flex-vertical[data-user-language="ar"],
.flex-vertical[data-user-language="he"],
[data-user-language="ar"] .v-flex,
[data-user-language="he"] .v-flex,
[data-user-language="ar"] .flex-vertical,
[data-user-language="he"] .flex-vertical {
    direction: rtl;
    flex-direction: column;
}

/* =================================================== */
/* GRID LAYOUTS */
/* =================================================== */

.grid[data-user-language="ar"],
.grid[data-user-language="he"],
.grid-container[data-user-language="ar"],
.grid-container[data-user-language="he"],
[data-user-language="ar"] .grid,
[data-user-language="he"] .grid,
[data-user-language="ar"] .grid-container,
[data-user-language="he"] .grid-container {
    direction: rtl;
}

/* Grid items text alignment */
.grid[data-user-language="ar"] .grid-item,
.grid[data-user-language="he"] .grid-item,
[data-user-language="ar"] .grid .grid-item,
[data-user-language="he"] .grid .grid-item {
    text-align: start;
}

/* =================================================== */
/* NAVIGATION ELEMENTS */
/* =================================================== */

/* Side Menu */
.sidemenu[data-user-language="ar"],
.sidemenu[data-user-language="he"],
.sidebar[data-user-language="ar"],
.sidebar[data-user-language="he"],
[data-user-language="ar"] .sidemenu,
[data-user-language="he"] .sidemenu,
[data-user-language="ar"] .sidebar,
[data-user-language="he"] .sidebar {
    direction: rtl;
    /* Flip from left to right positioning */
    left: auto;
    right: 0;
}

/* Top Navigation */
.top-nav[data-user-language="ar"],
.top-nav[data-user-language="he"],
.navbar-top[data-user-language="ar"],
.navbar-top[data-user-language="he"],
[data-user-language="ar"] .top-nav,
[data-user-language="he"] .top-nav,
[data-user-language="ar"] .navbar-top,
[data-user-language="he"] .navbar-top {
    direction: rtl;
}

.top-nav[data-user-language="ar"] ul,
.top-nav[data-user-language="he"] ul,
[data-user-language="ar"] .top-nav ul,
[data-user-language="he"] .top-nav ul {
    flex-direction: row-reverse;
}

/* Bottom Navigation */
.bottom-nav[data-user-language="ar"],
.bottom-nav[data-user-language="he"],
.navbar-bottom[data-user-language="ar"],
.navbar-bottom[data-user-language="he"],
[data-user-language="ar"] .bottom-nav,
[data-user-language="he"] .bottom-nav,
[data-user-language="ar"] .navbar-bottom,
[data-user-language="he"] .navbar-bottom {
    direction: rtl;
}

.bottom-nav[data-user-language="ar"] ul,
.bottom-nav[data-user-language="he"] ul,
[data-user-language="ar"] .bottom-nav ul,
[data-user-language="he"] .bottom-nav ul {
    flex-direction: row-reverse;
}

/* Navigation Menu */
.navigation-menu[data-user-language="ar"],
.navigation-menu[data-user-language="he"],
.nav-menu[data-user-language="ar"],
.nav-menu[data-user-language="he"],
nav[data-user-language="ar"],
nav[data-user-language="he"],
[data-user-language="ar"] .navigation-menu,
[data-user-language="he"] .navigation-menu,
[data-user-language="ar"] .nav-menu,
[data-user-language="he"] .nav-menu,
[data-user-language="ar"] nav,
[data-user-language="he"] nav {
    direction: rtl;
}

/* =================================================== */
/* LIST ELEMENTS */
/* =================================================== */

.list[data-user-language="ar"],
.list[data-user-language="he"],
ul[data-user-language="ar"],
ol[data-user-language="he"],
ul[data-user-language="ar"],
ol[data-user-language="he"],
[data-user-language="ar"] .list,
[data-user-language="he"] .list,
[data-user-language="ar"] ul,
[data-user-language="he"] ul,
[data-user-language="ar"] ol,
[data-user-language="he"] ol {
    direction: rtl;
    text-align: start;
}

/* List items */
.list[data-user-language="ar"] li,
.list[data-user-language="he"] li,
[data-user-language="ar"] .list li,
[data-user-language="he"] .list li,
[data-user-language="ar"] ul li,
[data-user-language="he"] ul li,
[data-user-language="ar"] ol li,
[data-user-language="he"] ol li {
    text-align: start;
}

/* =================================================== */
/* TABLE AND DATA ELEMENTS */
/* =================================================== */

/* Tables */
table[data-user-language="ar"],
table[data-user-language="he"],
.table[data-user-language="ar"],
.table[data-user-language="he"],
[data-user-language="ar"] table,
[data-user-language="he"] table,
[data-user-language="ar"] .table,
[data-user-language="he"] .table {
    direction: rtl;
}

/* Table headers and cells - text columns */
table[data-user-language="ar"] th.text-column,
table[data-user-language="he"] th.text-column,
table[data-user-language="ar"] td.text-column,
table[data-user-language="he"] td.text-column,
[data-user-language="ar"] table th.text-column,
[data-user-language="he"] table th.text-column,
[data-user-language="ar"] table td.text-column,
[data-user-language="he"] table td.text-column {
    text-align: start;
}

/* Table headers and cells - number columns */
table[data-user-language="ar"] th.number-column,
table[data-user-language="he"] th.number-column,
table[data-user-language="ar"] td.number-column,
table[data-user-language="he"] td.number-column,
[data-user-language="ar"] table th.number-column,
[data-user-language="he"] table th.number-column,
[data-user-language="ar"] table td.number-column,
[data-user-language="he"] table td.number-column {
    direction: ltr;
}

/* Datagrid */
.datagrid[data-user-language="ar"],
.datagrid[data-user-language="he"],
.data-grid[data-user-language="ar"],
.data-grid[data-user-language="he"],
.grid-data[data-user-language="ar"],
.grid-data[data-user-language="he"],
[data-user-language="ar"] .datagrid,
[data-user-language="he"] .datagrid,
[data-user-language="ar"] .data-grid,
[data-user-language="he"] .data-grid,
[data-user-language="ar"] .grid-data,
[data-user-language="he"] .grid-data {
    direction: rtl;
}

/* Datagrid text vs number columns */
.datagrid[data-user-language="ar"] .text-column,
.datagrid[data-user-language="he"] .text-column,
[data-user-language="ar"] .datagrid .text-column,
[data-user-language="he"] .datagrid .text-column {
    text-align: start;
}

.datagrid[data-user-language="ar"] .number-column,
.datagrid[data-user-language="he"] .number-column,
[data-user-language="ar"] .datagrid .number-column,
[data-user-language="he"] .datagrid .number-column {
    direction: ltr;
}

/* =================================================== */
/* UI COMPONENTS */
/* =================================================== */

/* Tabs */
.tabs[data-user-language="ar"],
.tabs[data-user-language="he"],
.tab-container[data-user-language="ar"],
.tab-container[data-user-language="he"],
[data-user-language="ar"] .tabs,
[data-user-language="he"] .tabs,
[data-user-language="ar"] .tab-container,
[data-user-language="he"] .tab-container {
    direction: rtl;
}

.tabs[data-user-language="ar"] .tab-list,
.tabs[data-user-language="he"] .tab-list,
[data-user-language="ar"] .tabs .tab-list,
[data-user-language="he"] .tabs .tab-list {
    flex-direction: row-reverse;
}

/* Accordion */
.accordion[data-user-language="ar"],
.accordion[data-user-language="he"],
.accordeon[data-user-language="ar"],
.accordeon[data-user-language="he"],
[data-user-language="ar"] .accordion,
[data-user-language="he"] .accordion,
[data-user-language="ar"] .accordeon,
[data-user-language="he"] .accordeon {
    direction: rtl;
}

.accordion[data-user-language="ar"] .accordion-header,
.accordion[data-user-language="he"] .accordion-header,
[data-user-language="ar"] .accordion .accordion-header,
[data-user-language="he"] .accordion .accordion-header {
    text-align: start;
}

/* Kanban */
.kanban[data-user-language="ar"],
.kanban[data-user-language="he"],
.kanban-board[data-user-language="ar"],
.kanban-board[data-user-language="he"],
[data-user-language="ar"] .kanban,
[data-user-language="he"] .kanban,
[data-user-language="ar"] .kanban-board,
[data-user-language="he"] .kanban-board {
    direction: rtl;
}

.kanban[data-user-language="ar"] .kanban-column,
.kanban[data-user-language="he"] .kanban-column,
[data-user-language="ar"] .kanban .kanban-column,
[data-user-language="he"] .kanban .kanban-column {
    text-align: start;
}

/* Columns Layout */
.columns[data-user-language="ar"],
.columns[data-user-language="he"],
.column-layout[data-user-language="ar"],
.column-layout[data-user-language="he"],
[data-user-language="ar"] .columns,
[data-user-language="he"] .columns,
[data-user-language="ar"] .column-layout,
[data-user-language="he"] .column-layout {
    direction: rtl;
    flex-direction: row-reverse;
}

/* =================================================== */
/* NAVIGATION AND PAGINATION */
/* =================================================== */

/* Breadcrumbs */
.breadcrumbs[data-user-language="ar"],
.breadcrumbs[data-user-language="he"],
.breadcrumb[data-user-language="ar"],
.breadcrumb[data-user-language="he"],
[data-user-language="ar"] .breadcrumbs,
[data-user-language="he"] .breadcrumbs,
[data-user-language="ar"] .breadcrumb,
[data-user-language="he"] .breadcrumb {
    direction: rtl;
    flex-direction: row-reverse;
}

.breadcrumbs[data-user-language="ar"] ol,
.breadcrumbs[data-user-language="he"] ol,
[data-user-language="ar"] .breadcrumbs ol,
[data-user-language="he"] .breadcrumbs ol {
    flex-direction: row-reverse;
}

/* Timeline */
.timeline[data-user-language="ar"],
.timeline[data-user-language="he"],
[data-user-language="ar"] .timeline,
[data-user-language="he"] .timeline {
    direction: rtl;
}

.timeline[data-user-language="ar"] .timeline-item,
.timeline[data-user-language="he"] .timeline-item,
[data-user-language="ar"] .timeline .timeline-item,
[data-user-language="he"] .timeline .timeline-item {
    text-align: start;
}

/* For horizontal timelines */
.timeline[data-user-language="ar"].timeline-horizontal,
.timeline[data-user-language="he"].timeline-horizontal,
[data-user-language="ar"] .timeline.timeline-horizontal,
[data-user-language="he"] .timeline.timeline-horizontal {
    flex-direction: row-reverse;
}

/* Calendar */
.calendar[data-user-language="ar"],
.calendar[data-user-language="he"],
[data-user-language="ar"] .calendar,
[data-user-language="he"] .calendar {
    direction: rtl;
}

.calendar[data-user-language="ar"] .calendar-header,
.calendar[data-user-language="he"] .calendar-header,
[data-user-language="ar"] .calendar .calendar-header,
[data-user-language="he"] .calendar .calendar-header {
    flex-direction: row-reverse;
}

.calendar[data-user-language="ar"] .calendar-grid,
.calendar[data-user-language="he"] .calendar-grid,
[data-user-language="ar"] .calendar .calendar-grid,
[data-user-language="he"] .calendar .calendar-grid {
    direction: rtl;
}

/* Paginator */
.paginator[data-user-language="ar"],
.paginator[data-user-language="he"],
.pagination[data-user-language="ar"],
.pagination[data-user-language="he"],
[data-user-language="ar"] .paginator,
[data-user-language="he"] .paginator,
[data-user-language="ar"] .pagination,
[data-user-language="he"] .pagination {
    direction: rtl;
    flex-direction: row-reverse;
}

/* Reverse prev/next logic for RTL */
.paginator[data-user-language="ar"] .prev,
.paginator[data-user-language="he"] .prev,
[data-user-language="ar"] .paginator .prev,
[data-user-language="he"] .paginator .prev {
    order: 2;
}

.paginator[data-user-language="ar"] .next,
.paginator[data-user-language="he"] .next,
[data-user-language="ar"] .paginator .next,
[data-user-language="he"] .paginator .next {
    order: 0;
}

/* =================================================== */
/* TEXT AND CONTENT ELEMENTS */
/* =================================================== */

/* Heading Elements */
.heading[data-user-language="ar"],
.heading[data-user-language="he"],
[data-user-language="ar"] .heading,
[data-user-language="he"] .heading,
[data-user-language="ar"] h1,
[data-user-language="ar"] h2,
[data-user-language="ar"] h3,
[data-user-language="ar"] h4,
[data-user-language="ar"] h5,
[data-user-language="ar"] h6,
[data-user-language="he"] h1,
[data-user-language="he"] h2,
[data-user-language="he"] h3,
[data-user-language="he"] h4,
[data-user-language="he"] h5,
[data-user-language="he"] h6 {
    direction: rtl;
    text-align: start;
}

/* Text Elements */
.text[data-user-language="ar"],
.text[data-user-language="he"],
[data-user-language="ar"] .text,
[data-user-language="he"] .text,
[data-user-language="ar"] p,
[data-user-language="ar"] span,
[data-user-language="ar"] div,
[data-user-language="ar"] label,
[data-user-language="he"] p,
[data-user-language="he"] span,
[data-user-language="he"] div,
[data-user-language="he"] label {
    direction: rtl;
    text-align: start;
}

/* Number Display Elements */
.number[data-user-language="ar"],
.number[data-user-language="he"],
[data-user-language="ar"] .number,
[data-user-language="he"] .number {
    direction: ltr; /* Keep numbers LTR for readability */
}

/* Button Elements */
.button[data-user-language="ar"],
.button[data-user-language="he"],
button[data-user-language="ar"],
button[data-user-language="he"],
[data-user-language="ar"] .button,
[data-user-language="he"] .button,
[data-user-language="ar"] button,
[data-user-language="he"] button {
    direction: rtl;
}

/* Icon Elements */
.icon[data-user-language="ar"],
.icon[data-user-language="he"],
[data-user-language="ar"] .icon,
[data-user-language="he"] .icon {
    /* Icons typically don't need direction change unless they're directional */
    direction: inherit;
}

/* =================================================== */
/* FORM ELEMENTS */
/* =================================================== */

/* Form Container */
.form-container[data-user-language="ar"],
.form-container[data-user-language="he"],
.form[data-user-language="ar"],
.form[data-user-language="he"],
form[data-user-language="ar"],
form[data-user-language="he"],
[data-user-language="ar"] .form-container,
[data-user-language="he"] .form-container,
[data-user-language="ar"] .form,
[data-user-language="he"] .form,
[data-user-language="ar"] form,
[data-user-language="he"] form {
    direction: rtl;
}

/* Input Elements */
.input[data-user-language="ar"],
.input[data-user-language="he"],
input[data-user-language="ar"],
input[data-user-language="he"],
textarea[data-user-language="ar"],
textarea[data-user-language="he"],
[data-user-language="ar"] .input,
[data-user-language="he"] .input,
[data-user-language="ar"] input,
[data-user-language="he"] input,
[data-user-language="ar"] textarea,
[data-user-language="he"] textarea {
    direction: rtl;
    text-align: start;
}

/* Number inputs should maintain LTR for number entry */
input[type="number"][data-user-language="ar"],
input[type="number"][data-user-language="he"],
[data-user-language="ar"] input[type="number"],
[data-user-language="he"] input[type="number"] {
    direction: ltr;
}

/* Select and Multiselect */
.select[data-user-language="ar"],
.select[data-user-language="he"],
.multiselect[data-user-language="ar"],
.multiselect[data-user-language="he"],
select[data-user-language="ar"],
select[data-user-language="he"],
[data-user-language="ar"] .select,
[data-user-language="he"] .select,
[data-user-language="ar"] .multiselect,
[data-user-language="he"] .multiselect,
[data-user-language="ar"] select,
[data-user-language="he"] select {
    direction: rtl;
    text-align: start;
}

/* Select dropdown arrow positioning */
.select[data-user-language="ar"]::after,
.select[data-user-language="he"]::after,
[data-user-language="ar"] .select::after,
[data-user-language="he"] .select::after {
    left: 8px;
    right: auto;
}

/* Range Input */
.range-input[data-user-language="ar"],
.range-input[data-user-language="he"],
input[type="range"][data-user-language="ar"],
input[type="range"][data-user-language="he"],
[data-user-language="ar"] .range-input,
[data-user-language="he"] .range-input,
[data-user-language="ar"] input[type="range"],
[data-user-language="he"] input[type="range"] {
    direction: rtl;
}

/* Date and Time Pickers */
.date[data-user-language="ar"],
.date[data-user-language="he"],
.date-picker[data-user-language="ar"],
.date-picker[data-user-language="he"],
.datetime-picker[data-user-language="ar"],
.datetime-picker[data-user-language="he"],
.date-range[data-user-language="ar"],
.date-range[data-user-language="he"],
.time-picker[data-user-language="ar"],
.time-picker[data-user-language="he"],
input[type="date"][data-user-language="ar"],
input[type="date"][data-user-language="he"],
input[type="datetime-local"][data-user-language="ar"],
input[type="datetime-local"][data-user-language="he"],
input[type="time"][data-user-language="ar"],
input[type="time"][data-user-language="he"],
[data-user-language="ar"] .date,
[data-user-language="he"] .date,
[data-user-language="ar"] .date-picker,
[data-user-language="he"] .date-picker,
[data-user-language="ar"] .datetime-picker,
[data-user-language="he"] .datetime-picker,
[data-user-language="ar"] .date-range,
[data-user-language="he"] .date-range,
[data-user-language="ar"] .time-picker,
[data-user-language="he"] .time-picker,
[data-user-language="ar"] input[type="date"],
[data-user-language="he"] input[type="date"],
[data-user-language="ar"] input[type="datetime-local"],
[data-user-language="he"] input[type="datetime-local"],
[data-user-language="ar"] input[type="time"],
[data-user-language="he"] input[type="time"] {
    direction: rtl;
    text-align: start;
}

/* =================================================== */
/* SEARCH AND DROPDOWN ELEMENTS */
/* =================================================== */

/* Search Bar */
.search-bar[data-user-language="ar"],
.search-bar[data-user-language="he"],
.search[data-user-language="ar"],
.search[data-user-language="he"],
input[type="search"][data-user-language="ar"],
input[type="search"][data-user-language="he"],
[data-user-language="ar"] .search-bar,
[data-user-language="he"] .search-bar,
[data-user-language="ar"] .search,
[data-user-language="he"] .search,
[data-user-language="ar"] input[type="search"],
[data-user-language="he"] input[type="search"] {
    direction: rtl;
    text-align: start;
}

/* Search with Result Container */
.search-with-results[data-user-language="ar"],
.search-with-results[data-user-language="he"],
.search-container[data-user-language="ar"],
.search-container[data-user-language="he"],
[data-user-language="ar"] .search-with-results,
[data-user-language="he"] .search-with-results,
[data-user-language="ar"] .search-container,
[data-user-language="he"] .search-container {
    direction: rtl;
}

.search-with-results[data-user-language="ar"] .search-results,
.search-with-results[data-user-language="he"] .search-results,
[data-user-language="ar"] .search-with-results .search-results,
[data-user-language="he"] .search-with-results .search-results {
    text-align: start;
}

/* Dropdown Menu */
.dropdown[data-user-language="ar"],
.dropdown[data-user-language="he"],
.dropdown-menu[data-user-language="ar"],
.dropdown-menu[data-user-language="he"],
[data-user-language="ar"] .dropdown,
[data-user-language="he"] .dropdown,
[data-user-language="ar"] .dropdown-menu,
[data-user-language="he"] .dropdown-menu {
    direction: rtl;
}

.dropdown[data-user-language="ar"] .dropdown-content,
.dropdown[data-user-language="he"] .dropdown-content,
[data-user-language="ar"] .dropdown .dropdown-content,
[data-user-language="he"] .dropdown .dropdown-content {
    text-align: start;
    left: auto;
    right: 0;
}

/* =================================================== */
/* INTERACTIVE ELEMENTS */
/* =================================================== */

/* Slider */
.slider[data-user-language="ar"],
.slider[data-user-language="he"],
[data-user-language="ar"] .slider,
[data-user-language="he"] .slider {
    direction: rtl;
}

/* Progress Bar */
.progress-bar[data-user-language="ar"],
.progress-bar[data-user-language="he"],
.progress[data-user-language="ar"],
.progress[data-user-language="he"],
progress[data-user-language="ar"],
progress[data-user-language="he"],
[data-user-language="ar"] .progress-bar,
[data-user-language="he"] .progress-bar,
[data-user-language="ar"] .progress,
[data-user-language="he"] .progress,
[data-user-language="ar"] progress,
[data-user-language="he"] progress {
    direction: rtl;
}

/* Progress Circular */
.progress-circular[data-user-language="ar"],
.progress-circular[data-user-language="he"],
.progress-circle[data-user-language="ar"],
.progress-circle[data-user-language="he"],
[data-user-language="ar"] .progress-circular,
[data-user-language="he"] .progress-circular,
[data-user-language="ar"] .progress-circle,
[data-user-language="he"] .progress-circle {
    /* Circular progress typically doesn't need direction change */
    direction: inherit;
}

/* =================================================== */
/* MODAL AND OVERLAY ELEMENTS */
/* =================================================== */

/* Alert */
.alert[data-user-language="ar"],
.alert[data-user-language="he"],
[data-user-language="ar"] .alert,
[data-user-language="he"] .alert {
    direction: rtl;
    text-align: start;
}

/* Alert with icons */
.alert[data-user-language="ar"] .alert-icon,
.alert[data-user-language="he"] .alert-icon,
[data-user-language="ar"] .alert .alert-icon,
[data-user-language="he"] .alert .alert-icon {
    order: 2; /* Move icon to the right in RTL */
    margin-left: 0;
    margin-right: 8px;
}

/* Modal */
.modal[data-user-language="ar"],
.modal[data-user-language="he"],
[data-user-language="ar"] .modal,
[data-user-language="he"] .modal {
    direction: rtl;
}

.modal[data-user-language="ar"] .modal-header,
.modal[data-user-language="he"] .modal-header,
[data-user-language="ar"] .modal .modal-header,
[data-user-language="he"] .modal .modal-header {
    text-align: start;
}

.modal[data-user-language="ar"] .modal-content,
.modal[data-user-language="he"] .modal-content,
[data-user-language="ar"] .modal .modal-content,
[data-user-language="he"] .modal .modal-content {
    text-align: start;
}

.modal[data-user-language="ar"] .modal-footer,
.modal[data-user-language="he"] .modal-footer,
[data-user-language="ar"] .modal .modal-footer,
[data-user-language="he"] .modal .modal-footer {
    flex-direction: row-reverse;
}

/* Modal close button positioning */
.modal[data-user-language="ar"] .modal-close,
.modal[data-user-language="he"] .modal-close,
[data-user-language="ar"] .modal .modal-close,
[data-user-language="he"] .modal .modal-close {
    left: 15px;
    right: auto;
}

/* =================================================== */
/* CHAT ELEMENTS */
/* =================================================== */

/* Chat Container */
.chat[data-user-language="ar"],
.chat[data-user-language="he"],
.chat-container[data-user-language="ar"],
.chat-container[data-user-language="he"],
[data-user-language="ar"] .chat,
[data-user-language="he"] .chat,
[data-user-language="ar"] .chat-container,
[data-user-language="he"] .chat-container {
    direction: rtl;
}

/* Chat messages */
.chat[data-user-language="ar"] .chat-message,
.chat[data-user-language="he"] .chat-message,
[data-user-language="ar"] .chat .chat-message,
[data-user-language="he"] .chat .chat-message {
    text-align: start;
}

/* User messages (typically on the right in LTR, left in RTL) */
.chat[data-user-language="ar"] .chat-message.user,
.chat[data-user-language="he"] .chat-message.user,
[data-user-language="ar"] .chat .chat-message.user,
[data-user-language="he"] .chat .chat-message.user {
    align-self: flex-start;
    margin-left: 0;
    margin-right: auto;
}

/* Bot/other messages (typically on the left in LTR, right in RTL) */
.chat[data-user-language="ar"] .chat-message.bot,
.chat[data-user-language="he"] .chat-message.bot,
[data-user-language="ar"] .chat .chat-message.bot,
[data-user-language="he"] .chat .chat-message.bot {
    align-self: flex-end;
    margin-right: 0;
    margin-left: auto;
}

/* Chat input */
.chat[data-user-language="ar"] .chat-input,
.chat[data-user-language="he"] .chat-input,
[data-user-language="ar"] .chat .chat-input,
[data-user-language="he"] .chat .chat-input {
    direction: rtl;
    text-align: start;
}

/* =================================================== */
/* SPECIAL HANDLING */
/* =================================================== */

/* Numbers and financial data */
[data-user-language="ar"] .number,
[data-user-language="ar"] .currency,
[data-user-language="ar"] .financial,
[data-user-language="ar"] .price,
[data-user-language="ar"] .amount,
[data-user-language="he"] .number,
[data-user-language="he"] .currency,
[data-user-language="he"] .financial,
[data-user-language="he"] .price,
[data-user-language="he"] .amount {
    direction: ltr; /* Keep numbers LTR for readability */
}

/* Icon flipping for directional icons */
[data-user-language="ar"] .icon-arrow-right,
[data-user-language="ar"] .icon-chevron-right,
[data-user-language="ar"] .icon-next,
[data-user-language="he"] .icon-arrow-right,
[data-user-language="he"] .icon-chevron-right,
[data-user-language="he"] .icon-next {
    transform: scaleX(-1);
}

[data-user-language="ar"] .icon-arrow-left,
[data-user-language="ar"] .icon-chevron-left,
[data-user-language="ar"] .icon-prev,
[data-user-language="he"] .icon-arrow-left,
[data-user-language="he"] .icon-chevron-left,
[data-user-language="he"] .icon-prev {
    transform: scaleX(-1);
}

/* =================================================== */
/* END OF FILE */
/* =================================================== */