/* Homepage hero (banner-1 + banner-4): mirror vs English.
   English uses background-position: right on .banner.banner-1 .banner-inner (assets/website/css).
   Arabic anchors the image from the left so the bowl / focal area swaps sides.
   With dir=rtl, justify-content:flex-start places the copy on inline-start = physical right. */

.arabic-lang .banner.banner-1.banner-4 .banner-inner {
  background-position: left center;
}

.arabic-lang .banner.banner-4 .banner-inner > .container {
  display: flex;
  justify-content: flex-start;
}

/* Column flex: cross-start = inline-start = physical right in RTL — lines up CTA with right-aligned text */
.arabic-lang .banner.banner-4 .banner-inner > .container > .d-flex.flex-column {
  align-items: flex-start;
  width: 100%;
  max-width: 615px;
}

.arabic-lang .banner.banner-4 .banner-inner > .container > .d-flex.flex-column > .d-flex.flex-column.gap20px {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 615px;
}

.arabic-lang .banner.banner-4 .banner-inner .title,
.arabic-lang .banner.banner-4 .banner-inner .subtitle {
  text-align: right;
  width: 100%;
}

.arabic-lang .banner.banner-4 .banner-inner > .container > .d-flex.flex-column > a.btn-custom {
  display: inline-block;
  width: 240px;
  max-width: 100%;
}

.arabic-lang .banner.banner-4 .btn-custom .fa-caret-right {
  display: inline-block;
  transform: scaleX(-1);
}

.arabic-lang .owl-wrapper {
  direction: ltr;
}

body.arabic-lang.cart-open .cart-sidebar {
  left: 0 !important;
  right: unset !important;
}

.arabic-lang .slick-slider {
  direction: ltr;
}

/*
 * Kasheer hero + community carousels use LTR flex + negative translate3d.
 * Under dir=rtl the flex main-start flips and the track goes blank — same
 * issue owl/slick already work around above. Keep the track LTR for motion,
 * then restore RTL on the slide/card copy so Arabic text still reads correctly.
 */
[dir="rtl"] .ir-hero-slider,
[dir="rtl"] .ir-hero-slider__track,
.arabic-lang .ir-hero-slider,
.arabic-lang .ir-hero-slider__track,
[dir="rtl"] .ir-community__track,
.arabic-lang .ir-community__track,
[dir="rtl"] .ir-menu-slider,
[dir="rtl"] .ir-menu-slider__track,
.arabic-lang .ir-menu-slider,
.arabic-lang .ir-menu-slider__track {
  direction: ltr;
}

[dir="rtl"] .ir-hero-slide__content,
.arabic-lang .ir-hero-slide__content,
[dir="rtl"] .ir-community-card,
.arabic-lang .ir-community-card,
[dir="rtl"] .ir-menu-slider .ir-menu-card,
.arabic-lang .ir-menu-slider .ir-menu-card {
  direction: rtl;
}

/* Online menu category slider: restore ← on left, → on right in RTL */
.arabic-lang .menu_page .section-title-wrap > .d-flex.gap-3,
[dir="rtl"] .menu_page .section-title-wrap > .d-flex.gap-3 {
  flex-direction: row-reverse;
}

.arabic-lang .menu_page .menu-category-slider.slick-slider,
[dir="rtl"] .menu_page .menu-category-slider.slick-slider {
  direction: rtl;
}

/* Footer menu columns: align links under headings in RTL (match معلومات column) */
[dir="rtl"] .ct-footer .footer-middle .footer-menu-column,
.arabic-lang .ct-footer .footer-middle .footer-menu-column {
  align-items: flex-start !important;
  text-align: right !important;
}

[dir="rtl"] .ct-footer .footer-middle .footer-menu-column .widget-title,
.arabic-lang .ct-footer .footer-middle .footer-menu-column .widget-title {
  text-align: right !important;
  width: 100%;
}

