[dir="rtl"] [class*="tw-space-x-"] > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 1;
}

[dir="rtl"] [class*="tw-divide-x"] > :not([hidden]) ~ :not([hidden]) {
    --tw-divide-x-reverse: 1;
}

[dir="rtl"] .todo-panel [class*="tw-divide-x"] > a + a {
    padding-left: 0;
    padding-right: 0.5rem;
}

[dir="rtl"] ul.todo .media-left {
    padding-left: 12px;
    padding-right: 0;
    position: relative;
}

[dir="rtl"] ul.todo .todo-dragger {
    background-position: right 11px;
    left: auto;
    right: 0;
}

[dir="rtl"] ul.todo .todo-checkbox {
    float: right;
    padding-left: 0;
    padding-right: 30px !important;
}

[dir="rtl"] ul.todo a.pull-right.text-muted {
    align-items: center;
    display: inline-flex;
    float: left !important;
    justify-content: center;
    margin: 0 !important;
    min-height: 24px;
    min-width: 24px;
}

[dir="rtl"] ul.todo a.pull-right.text-muted + a.pull-right.text-muted {
    margin-left: 6px !important;
}

[dir="rtl"] ul.todo a.pull-right.text-muted > i {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

[dir="rtl"] .tw-flex.tw-items-center > a,
[dir="rtl"] .tw-inline-flex.tw-items-center > a {
    flex-shrink: 0;
}

/*
 * Perfex positions Kanban columns with `float: left` even on RTL pages.
 * Keep the first status at the right edge and make dynamically loaded cards
 * inherit the RTL direction as well.
 */
[dir="rtl"] #kan-ban {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] #kan-ban .kan-ban-col {
    float: right;
    margin-left: 6px;
    margin-right: 0;
    text-align: right;
}

[dir="rtl"] #kan-ban .kan-ban-col:last-child {
    margin-left: 0;
}

[dir="rtl"] #kan-ban .kan-ban-col .panel-heading,
[dir="rtl"] #kan-ban .kan-ban-content-wrapper,
[dir="rtl"] #kan-ban .kan-ban-content {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] #kan-ban .panel-body .lead-name,
[dir="rtl"] #kan-ban .panel-body .task-name {
    background-position: right 10px top 10px;
    padding-left: 0;
    padding-right: 25px;
}

[dir="rtl"] #kan-ban .panel-body .lead-name {
    margin-left: 0;
    margin-right: -10px;
}

/* Keep the Gantt headers and task popup readable in Persian. */
[dir="rtl"] #gantt .gantt .lower-text,
[dir="rtl"] #gantt .gantt .upper-text,
[dir="rtl"] #gantt .gantt .bar-label,
[dir="rtl"] #gantt .gantt-container .popup-wrapper {
    font-family: Vazirmatn, Tahoma, Arial, sans-serif;
}

[dir="rtl"] #gantt .gantt-container .popup-wrapper {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] #gantt .gantt .bar-label {
    direction: rtl;
    pointer-events: none;
    text-anchor: end;
    unicode-bidi: plaintext;
}
