/* RTL Support for Arabic Language */
html[dir="rtl"] {
    direction: rtl;
}

html[dir="rtl"] body {
    text-align: right;
    direction: rtl;
}

/* Global text alignment for RTL */
html[dir="rtl"] * {
    text-align: inherit;
}

/* RTL fixes for MudBlazor components */
html[dir="rtl"] .mud-nav-link {
    text-align: right;
}

html[dir="rtl"] .mud-typography {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .mud-input {
    direction: rtl;
}

html[dir="rtl"] .mud-input input {
    text-align: right;
}

html[dir="rtl"] .mud-input-control {
    text-align: right;
}

html[dir="rtl"] .mud-input-slot {
    text-align: right;
}

html[dir="rtl"] .mud-menu-item {
    text-align: right;
}

html[dir="rtl"] .mud-list-item {
    text-align: right;
}

html[dir="rtl"] .mud-list-item-text {
    text-align: right;
}

html[dir="rtl"] .mud-drawer-content {
    text-align: right;
}

html[dir="rtl"] .mud-text {
    text-align: right;
}

/* RTL support for custom navigation */
html[dir="rtl"] .cs-li-link {
    text-align: right;
}

html[dir="rtl"] .cs-drop-link {
    text-align: right;
}

/* Ensure form elements maintain proper RTL alignment */
html[dir="rtl"] .mud-form {
    direction: rtl;
}

html[dir="rtl"] .mud-table {
    direction: rtl;
}

html[dir="rtl"] .mud-table-cell {
    text-align: right;
}

html[dir="rtl"] .mud-table-head-cell {
    text-align: right;
}

/* Button and input group RTL fixes */
html[dir="rtl"] .mud-button-group {
    flex-direction: row-reverse;
}

html[dir="rtl"] .mud-input-adornment {
    order: -1;
}

html[dir="rtl"] .mud-input-adornment-start {
    margin-right: 0;
    margin-left: 8px;
}

html[dir="rtl"] .mud-input-adornment-end {
    margin-left: 0;
    margin-right: 8px;
}

/* Card and container RTL fixes */
html[dir="rtl"] .mud-card-content {
    text-align: right;
}

html[dir="rtl"] .mud-card-header {
    text-align: right;
}

html[dir="rtl"] .mud-card-header-content {
    text-align: right;
}

html[dir="rtl"] .mud-container {
    direction: rtl;
}

/* Dialog RTL fixes */
html[dir="rtl"] .mud-dialog-content {
    text-align: right;
}

html[dir="rtl"] .mud-dialog-title {
    text-align: right;
}

html[dir="rtl"] .mud-dialog-actions {
    flex-direction: row-reverse;
}

/* Padding and margin adjustments for RTL */
html[dir="rtl"] .mud-appbar {
    flex-direction: row-reverse;
}

html[dir="rtl"] .mud-appbar-content {
    flex-direction: row-reverse;
}

html[dir="rtl"] .mud-drawer-left {
    right: 0;
    left: auto;
}

html[dir="rtl"] .mud-drawer-right {
    left: 0;
    right: auto;
}

/* Icon adjustments for RTL - Only flip directional icons */
html[dir="rtl"] .mud-nav-link .mud-icon-button {
    transform: none;
}

html[dir="rtl"] .mud-expand-panel .mud-expand-panel-header .mud-icon-button {
    transform: scaleX(-1);
}

/* Breadcrumb RTL */
html[dir="rtl"] .mud-breadcrumbs {
    flex-direction: row-reverse;
}

html[dir="rtl"] .mud-breadcrumb-separator {
    transform: scaleX(-1);
}

/* Pagination RTL */
html[dir="rtl"] .mud-pagination {
    flex-direction: row-reverse;
}

/* Chip RTL */
html[dir="rtl"] .mud-chip {
    flex-direction: row-reverse;
}

/* Tabs RTL */
html[dir="rtl"] .mud-tabs-toolbar {
    flex-direction: row-reverse;
}

/* Select RTL */
html[dir="rtl"] .mud-select {
    text-align: right;
}

html[dir="rtl"] .mud-select-input {
    text-align: right;
}

html[dir="rtl"] .mud-select-item {
    text-align: right;
}

html[dir="rtl"] .mud-popover {
    text-align: right;
}

/* TextField and TextArea RTL */
html[dir="rtl"] .mud-input-outlined {
    text-align: right;
}

html[dir="rtl"] .mud-input-filled {
    text-align: right;
}

html[dir="rtl"] textarea.mud-input {
    text-align: right;
}

/* Dropdown icons */
html[dir="rtl"] .cs-drop-icon {
    transform: scaleX(-1);
}

/* Main content padding for RTL with drawer */
html[dir="rtl"] .mud-main-content {
    padding-right: 256px;
    padding-left: 0;
}

@media (max-width: 1279px) {
    html[dir="rtl"] .mud-main-content {
        padding-right: 0;
    }
}

/* Stack RTL */
html[dir="rtl"] .mud-stack-row {
    flex-direction: row-reverse;
}

/* Grid RTL */
html[dir="rtl"] .mud-grid {
    direction: rtl;
}

/* Menu RTL */
html[dir="rtl"] .mud-menu {
    text-align: right;
}

html[dir="rtl"] .mud-menu-activator {
    text-align: right;
}

/* Snackbar RTL */
html[dir="rtl"] .mud-snackbar-content-message {
    text-align: right;
}

/* Alert RTL */
html[dir="rtl"] .mud-alert-message {
    text-align: right;
}

/* Paper RTL */
html[dir="rtl"] .mud-paper {
    direction: rtl;
}

/* Ensure proper spacing for RTL */
html[dir="rtl"] .ml-3,
html[dir="rtl"] .ms-3 {
    margin-left: 0 !important;
    margin-right: 1rem !important;
}

html[dir="rtl"] .mr-3,
html[dir="rtl"] .me-3 {
    margin-right: 0 !important;
    margin-left: 1rem !important;
}

html[dir="rtl"] .pl-3,
html[dir="rtl"] .ps-3 {
    padding-left: 0 !important;
    padding-right: 1rem !important;
}

html[dir="rtl"] .pr-3,
html[dir="rtl"] .pe-3 {
    padding-right: 0 !important;
    padding-left: 1rem !important;
}

/* Float adjustments for RTL */
html[dir="rtl"] .float-start {
    float: right !important;
}

html[dir="rtl"] .float-end {
    float: left !important;
}

/* Ensure all text content aligns right in RTL */
html[dir="rtl"] p,
html[dir="rtl"] span,
html[dir="rtl"] div,
html[dir="rtl"] label,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6 {
    text-align: right;
}

/* LTR specific overrides to ensure left alignment */
html[dir="ltr"] body {
    text-align: left;
    direction: ltr;
}

html[dir="ltr"] p,
html[dir="ltr"] span,
html[dir="ltr"] div,
html[dir="ltr"] label,
html[dir="ltr"] h1,
html[dir="ltr"] h2,
html[dir="ltr"] h3,
html[dir="ltr"] h4,
html[dir="ltr"] h5,
html[dir="ltr"] h6 {
    text-align: left;
}
