/*
 * Racing Royale — Release 7: language picker, right-to-left layout
 * (Arabic, Urdu) and fonts for Arabic, Urdu and Tamil scripts.
 */

/* ---------- Language picker (header) ---------- */
.rrs-lang { position: relative; margin-inline-start: 8px; }
.rrs-lang > summary {
    list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px;
    border: 1px solid rgba(233,195,73,.35); border-radius: 6px; color: #e9c349; font: 600 12px "Inter", system-ui, sans-serif; white-space: nowrap;
}
.rrs-lang > summary::-webkit-details-marker { display: none; }
.rrs-lang-menu {
    position: absolute; inset-inline-end: 0; top: calc(100% + 6px); z-index: 60; min-width: 160px; padding: 6px;
    background: #0c0f10; border: 1px solid rgba(233,195,73,.25); border-radius: 8px; box-shadow: 0 12px 30px rgba(0,0,0,.6);
    display: grid; gap: 2px;
}
.rrs-lang-menu a { padding: 9px 12px; border-radius: 6px; color: #e1e3e4; text-decoration: none; font-size: 15px; }
.rrs-lang-menu a:hover { background: rgba(233,195,73,.1); color: #e9c349; }
.rrs-lang-menu a.is-active { color: #e9c349; font-weight: 700; }
@media (max-width: 1180px) {
    .rrs-links.is-open .rrs-lang { margin: 12px 18px 0; }
    .rrs-links.is-open .rrs-lang > summary { width: 100%; justify-content: center; height: 44px; }
    .rrs-links.is-open .rrs-lang-menu { position: static; margin-top: 6px; }
}

/* ---------- Fonts per script ---------- */
html[lang="ar"] body, html[lang="ar"] .rrh { font-family: "Noto Naskh Arabic", "Inter", system-ui, sans-serif; }
html[lang="ur"] body, html[lang="ur"] .rrh { font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", system-ui, sans-serif; line-height: 2; }
html[lang="ta"] body, html[lang="ta"] .rrh { font-family: "Noto Sans Tamil", "Inter", system-ui, sans-serif; }
html[lang="ar"] .rrh { --rrh-serif: "Noto Naskh Arabic", "Playfair Display", serif; --rrh-sans: "Noto Naskh Arabic", "Inter", sans-serif; }
html[lang="ur"] .rrh { --rrh-serif: "Noto Nastaliq Urdu", "Noto Naskh Arabic", serif; --rrh-sans: "Noto Nastaliq Urdu", "Noto Naskh Arabic", sans-serif; }
html[lang="ta"] .rrh { --rrh-serif: "Noto Sans Tamil", "Playfair Display", serif; --rrh-sans: "Noto Sans Tamil", "Inter", sans-serif; }
html[lang="ar"] .gr-display, html[lang="ar"] .gr-section-title, html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3 { font-family: "Noto Naskh Arabic", serif; letter-spacing: 0; }
html[lang="ur"] .gr-display, html[lang="ur"] .gr-section-title, html[lang="ur"] h1, html[lang="ur"] h2, html[lang="ur"] h3 { font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", serif; letter-spacing: 0; line-height: 1.9; }
html[lang="ta"] .gr-display, html[lang="ta"] .gr-section-title, html[lang="ta"] h1, html[lang="ta"] h2, html[lang="ta"] h3 { font-family: "Noto Sans Tamil", serif; letter-spacing: 0; }
/* Uppercase + wide tracking breaks connected scripts */
html[lang="ar"] .rrs-link, html[lang="ur"] .rrs-link, html[lang="ta"] .rrs-link,
html[lang="ar"] .rrs-btn, html[lang="ur"] .rrs-btn, html[lang="ta"] .rrs-btn,
html[lang="ar"] .rrh-btn, html[lang="ur"] .rrh-btn, html[lang="ta"] .rrh-btn,
html[lang="ar"] .rrh-eyebrow, html[lang="ur"] .rrh-eyebrow, html[lang="ta"] .rrh-eyebrow,
html[lang="ar"] .rrh-chip, html[lang="ur"] .rrh-chip, html[lang="ta"] .rrh-chip,
html[lang="ar"] .rrh-k, html[lang="ur"] .rrh-k, html[lang="ta"] .rrh-k,
html[lang="ar"] .gr-eyebrow, html[lang="ur"] .gr-eyebrow, html[lang="ta"] .gr-eyebrow { letter-spacing: 0 !important; text-transform: none !important; }
html[lang="ta"] .rrh-hero h1 { font-size: clamp(26px, 4vw, 44px); }
html[lang="ta"] .rrs-link, html[lang="ta"] .rrs-btn { font-size: 11.5px !important; }

/* ---------- Right-to-left (Arabic, Urdu) ---------- */
[dir="rtl"] body { text-align: right; }
[dir="rtl"] .rrh-head--center, [dir="rtl"] .rrh-hero, [dir="rtl"] .rrh-stats, [dir="rtl"] .rrh-empty { text-align: center; }
/* Codes, ticket numbers, times, mobiles and amounts always read left-to-right */
[dir="rtl"] code, [dir="rtl"] .rrh-countdown, [dir="rtl"] .rrh-pool-amount,
[dir="rtl"] input[name="code"], [dir="rtl"] input[type="tel"], [dir="rtl"] input[type="email"], [dir="rtl"] input[type="number"] {
    direction: ltr; unicode-bidi: isolate;
}
[dir="rtl"] input[name="code"] { text-align: right; }
[dir="rtl"] input[name="code"]::placeholder { direction: rtl; }
[dir="rtl"] .rrh-faq summary::after { margin-inline-start: auto; }
[dir="rtl"] .rrh-play { text-align: right; }
[dir="rtl"] .rrh-close .rrh-k::before { margin-right: 0; margin-left: 6px; }
@media (max-width: 1180px) {
    [dir="rtl"] .rrs-links.is-open .rrs-link, [dir="rtl"] .rrs-links.is-open .gr-nav-logout-btn { text-align: right; }
    [dir="rtl"] .rrs-links.is-open .rrs-link.is-active { border-left: 0; border-right: 3px solid #e9c349; padding-left: 18px; padding-right: 15px; }
}
@media (max-width: 720px) {
    [dir="rtl"] .gr-leaderboard-table th:nth-child(1), [dir="rtl"] .gr-leaderboard-table td:nth-child(1) { left: auto; right: 0; }
    [dir="rtl"] .gr-leaderboard-table th:nth-child(2), [dir="rtl"] .gr-leaderboard-table td:nth-child(2) { left: auto; right: 2.6rem; }
}
