/* =============================================================
   FRONT CUSTOM UI — RTL OVERRIDES
   Loaded only when an RTL language (ar, he, ur, etc.) is active.
   Each rule mirrors the directional property from front-custom-ui.css
   ============================================================= */

/* ── Home hero slider (fade mode, rtl:false — must float left) */
/* Slick CSS sets [dir=rtl] .slick-slide { float:right } globally,
   but our fade slider uses rtl:false so JS expects float:left. */
[dir="rtl"] .home-main-slider .slick-slide {
    float: left;
}

/* ── Find Friends banner ──────────────────────────────────── */
.ff-images-grid {
    right: auto;
    left: 50px;
}

.ff-content {
    text-align: right;
    margin-right: 0;
    margin-left: auto;
}

.ff-btn {
    flex-direction: row-reverse;
}

/* ── Quiz cards content ───────────────────────────────────── */
.quiz-content {
    text-align: right;
}

.quiz-info-item {
    text-align: right;
}

.quiz-fee-container {
    align-items: flex-start;
}

.quiz-bookmark-btn {
    right: 15px;
    left: auto;
}

/* ── Discover section header ──────────────────────────────── */
.discover-see-all i {
    margin-right: 6px;
    margin-left: 0;
}

/* ── Category card ────────────────────────────────────────── */
.category-see-more {
    flex-direction: row-reverse;
}

/* ── Testimonials ─────────────────────────────────────────── */
.testimonial-quote-icon {
    right: auto;
    left: 20px;
}

/* ── Blog meta icons ──────────────────────────────────────── */
.blog-meta-list {
    flex-direction: row-reverse;
}

.blog-meta-list li {
    flex-direction: row-reverse;
}

/* ── Quiz cards (legacy meta classes) ────────────────────── */
.quiz-meta,
.quiz-card-meta {
    flex-direction: row-reverse;
}

/* ── Footer ───────────────────────────────────────────────── */
.footer-widget-title::after {
    left: auto;
    right: 0;
}

.footer-widget-title {
    text-align: right;
}

.contact-list li {
    flex-direction: row-reverse;
    text-align: right;
}

.contact-list li i {
    margin-right: 0;
    margin-left: 15px;
}

/* ── Stat cards ───────────────────────────────────────────── */
.stat-details {
    text-align: right;
}

.stat-card {
    flex-direction: row-reverse;
}

/* ── Dashboard nav tabs ───────────────────────────────────── */
.custom-dashboard-ui .nav-tabs .nav-link {
    flex-direction: row-reverse;
    text-align: right;
}

.custom-dashboard-ui .nav-tabs .nav-link i {
    margin-right: 0;
    margin-left: 8px;
}

/* ── Sidebar & user profile ───────────────────────────────── */
.custom-dashboard-ui .user-profile {
    flex-direction: row-reverse;
    text-align: right;
}

.custom-dashboard-ui .user-img {
    margin-right: 0;
    margin-left: 15px;
}

/* ── Discover list ────────────────────────────────────────── */
.custom-dashboard-ui .discover-lst li {
    text-align: right;
}

/* ── Battle / quiz form ───────────────────────────────────── */
.battle-form-group {
    text-align: right;
}

.battle-label {
    text-align: right;
}

/* ── Search results dropdown ──────────────────────────────── */
#search-results {
    left: auto;
    right: 0;
    text-align: right;
}

/* ── Card / list icon spacing (generic) ──────────────────── */
.card-icon-left {
    margin-right: 0;
    margin-left: 10px;
}

.list-icon {
    margin-right: 0;
    margin-left: 8px;
}

/* ── Section headings with left-anchored decorations ─────── */
.section-title::before,
.section-title::after {
    left: auto;
    right: 0;
}

/* ── Slick carousel arrows ────────────────────────────────── */
.slick-prev {
    left: auto;
    right: -25px;
}

.slick-next {
    right: auto;
    left: -25px;
}

/* ── Progress bars ────────────────────────────────────────── */
.progress-bar {
    float: right;
}

/* ── Notification / alert icons ──────────────────────────── */
.alert-icon {
    margin-right: 0;
    margin-left: 12px;
}

/* ── List items with inline icons ────────────────────────── */
.list-item-icon {
    margin-right: 0;
    margin-left: 8px;
}

/* ── Quiz card category label (absolute top-left → top-right) */
.quiz-category-label {
    left: auto;
    right: 10px;
}

/* ── Leaderboard rank badge ───────────────────────────────── */
.rank-badge {
    margin-right: 0;
    margin-left: 10px;
}

/* ── Blog card image overlay text ────────────────────────── */
.blog-overlay-text {
    text-align: right;
}

/* ── Newsletter section ───────────────────────────────────── */
.newsletter-form {
    flex-direction: row-reverse;
}

.newsletter-input {
    border-radius: 0 30px 30px 0;
}

.newsletter-btn {
    border-radius: 30px 0 0 30px;
}