[dir="rtl"] .ct-footer .footer-middle .footer-menu-column ul,
.arabic-lang .ct-footer .footer-middle .footer-menu-column ul {
  align-items: flex-start;
  padding-right: 0;
  padding-left: 0;
  text-align: right !important;
}

[dir="rtl"] .ct-footer .footer-middle .footer-menu-column ul li,
[dir="rtl"] .ct-footer .footer-middle .footer-menu-column ul li a,
.arabic-lang .ct-footer .footer-middle .footer-menu-column ul li,
.arabic-lang .ct-footer .footer-middle .footer-menu-column ul li a {
  text-align: right !important;
  transform: none !important;
  width: 100%;
}

/* Arabic-capable type + kill Latin-tuned negative letter-spacing that collapses Arabic shaping.
   Tajawal is first (trial); Cairo kept next so we can drop Tajawal and restore the old look. */
body.ir-tenant-theme.arabic-lang {
  --ir-font-heading: var(--kasheer-arabic-font, 'Tajawal', 'Cairo', 'Segoe UI', Tahoma, sans-serif);
  --ir-font-nav: var(--kasheer-arabic-font, 'Tajawal', 'Cairo', 'Segoe UI', Tahoma, sans-serif);
  --ir-font-body: var(--kasheer-arabic-font, 'Tajawal', 'Cairo', 'DM Sans', 'Segoe UI', Tahoma, sans-serif);
  --ir-ls-nav: 0;
  --ir-ls-btn: 0;
  --ir-ls-section: 0;
  --ir-ls-body-tight: 0;
  --ir-ls-stat-num: 0;
  --ir-ls-stat-label: 0;
  --ir-ls-card-title: 0;
  --ir-ls-footer-title: 0;
  --ir-ls-footer-body: 0;
}

body.ir-tenant-theme.arabic-lang .ir-hero__title,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-score,
body.ir-tenant-theme.arabic-lang .ir-hero__cta .ir-btn--hero-primary,
body.ir-tenant-theme.arabic-lang .ir-hero__cta .ir-btn--hero-ghost,
body.ir-tenant-theme.arabic-lang .ir-about__eyebrow,
body.ir-tenant-theme.arabic-lang .ir-about__title,
body.ir-tenant-theme.arabic-lang .ir-section-title,
body.ir-tenant-theme.arabic-lang .ir-community-card__quote,
body.ir-tenant-theme.arabic-lang .ir-community-card__name {
  letter-spacing: 0;
}

/* About stats bar: English Boldonse looks heavy at 400; Cairo needs a real bold */
body.ir-tenant-theme.arabic-lang .ir-stat__num,
body.ir-tenant-theme.arabic-lang .ir-stat__label {
  font-weight: 700;
}

body.ir-tenant-theme.arabic-lang .ir-stat__desc {
  font-weight: 600;
}

/* Mirror hero content inset under RTL (physical padding does not flip with dir) */
body.ir-tenant-theme.arabic-lang .ir-hero-block .container {
  padding-left: clamp(
    calc(20px * var(--ir-hero-scale)),
    calc(27.08vw * var(--ir-hero-scale)),
    calc(520px * var(--ir-hero-scale))
  );
  padding-right: clamp(
    calc(20px * var(--ir-hero-scale)),
    calc(9.375vw * var(--ir-hero-scale)),
    calc(180px * var(--ir-hero-scale))
  );
}

/*
 * Horizontally mirror hero / slide backgrounds in Arabic only.
 * English keeps food on the right; Arabic flips so the open side faces
 * the RTL text block (copy itself is not flipped — only ::before bg).
 */
body.ir-tenant-theme.arabic-lang .ir-hero-slide::before,
[dir="rtl"] body.ir-tenant-theme .ir-hero-slide::before {
  transform: scaleX(-1) scale(1);
  transform-origin: center center;
}

