/* ============================================
   RTL Overrides (Arabic)
   ============================================ */

[dir="rtl"] .section-title,
[dir="rtl"] .section-subtitle { text-align: right; }

[dir="rtl"] .section-center .section-title,
[dir="rtl"] .section-center .section-subtitle { text-align: center; }

/* Header */
[dir="rtl"] header { flex-direction: row-reverse; }
[dir="rtl"] nav { flex-direction: row-reverse; }
[dir="rtl"] .header-right { flex-direction: row-reverse; }

/* No-token callout */
[dir="rtl"] .no-token-callout {
    border-left: 1px solid var(--steel-border);
    border-right: 3px solid var(--accent-green);
}

/* Protocol cards list */
[dir="rtl"] .protocol-card ul li::before { margin-right: 0; margin-left: 0.5rem; }
[dir="rtl"] .roadmap-content ul li::before { margin-right: 0; margin-left: 0.5rem; }

/* Problem table */
[dir="rtl"] .problem-table { direction: rtl; }

/* Comparison table */
[dir="rtl"] .comparison-table th { text-align: right; }

/* Financial table */
[dir="rtl"] .fin-table th:first-child { text-align: right; }
[dir="rtl"] .fin-table td:first-child { text-align: right; }

/* Risk table */
[dir="rtl"] .risk-table th { text-align: right; }

/* Fund bars */
[dir="rtl"] .fund-bar { justify-content: flex-end; }
[dir="rtl"] .funds-table .fund-name { text-align: right; }

/* Ownership labels */
[dir="rtl"] .ownership-labels { flex-direction: row-reverse; }

/* Legal block */
[dir="rtl"] .legal-block { flex-direction: row-reverse; }
[dir="rtl"] .legal-text { text-align: right; }
[dir="rtl"] .legal-list li { flex-direction: row-reverse; }

/* Position cards */
[dir="rtl"] .position-card { text-align: right; }

/* Legend */
[dir="rtl"] .legend-item { flex-direction: row-reverse; }
[dir="rtl"] .legend-pct { margin-left: 0; margin-right: auto; padding-left: 0; padding-right: 1.5rem; }

/* ============================================
   ROADMAP RTL
   ============================================
   LTR layout:
     odd  → left:0    (left side,  text-align:right)
     even → left:50%  (right side, text-align:left)

   RTL mirror:
     odd  → right side (text-align:left)
     even → left side  (text-align:right)

   We override `left` with `auto` and use `margin-left`
   to position items, since margin is reliable with
   position:relative and unaffected by dir.
*/

[dir="rtl"] .roadmap-item:nth-child(odd) {
    left: auto !important;
    margin-left: 50%;
    text-align: left;
}

[dir="rtl"] .roadmap-item:nth-child(even) {
    left: auto !important;
    margin-left: 0;
    text-align: right;
}

[dir="rtl"] .roadmap-item:nth-child(odd) .roadmap-dot {
    right: auto !important;
    left: -6px;
}

[dir="rtl"] .roadmap-item:nth-child(even) .roadmap-dot {
    left: auto !important;
    right: -6px;
}

[dir="rtl"] .roadmap-content { text-align: right; }
[dir="rtl"] .roadmap-content ul { direction: rtl; }

/* Ticker direction */
[dir="rtl"] .ticker-content { animation-direction: reverse; }

/* Steps row */
[dir="rtl"] .steps-row { flex-direction: row-reverse; }
[dir="rtl"] .step-item { text-align: right; }

/* CTA */
[dir="rtl"] .cta-block { text-align: center; }
[dir="rtl"] .cta-buttons { flex-direction: row-reverse; }

/* Cards text alignment */
[dir="rtl"] .security-card { text-align: right; }
[dir="rtl"] .adv-card { text-align: right; }
[dir="rtl"] .protocol-card { text-align: right; }
[dir="rtl"] .protection-card { text-align: right; }
[dir="rtl"] .exit-card { text-align: right; }
[dir="rtl"] .scenario-card { text-align: center; }
[dir="rtl"] .founder-card { text-align: center; }

/* ============================================
   Mobile RTL
   ============================================ */
@media (max-width: 768px) {
    [dir="rtl"] .roadmap-container::before {
        left: auto;
        right: 20px;
    }

    [dir="rtl"] .roadmap-item:nth-child(odd),
    [dir="rtl"] .roadmap-item:nth-child(even) {
        width: 100% !important;
        left: auto !important;
        margin-left: 0 !important;
        text-align: right !important;
        padding: 10px 50px 10px 10px;
    }

    [dir="rtl"] .roadmap-item:nth-child(odd) .roadmap-dot,
    [dir="rtl"] .roadmap-item:nth-child(even) .roadmap-dot {
        left: auto !important;
        right: 14px !important;
    }
}
