/* ============================================
   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 — Full Mirror using margin
   ============================================ */

/*
 * LTR uses position:relative + left:0 / left:50%.
 * RTL: we kill `left`, and use `margin-left` to push items.
 * odd = right side of timeline (margin-left:50%)
 * even = left side of timeline (margin-left:0)
 * Text alignment mirrors too.
 */
[dir="rtl"] .roadmap-item {
    left: auto !important;
    right: auto !important;
}

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

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

/* Dots: odd on left edge (toward center), even on right edge (toward center) */
[dir="rtl"] .roadmap-item:nth-child(odd) .roadmap-dot {
    right: auto;
    left: -6px;
}

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

/* Content text alignment inside cards */
[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; }

/* Security / Protocol cards text */
[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; }

/* Scenario cards stay centered */
[dir="rtl"] .scenario-card { text-align: center; }

/* Founder card stays centered */
[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 {
        width: 100% !important;
        left: auto !important;
        right: auto !important;
        margin-left: 0 !important;
        text-align: right !important;
        padding: 10px 50px 10px 10px;
    }

    [dir="rtl"] .roadmap-dot {
        left: auto !important;
        right: 14px !important;
    }
}