body.ir-tenant-theme.arabic-lang .ir-hero-slider--zoom .ir-hero-slide.is-active::before,
[dir="rtl"] body.ir-tenant-theme .ir-hero-slider--zoom .ir-hero-slide.is-active::before {
  transform: scaleX(-1) scale(1.08);
}

body.ir-tenant-theme.arabic-lang .ir-hero__title,
body.ir-tenant-theme.arabic-lang .ir-hero__subtitle,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-label,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-brand {
  text-align: right;
}

body.ir-tenant-theme.arabic-lang .ir-hero__rating-layer,
[dir="rtl"] body.ir-tenant-theme .ir-hero__rating-layer {
  left: var(--ir-hero-rating-inset, 24px);
  right: auto;
}

body.ir-tenant-theme.arabic-lang .ir-hero__rating,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-head,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-people,
body.ir-tenant-theme.arabic-lang .ir-hero__rating-meta {
  align-items: flex-start;
}

/* Arabic hero description: Cairo needs more air and a clearer weight */
body.ir-tenant-theme.arabic-lang .ir-hero__subtitle {
  font-size: calc(19px * var(--ir-hero-scale));
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0;
  max-width: calc(460px * var(--ir-hero-scale));
  color: rgba(255, 255, 255, 0.95);
}

body.ir-tenant-theme.arabic-lang .ir-btn__arrow--hero {
  transform: scaleX(-1);
}

body.ir-tenant-theme.arabic-lang .ir-greviews__title,
body.ir-tenant-theme.arabic-lang .ir-greviews__subtitle {
  letter-spacing: 0;
}

body.ir-tenant-theme.arabic-lang .ir-greviews__score-meta {
  align-items: flex-end;
}

@media (max-width: 991px) {
  body.ir-tenant-theme.arabic-lang .ir-hero__rating-layer,
  [dir="rtl"] body.ir-tenant-theme .ir-hero__rating-layer {
    left: 16px;
    right: auto;
  }

  body.ir-tenant-theme.arabic-lang .ir-hero-block .container {
    padding-left: 24px;
    padding-right: 24px;
  }

  body.ir-tenant-theme.arabic-lang .ir-hero__subtitle {
    max-width: 100%;
    font-size: 15px;
  }
}

@media (max-width: 575px) {
  body.ir-tenant-theme.arabic-lang .ir-hero__rating-layer,
  [dir="rtl"] body.ir-tenant-theme .ir-hero__rating-layer {
    left: 12px;
    right: auto;
  }

  body.ir-tenant-theme.arabic-lang .ir-hero-block .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  body.ir-tenant-theme.arabic-lang .ir-hero__cta {
    align-items: stretch;
  }

  [dir="rtl"] body.ir-tenant-theme .ir-nav__outlet-select,
  body.ir-tenant-theme.arabic-lang .ir-nav__outlet-select,
  [dir="rtl"] body.ir-tenant-theme .ir-nav__outlet-trigger,
  body.ir-tenant-theme.arabic-lang .ir-nav__outlet-trigger {
    padding: 5px 6px 5px 20px;
    background-position: left 7px center;
  }
}

/* Login/register password field icons (Bug 09) — mirror in RTL */
.arabic-lang .auth-form .icon-inside,
[dir="rtl"] .auth-form .icon-inside {
  left: auto;
  right: 16px;
}

.arabic-lang .auth-form .eyeIcon-inside,
[dir="rtl"] .auth-form .eyeIcon-inside {
  right: auto;
  left: 16px;
}

.arabic-lang .auth-form .form-control,
[dir="rtl"] .auth-form .form-control {
  padding: 10px 40px 10px 44px;
}

.arabic-lang .auth-form label,
.arabic-lang .auth-description-inner h2,
.arabic-lang .auth-description-inner p,
[dir="rtl"] .auth-form label,
[dir="rtl"] .auth-description-inner h2,
[dir="rtl"] .auth-description-inner p {
  text-align: right;
}

