/* style-rtl.css | MyStay RTL Stylesheet | v20260620 | DO NOT CACHE */

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 1 — BASE DIRECTION
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 2 — ARABIC FONT
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] body,
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3,
[dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6,
[dir="rtl"] p, [dir="rtl"] a, [dir="rtl"] span,
[dir="rtl"] li, [dir="rtl"] label, [dir="rtl"] button,
[dir="rtl"] input, [dir="rtl"] select, [dir="rtl"] textarea {
    font-family: 'Cairo', 'Noto Sans Arabic', Arial, sans-serif;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 3 — BOOTSTRAP GRID RTL (replaces bootstrap.rtl.min.css)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Grid rows: reverse column visual order in RTL */
[dir="rtl"] .row {
    flex-direction: row-reverse;
}

/* Gutters: swap left/right */
[dir="rtl"] .row > * {
    padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    padding-left:  calc(var(--bs-gutter-x, 1.5rem) * 0.5);
}

/* Offset columns */
[dir="rtl"] .offset-1  { margin-right: 8.333333%;  margin-left: 0; }
[dir="rtl"] .offset-2  { margin-right: 16.666667%; margin-left: 0; }
[dir="rtl"] .offset-3  { margin-right: 25%;         margin-left: 0; }
[dir="rtl"] .offset-4  { margin-right: 33.333333%; margin-left: 0; }
[dir="rtl"] .offset-5  { margin-right: 41.666667%; margin-left: 0; }
[dir="rtl"] .offset-6  { margin-right: 50%;         margin-left: 0; }

/* Float utilities */
[dir="rtl"] .float-start { float: right !important; }
[dir="rtl"] .float-end   { float: left  !important; }

/* Text alignment utilities */
[dir="rtl"] .text-start  { text-align: right !important; }
[dir="rtl"] .text-end    { text-align: left  !important; }

/* Margin logical utilities */
[dir="rtl"] .ms-auto { margin-right: auto !important; margin-left: 0 !important; }
[dir="rtl"] .me-auto { margin-left: auto  !important; margin-right: 0 !important; }
[dir="rtl"] .ms-0    { margin-right: 0   !important; margin-left: unset !important; }
[dir="rtl"] .ms-1    { margin-right: 0.25rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-2    { margin-right: 0.5rem  !important; margin-left: 0 !important; }
[dir="rtl"] .ms-3    { margin-right: 1rem    !important; margin-left: 0 !important; }
[dir="rtl"] .ms-4    { margin-right: 1.5rem  !important; margin-left: 0 !important; }
[dir="rtl"] .ms-5    { margin-right: 3rem    !important; margin-left: 0 !important; }
[dir="rtl"] .me-0    { margin-left:  0   !important; margin-right: unset !important; }
[dir="rtl"] .me-1    { margin-left:  0.25rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-2    { margin-left:  0.5rem  !important; margin-right: 0 !important; }
[dir="rtl"] .me-3    { margin-left:  1rem    !important; margin-right: 0 !important; }
[dir="rtl"] .me-4    { margin-left:  1.5rem  !important; margin-right: 0 !important; }
[dir="rtl"] .me-5    { margin-left:  3rem    !important; margin-right: 0 !important; }

/* Padding logical utilities */
[dir="rtl"] .ps-0  { padding-right: 0      !important; padding-left: unset !important; }
[dir="rtl"] .ps-1  { padding-right: 0.25rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-2  { padding-right: 0.5rem  !important; padding-left: 0 !important; }
[dir="rtl"] .ps-3  { padding-right: 1rem    !important; padding-left: 0 !important; }
[dir="rtl"] .ps-4  { padding-right: 1.5rem  !important; padding-left: 0 !important; }
[dir="rtl"] .ps-5  { padding-right: 3rem    !important; padding-left: 0 !important; }
[dir="rtl"] .pe-0  { padding-left:  0      !important; padding-right: unset !important; }
[dir="rtl"] .pe-1  { padding-left:  0.25rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-2  { padding-left:  0.5rem  !important; padding-right: 0 !important; }
[dir="rtl"] .pe-3  { padding-left:  1rem    !important; padding-right: 0 !important; }
[dir="rtl"] .pe-4  { padding-left:  1.5rem  !important; padding-right: 0 !important; }
[dir="rtl"] .pe-5  { padding-left:  3rem    !important; padding-right: 0 !important; }

/* Border logical utilities */
[dir="rtl"] .border-start { border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; border-left: 0 !important; }
[dir="rtl"] .border-end   { border-left:  var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; border-right: 0 !important; }

/* Rounded corners */
[dir="rtl"] .rounded-start { border-radius: 0 0.375rem 0.375rem 0 !important; }
[dir="rtl"] .rounded-end   { border-radius: 0.375rem 0 0 0.375rem !important; }

/* Flexbox utilities */
[dir="rtl"] .flex-row         { flex-direction: row         !important; }
[dir="rtl"] .flex-row-reverse { flex-direction: row-reverse !important; }

/* Justify utilities — swap start/end */
[dir="rtl"] .justify-content-start { justify-content: flex-end   !important; }
[dir="rtl"] .justify-content-end   { justify-content: flex-start !important; }

/* Input group */
[dir="rtl"] .input-group > :not(:first-child):not(.dropdown-menu) {
    border-radius: 0.375rem 0 0 0.375rem;
}
[dir="rtl"] .input-group > :first-child {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* Form checks */
[dir="rtl"] .form-check {
    padding-right: 1.5em;
    padding-left: 0;
}
[dir="rtl"] .form-check-input {
    float: right;
    margin-right: -1.5em;
    margin-left: 0;
}

/* Breadcrumb divider */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-right: 0;
    padding-left: 0.5rem;
    content: "\\";
}

/* Dropdown menus */
[dir="rtl"] .dropdown-menu {
    text-align: right;
}
[dir="rtl"] .dropdown-menu-start {
    right: 0;
    left: auto;
}
[dir="rtl"] .dropdown-menu-end {
    left: 0;
    right: auto;
}

/* Navs / pills / tabs */
[dir="rtl"] .nav {
    padding-right: 0;
}

/* Modal */
[dir="rtl"] .modal-header {
    flex-direction: row-reverse;
}
[dir="rtl"] .modal-header .btn-close {
    margin-right: auto;
    margin-left: 0;
}
[dir="rtl"] .modal-footer {
    flex-direction: row-reverse;
}
[dir="rtl"] .modal-body,
[dir="rtl"] .modal-footer {
    text-align: right;
}
[dir="rtl"] .modal {
    position: fixed  !important;
    top:    0        !important;
    left:   0        !important;
    right:  0        !important;
    bottom: 0        !important;
    z-index: 1055    !important;
    overflow-x: hidden !important;
    overflow-y: auto   !important;
}
[dir="rtl"] .modal-backdrop {
    position: fixed  !important;
    top: 0 !important; left: 0 !important;
    width: 100vw !important; height: 100vh !important;
    z-index: 1050 !important;
}

/* Alerts */
[dir="rtl"] .alert {
    text-align: right;
}
[dir="rtl"] .alert-dismissible {
    padding-right: 1rem;
    padding-left:  3rem;
}
[dir="rtl"] .alert-dismissible .btn-close {
    right: auto;
    left: 0;
}

/* List groups */
[dir="rtl"] .list-group {
    padding-right: 0;
}

/* Tables */
[dir="rtl"] th,
[dir="rtl"] td {
    text-align: right;
}

/* Display utilities — restore Bootstrap 5 responsive display helpers under RTL
   so [dir="rtl"] scoping doesn't fight them */
[dir="rtl"] .d-none         { display: none         !important; }
[dir="rtl"] .d-block        { display: block        !important; }
[dir="rtl"] .d-inline-block { display: inline-block !important; }
[dir="rtl"] .d-flex         { display: flex         !important; }
[dir="rtl"] .d-inline-flex  { display: inline-flex  !important; }

@media (min-width: 576px) {
    [dir="rtl"] .d-sm-none         { display: none         !important; }
    [dir="rtl"] .d-sm-block        { display: block        !important; }
    [dir="rtl"] .d-sm-inline-block { display: inline-block !important; }
    [dir="rtl"] .d-sm-flex         { display: flex         !important; }
}
@media (max-width: 575.98px) {
    [dir="rtl"] .d-sm-none         { display: block        !important; }
    [dir="rtl"] .d-sm-inline-block { display: none         !important; }
}
@media (min-width: 768px) {
    [dir="rtl"] .d-md-none         { display: none         !important; }
    [dir="rtl"] .d-md-block        { display: block        !important; }
    [dir="rtl"] .d-md-inline-block { display: inline-block !important; }
    [dir="rtl"] .d-md-flex         { display: flex         !important; }
}
@media (max-width: 767.98px) {
    [dir="rtl"] .d-md-none         { display: block        !important; }
    [dir="rtl"] .d-md-inline-block { display: none         !important; }
}
@media (min-width: 992px) {
    [dir="rtl"] .d-lg-none         { display: none         !important; }
    [dir="rtl"] .d-lg-block        { display: block        !important; }
    [dir="rtl"] .d-lg-inline-block { display: inline-block !important; }
    [dir="rtl"] .d-lg-flex         { display: flex         !important; }
}
@media (max-width: 991.98px) {
    [dir="rtl"] .d-lg-none         { display: block        !important; }
    [dir="rtl"] .d-lg-inline-block { display: none         !important; }
}
@media (min-width: 1200px) {
    [dir="rtl"] .d-xl-none         { display: none         !important; }
    [dir="rtl"] .d-xl-block        { display: block        !important; }
    [dir="rtl"] .d-xl-inline-block { display: inline-block !important; }
    [dir="rtl"] .d-xl-flex         { display: flex         !important; }
    [dir="rtl"] .d-xl-inline-flex  { display: inline-flex  !important; }
}
@media (max-width: 1199.98px) {
    [dir="rtl"] .d-xl-none         { display: block        !important; }
    [dir="rtl"] .d-xl-inline-block { display: none         !important; }
}
@media (min-width: 1400px) {
    [dir="rtl"] .d-xxl-none        { display: none         !important; }
    [dir="rtl"] .d-xxl-block       { display: block        !important; }
    [dir="rtl"] .d-xxl-inline-block{ display: inline-block !important; }
    [dir="rtl"] .d-xxl-flex        { display: flex         !important; }
}
@media (max-width: 1399.98px) {
    [dir="rtl"] .d-xxl-none        { display: block        !important; }
    [dir="rtl"] .d-xxl-inline-block{ display: none         !important; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 4 — HEADER & NAVIGATION
   ═══════════════════════════════════════════════════════════════════════════ */

/* Top bar */
[dir="rtl"] .header-top .hdr-top-inner {
    display: flex !important;
    flex-direction: row-reverse !important;
    flex-wrap: nowrap !important;
    align-items: center;
}
[dir="rtl"] .header-top .hdr-contact-group {
    flex-direction: row-reverse;
}
[dir="rtl"] .header-top .hdr-right-group {
    margin-inline-end: auto !important;
    margin-inline-start: 0 !important;
    flex-direction: row-reverse;
    flex-shrink: 0;
}
[dir="rtl"] .header-top .hdr-right-group .header-links ul {
    flex-direction: row-reverse;
}

/* Main nav row: use nowrap to keep logo + nav + button on one line */
[dir="rtl"] .menu-area .row {
    flex-direction: row-reverse !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
}

/* Nav visibility at breakpoints */
@media (min-width: 1200px) {
    [dir="rtl"] .main-menu {
        display: inline-block !important;
        visibility: visible   !important;
        opacity: 1            !important;
    }
    [dir="rtl"] .hdr-hamburger { display: none  !important; }
    [dir="rtl"] .hdr-book-btn  { display: block !important; }
}
@media (max-width: 1199.98px) {
    [dir="rtl"] .main-menu     { display: none  !important; }
    [dir="rtl"] .hdr-hamburger { display: block !important; }
    [dir="rtl"] .hdr-book-btn  { display: none  !important; }
}

/* Sub-menu: anchor from right in RTL */
[dir="rtl"] .main-menu ul.sub-menu {
    left:  auto;
    right: 0;
    text-align: right;
}
[dir="rtl"] .main-menu > ul > li > ul.sub-menu {
    left:  auto;
    right: -14px;
}
[dir="rtl"] .main-menu ul.sub-menu li ul.sub-menu {
    left:  auto !important;
    right: 100%;
}
[dir="rtl"] .main-menu .menu-item-has-children > a::after {
    transform: rotate(90deg) scaleX(-1);
}

/* Mobile menu: slide from right */
[dir="rtl"] .th-menu-wrapper {
    left:  auto;
    right: 0;
    transform: translateX(100%);
}
[dir="rtl"] .th-menu-wrapper.th-body-visible {
    transform: translateX(0);
}
[dir="rtl"] .th-mean-expand {
    float: left;
}

/* Language switcher */
.lang-switcher {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    white-space: nowrap;
}
.lang-switcher a {
    padding: 2px 8px;
    border-radius: 3px;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    transition: background-color 0.2s, color 0.2s;
    border: 1px solid #ccc;
}
.lang-switcher a:hover           { background-color: #1ca8cb; color: #fff; border-color: #1ca8cb; }
.lang-switcher a.active-lang     { background-color: #113d48; color: #fff; border-color: #113d48; pointer-events: none; }

/* Mega-menu */
[dir="rtl"] ul.mega-menu,
[dir="rtl"] .mega-menu-wrap {
    left:  auto;
    right: 0;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 5 — HERO
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .hero-inner,
[dir="rtl"] .hero-content,
[dir="rtl"] .hero-content .hero-title,
[dir="rtl"] .hero-content .hero-subtitle,
[dir="rtl"] .hero-content p {
    text-align: right;
}
[dir="rtl"] .heroThumbs {
    right: auto !important;
    left:  0    !important;
    z-index: 1  !important;
}
[dir="rtl"] .hero-2 .th-swiper-custom {
    right: auto   !important;
    left:  209px  !important;
}
@media (max-width: 1299px) {
    [dir="rtl"] .hero-2 .th-swiper-custom {
        left:  20px !important;
        right: auto !important;
    }
}
[dir="rtl"] .hero-2 .scroll-down {
    z-index: 10  !important;
    left: calc(50% - 75px) !important;
    right: auto !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 6 — BREADCRUMB
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .breadcumb-content {
    text-align: right;
}
[dir="rtl"] .breadcumb-menu {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    padding-right: 0;
}
[dir="rtl"] .breadcumb-menu li + li::before {
    content: "/";
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 7 — CARDS: Hotels / Tours / Istirahas / Cafes
   ═══════════════════════════════════════════════════════════════════════════
   The .row Bootstrap grid correctly reverses column order in RTL.
   But card-INTERNAL rows (used inside .destination-item, .tour-box etc.)
   must NOT be reversed — they use .row for layout helpers, not column grids.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Card internal rows: keep normal direction */
[dir="rtl"] .destination-item .row,
[dir="rtl"] .tour-box .row,
[dir="rtl"] .cafe-card .row,
[dir="rtl"] .card .row,
[dir="rtl"] .th-team .row,
[dir="rtl"] .team-box .row,
[dir="rtl"] .destination-content .row,
[dir="rtl"] .tour-content .row,
[dir="rtl"] .widget .row,
[dir="rtl"] .sidebar-area .row {
    flex-direction: row !important;
}

/* Card text alignment */
[dir="rtl"] .destination-item,
[dir="rtl"] .destination-item .destination-content,
[dir="rtl"] .destination-item .box-title,
[dir="rtl"] .destination-item .destination-text {
    text-align: right;
}
[dir="rtl"] .tour-box,
[dir="rtl"] .tour-content,
[dir="rtl"] .tour-content .box-title {
    text-align: right;
}
[dir="rtl"] .cafe-card .card-body,
[dir="rtl"] .cafe-card .card-title,
[dir="rtl"] .cafe-card .card-text {
    text-align: right;
}

/* Destination item2/3/4 overlays */
[dir="rtl"] .destination-item2 .box-content {
    left:  auto;
    right: 34px;
}
[dir="rtl"] .destination-item3 .box-content,
[dir="rtl"] .destination-item4 .box-content {
    left:  auto;
    right: 34px;
}

/* Featured / offer badges */
[dir="rtl"] .destination-item .badge,
[dir="rtl"] .tour-box .tour-badge {
    left:  auto;
    right: 15px;
}

/* Star ratings: always LTR fill direction */
[dir="rtl"] .star-rating,
[dir="rtl"] .ratting,
[dir="rtl"] .review-stars {
    direction: ltr;
    display: inline-flex;
    justify-content: flex-end;
}

/* Tour action bar */
[dir="rtl"] .tour-action {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    text-align: right;
}
[dir="rtl"] .tour-action span,
[dir="rtl"] .tour-action a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Destination meta (istirahas: category badge + stars inline) */
[dir="rtl"] .destination-meta {
    text-align: right;
}

/* Cafe listing: float-end rating stars */
[dir="rtl"] .cafe-card .float-end {
    float: left !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 8 — TRIPS PAGE (search bar, sidebar, sort bar)
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .th-sort-bar .row {
    flex-direction: row-reverse !important;
}
[dir="rtl"] .sorting-filter-wrap {
    flex-direction: row-reverse !important;
}
[dir="rtl"] .sorting-filter-wrap .nav {
    flex-direction: row-reverse !important;
}
[dir="rtl"] .search-form {
    flex-direction: row-reverse;
}
[dir="rtl"] .search-form input {
    text-align: right;
    direction: rtl;
}
[dir="rtl"] .sidebar-area .widget_title { text-align: right; }
[dir="rtl"] .sidebar-area ul           { padding-right: 0; text-align: right; }
[dir="rtl"] .sidebar-area .booking-form .row { flex-direction: row !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 9 — CAFES FILTER
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .filter-section .row { flex-direction: row-reverse !important; }
[dir="rtl"] .filter-section label  { text-align: right !important; display: block !important; }
[dir="rtl"] .filter-section select,
[dir="rtl"] .filter-section input  { text-align: right !important; direction: rtl !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 10 — TITLE AREAS, SECTIONS
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .sec-title,
[dir="rtl"] .sec-title2,
[dir="rtl"] .sec-subtitle,
[dir="rtl"] .widget_title,
[dir="rtl"] .title-area {
    text-align: right;
}
/* But keep text-center sections centered */
[dir="rtl"] .title-area.text-center,
[dir="rtl"] .text-center .sec-title,
[dir="rtl"] .text-center .sub-title {
    text-align: center !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 11 — BOOKING FORMS
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .booking-form .form-group {
    text-align: right;
}
[dir="rtl"] .booking-form.style2 .form-group:not(:first-child) {
    border-right: 1px solid rgba(0,0,0,.1);
    border-left: none;
    padding-right: 12px;
}
[dir="rtl"] .booking-form label { text-align: right; display: block; }
[dir="rtl"] .booking-form input,
[dir="rtl"] .booking-form select,
[dir="rtl"] .booking-form textarea {
    text-align: right;
    direction: rtl;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 12 — COUNTER CIRCLES
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .counter-card {
    text-align: center;
}
[dir="rtl"] .counter-card .box-number {
    direction: ltr; /* keep "19k" LTR */
}
[dir="rtl"] .counter-sec2 .row {
    display: flex !important;
    flex-direction: row-reverse !important;
    flex-wrap: wrap !important;
    justify-content: center;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 13 — FOOTER
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .footer-wrapper .widget-area > .container > .row {
    display: flex !important;
    flex-direction: row-reverse !important;
    flex-wrap: wrap !important;
}
[dir="rtl"] .copyright-wrap .row {
    display: flex !important;
    flex-direction: row-reverse !important;
    flex-wrap: nowrap !important;
}
[dir="rtl"] .copyright-wrap .col-md-6 { flex: 0 0 50%; max-width: 50%; }
[dir="rtl"] .widget_title             { text-align: right; }
[dir="rtl"] .footer-widget             { text-align: right; }
[dir="rtl"] .footer-widget ul          { padding-right: 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 14 — NEWSLETTER
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .newsletter-form {
    display: flex !important;
    flex-direction: row-reverse !important;
    gap: 16px !important;
    max-width: 660px !important;
    margin-right: auto !important;
    margin-left: 0 !important;
    align-items: stretch;
}
[dir="rtl"] .newsletter-form input.form-control {
    flex: 1 1 auto !important;
    text-align: right !important;
    direction: rtl !important;
    border-radius: 32px 4px 4px 32px !important;
}
[dir="rtl"] .newsletter-form .th-btn,
[dir="rtl"] .newsletter-form button[type="submit"] {
    flex-shrink: 0 !important;
    border-radius: 4px 32px 32px 4px !important;
    min-width: 180px !important;
    white-space: nowrap !important;
}
@media (max-width: 480px) {
    [dir="rtl"] .newsletter-form {
        flex-direction: column !important;
    }
    [dir="rtl"] .newsletter-form input.form-control,
    [dir="rtl"] .newsletter-form .th-btn,
    [dir="rtl"] .newsletter-form button[type="submit"] {
        border-radius: 32px !important;
        width: 100% !important;
        min-width: unset !important;
    }
}
[dir="rtl"] .newsletter-title { text-align: right !important; }
@media (max-width: 991px) {
    [dir="rtl"] .newsletter-title { text-align: center !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 15 — SWIPER / SLIDERS
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .swiper-button-prev { right: auto; left:  10px; }
[dir="rtl"] .swiper-button-next { left:  auto; right: 10px; }

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 16 — MODALS (login / booking / reset password)
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .popup-login-register { text-align: right; }
[dir="rtl"] .mfp-hide { display: none !important; }

/* Password toggle eye: flip to left side of input in RTL */
[dir="rtl"] .password-toggle {
    right: auto !important;
    left: 12px  !important;
}
[dir="rtl"] .password-input {
    padding-right: 12px !important;
    padding-left:  45px !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 17 — INFO BOX (contact / about page icon+text pairs)
   ═══════════════════════════════════════════════════════════════════════════ */

[dir="rtl"] .info-box_text {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}
[dir="rtl"] .info-box_text .icon    { flex-shrink: 0; }
[dir="rtl"] .info-box_text .details { text-align: right; }

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 18 — MISC
   ═══════════════════════════════════════════════════════════════════════════ */

/* Icon spacing via inline-end instead of margin-left/right */
[dir="rtl"] .fa-solid + span,
[dir="rtl"] .fa-regular + span,
[dir="rtl"] .fa-light + span {
    margin-right: 6px;
    margin-left: 0;
}

/* Price / numeric values: always LTR */
[dir="rtl"] .faq-price,
[dir="rtl"] .price-display,
[dir="rtl"] .box-number {
    direction: ltr;
    display: inline-flex;
    gap: 4px;
}

/* Tables */
[dir="rtl"] th, [dir="rtl"] td { text-align: right; }
[dir="rtl"] td.price-cell,
[dir="rtl"] td.date-cell,
[dir="rtl"] td.id-cell { direction: ltr; text-align: left; }

/* Dashboard panels */
[dir="rtl"] .owner-dashboard,
[dir="rtl"] .user-dashboard { text-align: right; }
[dir="rtl"] .booking-table th,
[dir="rtl"] .booking-table td { text-align: right; }
[dir="rtl"] .booking-table td.amount,
[dir="rtl"] .booking-table td.id,
[dir="rtl"] .booking-table td.date { direction: ltr; text-align: left; }

/* Accordion arrows */
[dir="rtl"] .accordion-button.collapsed .fa-angle-down  { transform: rotate(0deg)   !important; }
[dir="rtl"] .accordion-button:not(.collapsed) .fa-angle-down { transform: rotate(180deg) !important; }

/* Food section (not yet translated — keep English titles centered) */
[dir="rtl"] .team-content { text-align: right; }
[dir="rtl"] .team-content .box-title { text-align: right; }

/* Mobile responsive */
@media (max-width: 767px) {
    [dir="rtl"] .hero-content { text-align: right; }
    [dir="rtl"] .footer-bottom .copyright-wrap { text-align: center; }
}
@media (max-width: 991px) {
    [dir="rtl"] .main-menu ul.sub-menu { right: 0; left: auto; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   NAV + FOOTER LINK FIXES (final targeted patch)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── NAV: middle col-auto must flex-grow so the nav items are visible ────── */
/* In RTL with justify-content-between + 3 col-auto items, the middle column
   gets zero natural width and the nav vanishes. Give it flex:1 to grow. */
[dir="rtl"] .menu-area .row {
    flex-wrap: nowrap !important;
}
[dir="rtl"] .menu-area .row > .col-auto:nth-child(2) {
    flex: 1 1 auto    !important;
    display: flex     !important;
    justify-content: center !important;
    align-items: center     !important;
    overflow: visible !important;
    min-width: 0      !important;
}
[dir="rtl"] .menu-area .main-menu {
    display: inline-block !important;
    visibility: visible   !important;
    opacity: 1            !important;
    white-space: nowrap   !important;
}
@media (max-width: 1199.98px) {
    [dir="rtl"] .menu-area .row > .col-auto:nth-child(2) {
        flex: 0 0 auto !important;
    }
    [dir="rtl"] .menu-area .main-menu {
        display: none !important;
    }
}

/* ── FOOTER QUICK LINKS: flip the > chevron to < and move to right in RTL ── */
/*
   LTR: [>] [Home]    — ::before at left:0,  padding-left:20px, content:"\f105" (>)
   RTL: [الرئيسية] [<] — ::before at right:0, padding-right:20px, content:"\f104" (<)
   The icon moves to the END of the line (right side is the start in RTL layout).
*/
[dir="rtl"] .footer-widget.widget_nav_menu a,
[dir="rtl"] .footer-widget.widget_meta a,
[dir="rtl"] .footer-widget.widget_pages a,
[dir="rtl"] .widget_nav_menu a,
[dir="rtl"] .widget_meta a,
[dir="rtl"] .widget_pages a {
    padding-left:  0    !important;
    padding-right: 20px !important;
    text-align: right   !important;
}
/* Flip the ::before chevron: right-facing (>) → left-facing (<), anchor to right */
[dir="rtl"] .footer-widget.widget_nav_menu a::before,
[dir="rtl"] .footer-widget.widget_meta a::before,
[dir="rtl"] .footer-widget.widget_pages a::before,
[dir="rtl"] .widget_nav_menu a::before,
[dir="rtl"] .widget_meta a::before,
[dir="rtl"] .widget_pages a::before {
    content: "\f104" !important;  /* fa-angle-left < */
    left:  auto  !important;
    right: 0     !important;
}
/* li > span (item count badge): was right:0 → now left:0 */
[dir="rtl"] .widget_nav_menu li > span,
[dir="rtl"] .widget_meta li > span,
[dir="rtl"] .widget_pages li > span {
    right: auto  !important;
    left:  0     !important;
    text-align: left !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SCROLL-TO-TOP + WHATSAPP BUTTON FIX (RTL)
   ═══════════════════════════════════════════════════════════════════════════
   In LTR:
     .scroll-top  → right: 30px, bottom: 30px  (bottom-right)
     .whatsapp-chat → left: 20px, bottom: 20px  (bottom-left)
   In RTL:
     .whatsapp-chat stays bottom-left (left: 20px) — no change needed
     .scroll-top must move to LEFT side so it doesn't overlap WhatsApp:
     We flip it to left: 30px in RTL so both buttons are on the left
     but vertically stacked (scroll-top slightly higher: bottom: 80px)
   ─────────────────────────────────────────────────────────────────────── */
[dir="rtl"] .scroll-top {
    right: auto !important;
    left: 30px  !important;
    bottom: 80px !important;  /* sit above the WhatsApp button */
}