/* ============================================================
   The Digital Octopus — RTL (Arabic) Overrides
   Applied when body has class 'rtl-mode'
   ============================================================ */

/* Google Font - Noto Sans Arabic */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;600;700&display=swap');

.rtl-mode {
    font-family: 'Noto Sans Arabic', 'Segoe UI', Tahoma, sans-serif;
}

/* --- Text Alignment --- */
.rtl-mode .explanation,
.rtl-mode .causes-list,
.rtl-mode .prevention-list,
.rtl-mode .solution-body,
.rtl-mode .trust-desc,
.rtl-mode .toc,
.rtl-mode footer,
.rtl-mode .summary {
    text-align: right;
}

/* --- Breadcrumb flip --- */
.rtl-mode .breadcrumb {
    direction: rtl;
}

/* --- Layout Grid: Sidebar swap --- */
.rtl-mode .layout-grid {
    direction: rtl;
}

/* --- Solution Cards --- */
.rtl-mode .solution-header {
    flex-direction: row-reverse;
}

.rtl-mode .solution-number {
    margin-left: 1rem;
    margin-right: 0;
}

.rtl-mode .solution-toggle {
    margin-right: auto;
    margin-left: 0;
}

.rtl-mode .steps-list {
    padding-right: 1.5rem;
    padding-left: 0;
}

/* --- Quick Info --- */
.rtl-mode .quick-info {
    direction: rtl;
}

/* --- TOC links --- */
.rtl-mode .toc a {
    text-align: right;
}

.rtl-mode .toc a::before {
    margin-left: 0.5rem;
    margin-right: 0;
}

/* --- Error Badge --- */
.rtl-mode .error-badge {
    direction: ltr;
    /* Keep error codes LTR */
}

/* --- Code blocks stay LTR --- */
.rtl-mode pre,
.rtl-mode code,
.rtl-mode .terminal-window {
    direction: ltr;
    text-align: left;
}

/* --- Share Bar --- */
.rtl-mode .share-bar {
    direction: rtl;
}

/* --- Page Actions --- */
.rtl-mode .page-actions {
    flex-direction: row-reverse;
}

/* --- Trust Box --- */
.rtl-mode .trust-box {
    flex-direction: row-reverse;
}

.rtl-mode .trust-info {
    text-align: right;
}

/* --- Related Grid --- */
.rtl-mode .related-card {
    text-align: right;
}

/* --- Urgency Strip --- */
.rtl-mode .urgency-strip {
    direction: rtl;
}

/* --- Mobile CTA --- */
.rtl-mode .mobile-sticky-cta {
    direction: rtl;
}

/* --- Widget --- */
.rtl-mode .widget {
    text-align: right;
}

/* --- Footer --- */
.rtl-mode footer p {
    text-align: center;
}

/* --- Language Selector RTL Overrides --- */
.rtl-mode .lang-btn {
    text-align: right;
    flex-direction: row-reverse;
}

.rtl-mode .lang-btn .lang-check {
    margin-left: 0;
    margin-right: auto;
}