.arabic-lang .auth-form .forgot_password_text,
[dir="rtl"] .auth-form .forgot_password_text {
  text-align: right;
  display: block;
  width: 100%;
}

.arabic-lang .auth-form .form-group,
.arabic-lang .auth-form .error_txt,
.arabic-lang .auth-form .error_txt p,
.arabic-lang .auth-form .red_error,
.arabic-lang .auth-form .green_error,
[dir="rtl"] .auth-form .form-group,
[dir="rtl"] .auth-form .error_txt,
[dir="rtl"] .auth-form .error_txt p,
[dir="rtl"] .auth-form .red_error,
[dir="rtl"] .auth-form .green_error {
  text-align: right;
  margin-left: 0;
}

/* Login/register form titles stay centered like English */
.arabic-lang .login_page .auth-form h2,
.arabic-lang .login_page .auth-form .subtitle,
[dir="rtl"] .login_page .auth-form h2,
[dir="rtl"] .login_page .auth-form .subtitle {
  text-align: center;
}

.arabic-lang .login_page .auth-form h2,
.arabic-lang .login_page .auth-description-inner h2,
[dir="rtl"] .login_page .auth-form h2,
[dir="rtl"] .login_page .auth-description-inner h2 {
  letter-spacing: 0;
}

/* Phone/email stay readable LTR but sit on the Arabic (right) side */
.arabic-lang .auth-form input[name="phone"],
.arabic-lang .auth-form input[name="email"],
.arabic-lang .contact-page input[name="email"],
.arabic-lang input[type="email"],
.arabic-lang input[name="phone"],
[dir="rtl"] .auth-form input[name="phone"],
[dir="rtl"] .auth-form input[name="email"],
[dir="rtl"] .contact-page input[name="email"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[name="phone"] {
  direction: ltr;
  text-align: right;
}

/* Phone numbers: keep + on the left of the digits (e.g. +966… not 966…+) */
.arabic-lang a[href^="tel:"],
.arabic-lang .contact-phone,
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] .contact-phone {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
}

.arabic-lang .contact-page .callout,
.arabic-lang .contact-page .callout p,
[dir="rtl"] .contact-page .callout,
[dir="rtl"] .contact-page .callout p {
  text-align: right;
}

.arabic-lang .auth-form .register_text,
[dir="rtl"] .auth-form .register_text {
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* Bug-012: online-order item name + price stay left in LTR CSS.
   Only override the text block — flex already mirrors the cart button. */
.arabic-lang .product .product-body .product-desc,
.arabic-lang .product .product-body .product-desc h4,
.arabic-lang .product .product-price,
.arabic-lang .menu-v2 .product .product-body .product-desc,
.arabic-lang .menu-v2 .product .product-body .product-desc h4,
[dir="rtl"] .product .product-body .product-desc,
[dir="rtl"] .product .product-body .product-desc h4,
[dir="rtl"] .product .product-price,
[dir="rtl"] .menu-v2 .product .product-body .product-desc,
[dir="rtl"] .menu-v2 .product .product-body .product-desc h4 {
  text-align: right;
}

/* Bug-010: review / testimonial cards keep RTL copy alignment */
[dir="rtl"] .ir-community-card__quote,
[dir="rtl"] .ir-community-card__meta,
[dir="rtl"] .ir-greview-card,
[dir="rtl"] .ir-greview-card__text,
[dir="rtl"] .ir-greview-card__time,
.arabic-lang .ir-community-card__quote,
.arabic-lang .ir-community-card__meta,
.arabic-lang .ir-greview-card,
.arabic-lang .ir-greview-card__text,
.arabic-lang .ir-greview-card__time {
  text-align: right;
}

/* Reservation date/time: Arabic only — value on the right, picker icon on the right
   (same as email/password icons). Date/time digits stay LTR so they do not reverse. */
html[dir="rtl"] input[type="date"],
html[dir="rtl"] input[type="time"],
body.arabic-lang input[type="date"],
body.arabic-lang input[type="time"],
body.ir-tenant-theme.arabic-lang .contact-wrapper input[type="date"].form-control,
body.ir-tenant-theme.arabic-lang .contact-wrapper input[type="time"].form-control {
  position: relative;
  direction: ltr;
  text-align: right;
  padding-left: 16px;
  padding-right: 42px;
}

html[dir="rtl"] input[type="date"]::-webkit-calendar-picker-indicator,
html[dir="rtl"] input[type="time"]::-webkit-calendar-picker-indicator,
body.arabic-lang input[type="date"]::-webkit-calendar-picker-indicator,
body.arabic-lang input[type="time"]::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 10px;
  left: auto;
  margin: 0;
  cursor: pointer;
}

