/**
 * RTL overrides for Persian language.
 *
 * @package ARTCLE
 */

.artcle-app[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

.artcle-app[dir="rtl"] .artcle-table th,
.artcle-app[dir="rtl"] .artcle-table td {
    text-align: right;
}

.artcle-app[dir="rtl"] .artcle-form-actions {
    justify-content: flex-start;
}

.artcle-app[dir="rtl"] .artcle-question-card-footer {
    text-align: left;
}

.artcle-app[dir="rtl"] .artcle-role-option .artcle-role-card {
    text-align: center;
}

.artcle-app[dir="rtl"] .artcle-stat-card {
    border-inline-start: 4px solid var(--artcle-primary);
    border-right: 4px solid var(--artcle-primary);
}

.artcle-app[dir="rtl"] .artcle-callout {
    border-inline-start: 4px solid;
    border-right: 4px solid;
}

.artcle-app[dir="rtl"] .artcle-toggle-password {
    inset-inline-end: 10px;
    inset-inline-start: auto;
    right: 10px;
    left: auto;
}

.artcle-app[dir="rtl"] .artcle-password-wrapper input {
    padding-inline-end: 40px;
    padding-left: 40px;
    padding-right: 14px;
}

.artcle-app[dir="rtl"] .artcle-section-header {
    flex-direction: row;
}

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

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

.artcle-app[dir="rtl"] .artcle-action-buttons {
    flex-direction: row;
}

.artcle-app[dir="rtl"] .artcle-topbar-user {
    flex-direction: row;
}

.artcle-app[dir="rtl"] .artcle-actions-left,
.artcle-app[dir="rtl"] .artcle-actions-right {
    flex-direction: row;
}

/* Numbers stay LTR even in RTL context */
.artcle-app[dir="rtl"] .artcle-stat-value,
.artcle-app[dir="rtl"] .artcle-code,
.artcle-app[dir="rtl"] .artcle-otp-input {
    direction: ltr;
}

.artcle-app[dir="rtl"] .artcle-stat-card {
    text-align: right;
}

.artcle-app[dir="rtl"] input[type="email"],
.artcle-app[dir="rtl"] input[type="password"],
.artcle-app[dir="rtl"] input[type="tel"],
.artcle-app[dir="rtl"] input[type="url"],
.artcle-app[dir="rtl"] input[type="number"],
.artcle-app[dir="rtl"] input[type="date"] {
    direction: ltr;
    text-align: right;
}

.artcle-app[dir="rtl"] .artcle-lang-switcher {
    inset-inline-end: 12px;
    inset-inline-start: auto;
    right: 12px;
    left: auto;
}