/* ========================================================================== Les Kids' Kalam — RTL overrides for Arabic pages Loaded AFTER styles.css on /ar/ pages (dir="rtl" on ) ========================================================================== */ :root { --font-body: "Cairo", "Noto Naskh Arabic", "Poppins", system-ui, sans-serif; --font-heading: "Cairo", "Noto Naskh Arabic", "Roboto", system-ui, sans-serif; } /* Most layout flips automatically with dir="rtl". These are the cases that don't. */ .skip-link { left: auto; right: 0; } .lang-switch { border-left: 0; border-right: 1px solid rgba(3, 152, 158, 0.2); padding-left: 0; padding-right: 1rem; } @media (max-width: 899px) { .lang-switch { border-right: 0; border-top: 1px solid rgba(3, 152, 158, 0.15); padding-right: 0; padding-top: 1rem; } } .resource-card { border-left: 0; border-right: 4px solid var(--color-yellow); } .testimonial::before { left: auto; right: 1rem; } .placeholder::before { left: auto; right: 0; } /* Slightly larger base size — Arabic glyphs read smaller per em than Latin */ body { font-size: 18px; line-height: 1.8; } h1, h2, h3, h4 { letter-spacing: 0; line-height: 1.4; } /* Numbers and Latin text inside Arabic pages stay LTR */ .ltr-inline { unicode-bidi: isolate; direction: ltr; }