html[dir="rtl"] input[type="date"]::-webkit-datetime-edit,
html[dir="rtl"] input[type="time"]::-webkit-datetime-edit,
body.arabic-lang input[type="date"]::-webkit-datetime-edit,
body.arabic-lang input[type="time"]::-webkit-datetime-edit {
  text-align: right;
  padding: 0;
  width: 100%;
}

html[dir="rtl"] input[type="date"]::-webkit-datetime-edit-fields-wrapper,
html[dir="rtl"] input[type="time"]::-webkit-datetime-edit-fields-wrapper,
body.arabic-lang input[type="date"]::-webkit-datetime-edit-fields-wrapper,
body.arabic-lang input[type="time"]::-webkit-datetime-edit-fields-wrapper {
  display: flex;
  justify-content: flex-end;
}

/* Bug-011: About Us copy stays left under Arabic */
[dir="rtl"] .about-us-page .section-title-wrap,
[dir="rtl"] .about-us-page .section-title-wrap .title,
[dir="rtl"] .about-us-page .section-title-wrap .subtitle,
[dir="rtl"] .about-us-page .section-title-wrap .custom-primary,
.arabic-lang .about-us-page .section-title-wrap,
.arabic-lang .about-us-page .section-title-wrap .title,
.arabic-lang .about-us-page .section-title-wrap .subtitle,
.arabic-lang .about-us-page .section-title-wrap .custom-primary {
  text-align: right;
}

/* Reserve Now: LTR hover translateX(3px) slides the caret into Arabic text.
   Keep label + icon as a row with gap; do not slide the icon on hover. */
.arabic-lang .contact-wrapper .btn-custom.primary,
[dir="rtl"] .contact-wrapper .btn-custom.primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  overflow: visible;
}

.arabic-lang .contact-wrapper .btn-custom i,
[dir="rtl"] .contact-wrapper .btn-custom i {
  display: inline-block;
  margin-left: 0;
  margin-right: 0;
}

.arabic-lang .contact-wrapper .btn-custom .fa-caret-right,
.arabic-lang .contact-wrapper .btn-custom:hover .fa-caret-right,
.arabic-lang .contact-wrapper .btn-custom:focus .fa-caret-right,
.arabic-lang .contact-wrapper .btn-custom:hover i,
.arabic-lang .contact-wrapper .btn-custom:focus i,
[dir="rtl"] .contact-wrapper .btn-custom .fa-caret-right,
[dir="rtl"] .contact-wrapper .btn-custom:hover .fa-caret-right,
[dir="rtl"] .contact-wrapper .btn-custom:focus .fa-caret-right,
[dir="rtl"] .contact-wrapper .btn-custom:hover i,
[dir="rtl"] .contact-wrapper .btn-custom:focus i {
  transform: scaleX(-1);
}

.arabic-lang #reservations .reservation-field-error,
.arabic-lang #reservations .reservation-field-error p,
[dir="rtl"] #reservations .reservation-field-error,
[dir="rtl"] #reservations .reservation-field-error p {
  text-align: right;
}