/**
 * RTL Overrides for Arabic (time-ar theme)
 *
 * Mirrors all LTR-specific properties:
 *   - left/right positioning
 *   - margin-left/right, padding-left/right
 *   - text-align
 *   - flexbox direction
 *   - border-left/right
 *   - transform (arrows, icons)
 *   - background-position for directional icons
 */

/* =========================== Font: Noto Sans Arabic loaded via wp_enqueue_style in functions.php */

body {
    font-family: "Noto Sans Arabic", "Work Sans", sans-serif;
    direction: rtl;
    text-align: right;
}

/* =========================== General text direction */
p, a, li, span, div, td, th, h1, h2, h3, h4, h5, h6,
address, time, label, input, textarea, button, summary {
    text-align: right;
}

/* =========================== Lists */
ol:not([class]) li, ul:not([class]) li {
    padding-left: 0;
    padding-right: 42px;
}
ol:not([class]) li::before, ul:not([class]) li::before {
    left: auto;
    right: 0;
}

ul:not([class]) li::before {
    left: auto;
    right: 0;
}

.list-best li {
    padding-left: 0;
    padding-right: 42px;
}
.list-best li::before {
    left: auto;
    right: 0;
}

.list-check li, .list-not li {
    padding-left: 0;
    padding-right: 26px;
}
.list-check li::before, .list-not li::before {
    left: auto;
    right: 0;
}

/* =========================== Buttons */
.btn-span {
    padding-right: 0;
    padding-left: 20px;
}
.btn-span::before {
    right: auto;
    left: 0;
    transform: scaleX(-1);
}

/* =========================== Scroll to top */
.btn-up {
    right: auto;
    left: 30px;
}

/* =========================== Breadcrumbs */
.breadcrumbs__item:not(:last-child) {
    margin-right: 0;
    margin-left: 14px;
}
.breadcrumbs-link::after {
    right: auto;
    left: auto;
    margin-left: 0;
    margin-right: 0;
    right: -9px;
    left: auto;
    transform: scaleX(-1);
}

/* =========================== Social icons */
.soc {
    justify-content: flex-end;
}

/* =========================== Header */
.header_top {
    direction: rtl;
}

/* =========================== Navigation */
@media screen and (min-width: 1200px) {
    .menu-arr .menu-link {
        padding-right: 0;
        padding-left: 17px;
    }
    .menu-arr .menu-link::before {
        right: auto;
        left: 0;
    }
    .menu-link::after {
        left: auto;
        right: 0;
    }
    .menu__item:last-child .downmenu {
        left: 0;
        right: auto;
    }
}

@media screen and (max-width: 1200px) {
    .navigation {
        left: auto;
        right: 0;
    }
    .navigation .close {
        right: auto;
        left: -40px;
    }
    .navigation .logo img {
        margin: 0;
    }
    .menu-btn {
        margin-left: 0;
        margin-right: auto;
    }
}

@media screen and (min-width: 1200px) {
    .downmenu {
        left: auto;
        right: calc(50% - 111px);
    }
}

/* =========================== Hamburger - flip for RTL */
.hamburger {
    order: -1;
}

/* =========================== Update (author/date) */
.update.flexbox {
    justify-content: flex-start;
}
.update__item:not(:first-child)::before {
    left: auto;
    right: -14px;
}
@media screen and (max-width: 700px) {
    .update__item {
        padding-left: 0;
        padding-right: 14px;
    }
    .update__item:first-child::before {
        left: auto;
        right: 0;
    }
    .update__item:not(:first-child)::before {
        left: auto;
        right: 0;
    }
}

/* =========================== Offer Table */
.offer-th {
    text-align: center;
}

.offer-td.offer-logo::before {
    left: auto;
    right: 8px;
}

.offer-bonus-text {
    padding-left: 0;
    padding-right: 26px;
}
.offer-bonus-text::before {
    left: auto;
    right: 0;
}

.offer-td.offer-bonus, .offer-td.offer-feature, .offer-td.offer-rating {
    border-right: none;
    border-left: 1px solid rgba(0, 0, 0, 0.15);
    padding-left: 20px;
    padding-right: 20px;
}

.offer-list:not(.gridbox) .offer-rating {
    padding-right: 0;
    padding-left: 20px;
}

.offer-play {
    padding-left: 0;
    padding-right: 20px;
}

