/* ============================================================
   RTL (Right-to-Left) Support & Language Toggle
   ============================================================ */

/* ── Language toggle button ─────────────────────────────────── */

.lang-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--s-2);
    width: calc(100% - var(--s-6));
    margin: var(--s-2) var(--s-3);
    padding: 8px var(--s-3);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    background: var(--bg-card);
    font-family: var(--sans);
    font-size: var(--t-sm);
    font-weight: 500;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background var(--ease), color var(--ease);
}

.lang-toggle:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

/* ── RTL overrides ──────────────────────────────────────────── */

html[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .sidebar {
    border-right: none;
    border-left: 1px solid var(--border);
}

html[dir="rtl"] .nav-item {
    text-align: right;
}

html[dir="rtl"] .acc-left {
    flex-direction: row-reverse;
}

/* Flip directional padding/margins */
html[dir="rtl"] .callout-light {
    border-left: none;
    border-right: 3px solid var(--accent);
}

html[dir="rtl"] .warning {
    border-left: none;
    border-right: 3px solid var(--negative);
}

html[dir="rtl"] .info-block {
    border-left: none;
    border-right: 3px solid var(--info);
}

html[dir="rtl"] .disc-list {
    padding-left: 0;
    padding-right: var(--s-5);
}

html[dir="rtl"] .ol {
    padding-left: 0;
    padding-right: var(--s-5);
}

html[dir="rtl"] .check-list li {
    flex-direction: row-reverse;
}

html[dir="rtl"] .badge-pin {
    right: auto;
    left: var(--s-3);
}

/* Table alignment */
html[dir="rtl"] .table th,
html[dir="rtl"] .table td {
    text-align: right;
}

html[dir="rtl"] .cell-mono {
    direction: ltr;
    unicode-bidi: embed;
}

/* Note block */
html[dir="rtl"] .note {
    border-left: none;
    border-right: 2px solid var(--border-strong);
    border-radius: var(--r-sm) 0 0 var(--r-sm);
}

/* Form labels */
html[dir="rtl"] .form-label {
    text-align: right;
}

html[dir="rtl"] .form-hint {
    text-align: right;
}

/* Result display */
html[dir="rtl"] .result {
    flex-direction: row-reverse;
}

/* Mobile nav */
html[dir="rtl"] .mobile-nav-toggle {
    flex-direction: row-reverse;
}

html[dir="rtl"] .mobile-nav-label {
    flex-direction: row-reverse;
}

/* Sidebar on desktop */
@media (min-width: 768px) {
    html[dir="rtl"] .app {
        flex-direction: row-reverse;
    }
}

/* Stat cards - keep numbers LTR */
html[dir="rtl"] .stat-value {
    direction: ltr;
    unicode-bidi: embed;
}

/* Code blocks - keep LTR */
html[dir="rtl"] .code {
    direction: ltr;
    text-align: left;
}

/* Range labels */
html[dir="rtl"] .range-labels {
    flex-direction: row-reverse;
}