/* ==========================================================================
   Right-to-left overrides. Applied when <html dir="rtl">.
   Most layout uses logical properties, so it mirrors automatically. This file
   covers what does not: directional icons, slider direction, numeric order,
   mixed-direction copy and the handwritten notes.
   The back-to-top button deliberately stays on the physical right edge.
   ========================================================================== */

[dir="rtl"] body {
  text-align: start;
}

/* Directional icons point the other way in RTL */
[dir="rtl"] .btn .fa-arrow-right,
[dir="rtl"] .btn .fa-arrow-left,
[dir="rtl"] .text-link .fa-arrow-right {
  transform: scaleX(-1);
}

/* Sliders keep a left-to-right value scale so numbers read naturally */
[dir="rtl"] input[type="range"] {
  direction: ltr;
}

/* Numeric values stay in left-to-right order inside RTL text */
[dir="rtl"] .slider-head output,
[dir="rtl"] .result-main,
[dir="rtl"] .result-row dd,
[dir="rtl"] .insight-meta {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Mixed-direction copy: a sentence beginning in English inside an RTL page
   put its full stop at the wrong end. plaintext lets each block take its
   direction from its own first strong character. Alignment is set explicitly
   so headings and paragraphs stay right-aligned, as the RTL layout requires.
   That also suits Arabic and Hebrew copy. */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] p,
[dir="rtl"] li,
[dir="rtl"] figcaption,
[dir="rtl"] summary,
[dir="rtl"] legend,
[dir="rtl"] label {
  unicode-bidi: plaintext;
  text-align: right;
}

/* Handwritten notes keep their tilt, mirrored */
[dir="rtl"] .note-hero {
  transform: rotate(6deg);
}

/* ---------- About page (RTL) ---------- */
[dir="rtl"] .about-tags li { border-inline-start-width: 3px; }
[dir="rtl"] .checklist li,
[dir="rtl"] .about-copy,
[dir="rtl"] .section-intro,
[dir="rtl"] .team-body,
[dir="rtl"] .value-card { text-align: start; }

/* ---------- EMI calculator page (RTL) ----------
   Money fields keep the ₹ sign on the left, and charts and progress bars
   fill from the left as they do in the left-to-right layout. Logical
   properties handle the rest. */
[dir="rtl"] .emi-input-wrap { direction: ltr; }
[dir="rtl"] .emi-input-wrap input { text-align: end; }
[dir="rtl"] .emi-chart,
[dir="rtl"] .emi-chart-axis,
[dir="rtl"] .prepay-track,
[dir="rtl"] .gauge { direction: ltr; }
[dir="rtl"] .emi-result-value,
[dir="rtl"] .emi-rows dd,
[dir="rtl"] .emi-milestones dd,
[dir="rtl"] .prepay-num,
[dir="rtl"] .afford-amount,
[dir="rtl"] .gauge-text,
[dir="rtl"] .emi-field-foot small,
[dir="rtl"] .ticket-formula,
[dir="rtl"] .dial-core,
[dir="rtl"] .race-stats dd,
[dir="rtl"] .race-years { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .note-pill { transform: rotate(5deg); }
[dir="rtl"] .emi-prepay-copy,
[dir="rtl"] .emi-afford-copy,
[dir="rtl"] .emi-plan-copy { text-align: start; }

/* ---------- Home sections (v10.2) ---------- */
[dir="rtl"] .ln-hint::after { content: "\2190"; }
[dir="rtl"] .ln-rate,
[dir="rtl"] .ln-big,
[dir="rtl"] .lf-result-value,
[dir="rtl"] .hz-item strong,
[dir="rtl"] .ln-face small { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .as-mark { direction: ltr; }

/* ---------- 404 page and header RTL button ---------- */
[dir="rtl"] .nf-car { left: auto; right: 6%; animation-name: nf-drive-rtl; }
[dir="rtl"] .nf-pin { right: auto; left: 14%; }
[dir="rtl"] .dir-btn { letter-spacing: 0.04em; }

/* ===== Home 1 hero arch, mirrored ===== */
[dir="rtl"] .hm-arch .hm-frame { border-radius: 50% 44% 26px 26px / 30% 26% 26px 26px; }
[dir="rtl"] .hm-note { inset-inline-start: auto; inset-inline-end: 2%; transform: rotate(7deg); }
[dir="rtl"] .hm-arch .scroll-down { inset-inline-start: auto; inset-inline-end: 0; }
[dir="rtl"] .hm-arch .hm-blob { transform: rotate(4deg); }
@keyframes hm-write-rtl { from { opacity: 0; transform: rotate(7deg) translateY(10px); } to { opacity: 1; transform: rotate(7deg); } }
[dir="rtl"] .hm-note { animation-name: hm-write-rtl; }

/* ---------- About page: new sections (RTL) ---------- */
/* Timeline and orbit use logical properties, so they mirror on their own.
   The receipt's zigzag edge is symmetric. */
[dir="rtl"] .ab-receipt { -webkit-mask: radial-gradient(circle 10px at 10px calc(100% + 0px), #0000 98%, #000) 0 0 / 20px 100% repeat-x; }

/* ---------- Contact: map and loan enquiry form (RTL) ---------- */
[dir="rtl"] .ct-map-open { inset-inline-start: auto; inset-inline-end: 14px; }
[dir="rtl"] .ldf-select { background-position: left 1rem center; }