.offer-update-time {
    margin-left: 0;
    margin-right: 5px;
}
.offer-update time {
    padding-left: 0;
    padding-right: 20px;
}
.offer-update time::before {
    left: auto;
    right: 0;
}

.offer-list:not(.gridbox) .offer-card:nth-child(1) .offer-bonus::before,
.offer-list:not(.gridbox) .offer-card:nth-child(2) .offer-bonus::before {
    left: auto;
    right: 0;
}

.offer-feature .list-check li {
    padding-left: 0;
    padding-right: 24px;
}
.offer-feature .list-check li::before {
    left: auto;
    right: 0;
}

@media screen and (max-width: 992px) {
    .offer-td.offer-feature {
        border-right: none;
        border-left: none;
    }
    .offer-td.offer-bonus {
        border-right: none;
        border-left: none;
    }
}

@media screen and (max-width: 600px) {
    .offer:not(.gridbox) .offer-card:nth-child(1) .offer-bonus::before,
    .offer:not(.gridbox) .offer-card:nth-child(2) .offer-bonus::before {
        left: 0;
        right: auto;
        border-radius: 0 0 5px 9px;
    }
    .offer-td.offer-bonus {
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 450px) {
    .offer-list:not(.gridbox) .offer-rating {
        padding-right: 0;
        padding-left: 0;
    }
    .offer-play {
        padding-right: 0;
        padding-left: 0;
    }
    .offer-td.offer-rating {
        border-right: none;
        border-left: none;
    }
}

/* =========================== Side (Pros/Cons) */
.side-header {
    text-align: right;
}

/* =========================== Blockquote */
.blockquote::before {
    left: auto;
    right: 31px;
}
.blockquote::after {
    right: auto;
    left: 31px;
}
@media screen and (max-width: 768px) {
    .blockquote .cite {
        text-align: right;
    }
}

/* =========================== FAQ */
.faq-heading svg {
    margin-left: 0;
    margin-right: auto;
}

/* =========================== Note / Related Articles */
.note-time {
    padding-left: 0;
    padding-right: 28px;
}
.note-time::before {
    left: auto;
    right: 0;
}

@media screen and (min-width: 992px) {
    .note__item .img {
        margin: 0;
    }
}

/* =========================== Footer */
.footer-info .logo img {
    margin: 0;
    margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
    .footer-info .logo img {
        margin-inline: auto;
        margin-bottom: 15px;
    }
}

.contact__item::before {
    margin-right: 0;
    margin-left: 5px;
}

.reliable {
    justify-content: flex-end;
}
@media screen and (max-width: 768px) {
    .reliable {
        justify-content: center;
    }
}

/* =========================== Banner */
.banner .close {
    right: auto;
    left: 15px;
}
.banner-logo {
    border-right: none;
    border-left: 1px solid rgba(255, 255, 255, 0.15);
    padding-right: 0;
    padding-left: 20px;
}
.banner-bonus {
    border-right: none;
    border-left: 1px solid rgba(255, 255, 255, 0.15);
}
.banner-bonus-text {
    padding-left: 0;
    padding-right: 28px;
}
.banner-bonus-text::before {
    left: auto;
    right: 0;
}
.banner-play {
    padding-left: 0;
    padding-right: 20px;
}
@media screen and (max-width: 768px) {
    .banner-logo {
        border-left: none;
        padding-left: 0;
    }
    .banner-bonus {
        border-left: none;
    }
    .banner-bonus-text {
        padding-right: 0;
    }
    .banner-play {
        padding-right: 0;
    }
}

/* =========================== Bonus popup */
.bonus .close {
    right: auto;
    left: 25px;
}
.bonus-btn::before {
    left: auto;
    right: -5px;
}
@media screen and (max-width: 768px) {
    .bonus-body .close {
        right: auto;
        left: 15px;
    }
    .bonus-btn::before {
        left: auto;
        right: -10px;
    }
}

/* =========================== Bonus button (header) */
.bonus-btn {
    text-align: right;
}

/* =========================== Form */
.form-input::before {
    left: auto;
    right: 12px;
}
.form input {
    padding-left: 0;
    padding-right: 38px;
}

/* =========================== Table (generic) */
.table th, .table td {
    text-align: right;
}

/* =========================== Misc images - center by default is fine */
img {
    display: block;
    margin: 0 auto;
}