/* ============================================================
   MUSLIGO - RIGHT-TO-LEFT (ARABIC) LAYER
   File: static/css/rtl.css  (loaded only when dir="rtl")
   Bootstrap's RTL build flips the grid and spacing utilities;
   templates use CSS logical properties for custom spacing. This file
   handles typography, directional icons and LTR-only widgets.
   ============================================================ */

html[dir="rtl"] body,
html[dir="rtl"] .tooltip,
html[dir="rtl"] .popover,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea,
html[dir="rtl"] button {
    font-family: 'Cairo', 'Poppins', 'Segoe UI', Tahoma, Arial, sans-serif;
}
html[dir="rtl"] body { letter-spacing: 0 !important; line-height: 1.7; }
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3,
html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6 { letter-spacing: 0 !important; line-height: 1.5; }
html[dir="rtl"] [style*="letter-spacing"] { letter-spacing: 0 !important; }
html[dir="rtl"] [style*="text-transform: uppercase"] { text-transform: none !important; }

/* Directional icons point the other way */
html[dir="rtl"] .fa-arrow-right, html[dir="rtl"] .fa-arrow-left,
html[dir="rtl"] .fa-chevron-right, html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .fa-angle-right, html[dir="rtl"] .fa-angle-left,
html[dir="rtl"] .fa-angles-right, html[dir="rtl"] .fa-angles-left,
html[dir="rtl"] .fa-angle-double-right, html[dir="rtl"] .fa-angle-double-left,
html[dir="rtl"] .fa-long-arrow-alt-right, html[dir="rtl"] .fa-long-arrow-alt-left,
html[dir="rtl"] .fa-arrow-circle-right, html[dir="rtl"] .fa-arrow-circle-left,
html[dir="rtl"] .fa-caret-right, html[dir="rtl"] .fa-caret-left,
html[dir="rtl"] .fa-sign-out-alt, html[dir="rtl"] .fa-sign-in-alt,
html[dir="rtl"] .fa-reply, html[dir="rtl"] .fa-share, html[dir="rtl"] .fa-quote-left,
html[dir="rtl"] .fa-quote-right, html[dir="rtl"] .fa-external-link-alt {
    transform: scaleX(-1);
}

/* Fixed-centre elements keep using physical centring */
html[dir="rtl"] .flash-container { left: 50%; right: auto; }

/* Sliding carousels animate with translateX in JS - keep the track LTR and
   let each slide's content flow RTL. */
html[dir="rtl"] .ad-carousel .ad-track,
html[dir="rtl"] .spotlight-track,
html[dir="rtl"] .spotlight-slider,
html[dir="rtl"] .carousel-inner { direction: ltr; }
html[dir="rtl"] .ad-carousel .ad-slide > *,
html[dir="rtl"] .spotlight-track > *,
html[dir="rtl"] .spotlight-slider > *,
html[dir="rtl"] .carousel-item > * { direction: rtl; }
html[dir="rtl"] .ad-carousel .ad-arrow-prev { left: 10px; right: auto; }
html[dir="rtl"] .ad-carousel .ad-arrow-next { right: 10px; left: auto; }

/* Things that must stay left-to-right in an Arabic page */
html[dir="rtl"] input[type="email"], html[dir="rtl"] input[type="tel"], html[dir="rtl"] input[type="url"],
html[dir="rtl"] input[type="number"], html[dir="rtl"] input[name="email"], html[dir="rtl"] input[name="phone"],
html[dir="rtl"] input[name="website"], html[dir="rtl"] input[name="zip_code"], html[dir="rtl"] code,
html[dir="rtl"] pre, html[dir="rtl"] .ltr { direction: ltr; text-align: right; }
html[dir="rtl"] input[type="email"]::placeholder, html[dir="rtl"] input[type="tel"]::placeholder { text-align: right; }
html[dir="rtl"] a[href^="tel:"], html[dir="rtl"] a[href^="mailto:"] { unicode-bidi: plaintext; }

/* Form controls */
html[dir="rtl"] .form-select { background-position: left 0.75rem center; padding-left: 2.25rem; padding-right: 0.75rem; }
html[dir="rtl"] .input-group > .form-control:not(:last-child) { border-radius: 0 0.375rem 0.375rem 0; }

/* Dropdowns open towards the inline end */
html[dir="rtl"] .dropdown-menu-end { --bs-position: start; }
html[dir="rtl"] .navbar-nav .dropdown-menu { text-align: right; }

/* Charts and maps are left-to-right widgets */
html[dir="rtl"] canvas, html[dir="rtl"] .map-container, html[dir="rtl"] #map { direction: ltr; }
