/* ═══════════════════════════════════════════════════════════════════════════
   EHG Business Center — Arabic RTL Optimization Stylesheet
   Version: 2.0 — Production Grade
   
   PURPOSE: Complete Arabic UX/UI refinement for RTL layout.
   This file SUPPLEMENTS styles.css and applies exclusively when body.rtl
   is active (Arabic mode). Load AFTER styles.css.
   
   Sections:
   01. FOUNDATIONS — Font system, base Arabic typography
   02. NAVIGATION — RTL nav alignment & spacing
   03. HERO — Slider content, typography, stats, actions
   04. TICKER — RTL-safe scrolling
   05. ABOUT — Section layout, list items
   06. SPACES / GALLERY — Cards, tabs, filter
   07. FLOOR PLAN — Detail panel, specs, SVG hints
   08. EQUIPMENT — Column layout, list items
   09. SERVICES — Cards, popups
   10. PLANS — Pricing cards, features, CTA
   11. CALCULATOR — Controls alignment
   12. TESTIMONIALS — Quote cards, trust stats, carousel
   13. FAQ — Accordion, header, CTA
   14. BOOKING FORM — Inputs, labels, selects
   15. FOOTER — Grid, links, bottom bar
   16. POPUPS & MODALS — Booking popup, service popups
   17. CHATBOT WIDGET — RTL panel, messages
   18. FLOATING ELEMENTS — Tour pill, sticky bar
   19. RESPONSIVE — RTL mobile overrides
   20. TYPOGRAPHY SCALE — Arabic font sizing system
   ═══════════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════
   01. FOUNDATIONS — Arabic Font System & Base RTL
   ═══════════════════════════════════════════════════════ */

/* Ensure Cairo is loaded for all Arabic content */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;900&display=swap');

body.rtl {
  font-family: 'Cairo', sans-serif;
  direction: rtl;
  text-align: right;

  /* Arabic typography improvements */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;

  /* Better word spacing for Arabic */
  word-spacing: 0.02em;
}

/* Universal Cairo font application for Arabic mode */
body.rtl,
body.rtl p,
body.rtl span,
body.rtl a,
body.rtl li,
body.rtl div,
body.rtl strong,
body.rtl em {
  font-family: 'Cairo', sans-serif;
}

/* Headings — Cairo for Arabic readability */
body.rtl h1,
body.rtl h2,
body.rtl h3,
body.rtl h4,
body.rtl h5,
body.rtl h6,
body.rtl .section-h2,
body.rtl .hero-h1,
body.rtl .plan-name,
body.rtl .fp-detail-card h3,
body.rtl .service-card h3,
body.rtl .gallery-info h4 {
  font-family: 'Cairo', sans-serif;
  letter-spacing: 0 !important;
  font-weight: 700;
}

/* Form elements */
body.rtl button,
body.rtl input,
body.rtl select,
body.rtl textarea,
body.rtl label,
body.rtl option {
  font-family: 'Cairo', sans-serif;
}

/* Remove all letter-spacing for Arabic (spacing breaks Arabic letter joining) */
body.rtl * {
  letter-spacing: 0 !important;
}

/* Restore only where truly needed (numeric, Latin sub-labels) */
body.rtl .stat-num,
body.rtl .plan-price,
body.rtl .tst-trust-num,
body.rtl .fp-spec-val,
body.rtl .about-badge-num,
body.rtl .calc-result-price span {
  letter-spacing: -0.02em !important;
  font-family: 'Cairo', sans-serif;
  font-weight: 800;
}

/* Arabic line height — critical for readability */
body.rtl p {
  line-height: 1.95;
  font-size: 15px;
}

body.rtl li {
  line-height: 1.9;
}

/* Improve small text readability */
body.rtl .section-label span {
  font-size: 11px;
  font-weight: 700;
}


/* ═══════════════════════════════════════════════════════
   02. NAVIGATION — RTL Alignment & Spacing
   ═══════════════════════════════════════════════════════ */

/* Nav container — RTL order */
body.rtl nav {
  direction: rtl;
}

/* Logo flows right-to-left */
body.rtl .nav-logo {
  flex-direction: row-reverse;
}

body.rtl .nav-logo-text {
  text-align: right;
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
}

body.rtl .nav-logo-text small {
  font-family: 'Cairo', sans-serif;
  letter-spacing: 0 !important;
  font-size: 9px;
}

/* Nav links — reversed order */
body.rtl .nav-links {
  flex-direction: row-reverse;
  gap: 2rem;
}

/* Underline animation from right for RTL */
body.rtl .nav-links a::after {
  left: auto;
  right: 0;
}

/* Nav CTA + language toggle order */
body.rtl .nav-cta {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 20px;
}

body.rtl .nav-lang-toggle {
  margin-left: 0;
  margin-right: 0;
  margin-left: 12px; /* EN button sits to the LEFT in RTL nav */
}

/* Mobile menu — hamburger stays on left in RTL */
body.rtl .nav-hamburger {
  order: -1;
}

/* Mobile menu panel — opens from right in RTL */
body.rtl .mobile-menu {
  right: 0;
  left: auto;
  text-align: right;
}

body.rtl .mobile-menu a {
  font-family: 'Cairo', sans-serif;
  font-size: 16px;
  font-weight: 600;
  justify-content: flex-end;
}

body.rtl .mobile-menu .nav-cta {
  font-family: 'Cairo', sans-serif;
}


/* ═══════════════════════════════════════════════════════
   03. HERO — Slider, Typography, Stats, Actions
   ═══════════════════════════════════════════════════════ */

body.rtl .hero-content {
  text-align: right;
  padding-right: 4rem;
  padding-left: 0;
}

/* Hero label — decorative line on left side (end in RTL) */
body.rtl .hero-label {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .hero-label::before {
  display: none;
}

body.rtl .hero-label::after {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  background: var(--gold);
}

body.rtl .hero-label span {
  font-size: 11px;
  font-weight: 700;
}

/* Hero headline — larger for Arabic at smaller sizes */
body.rtl .hero-h1 {
  font-family: 'Cairo', sans-serif;
  font-size: clamp(40px, 5.5vw, 80px);
  font-weight: 900;
  line-height: 1.15;
  text-align: right;
}

body.rtl .hero-h1 em {
  font-family: 'Cairo', sans-serif;
  font-style: normal;
  font-weight: 900;
  display: block;
}

/* Hero subtitle — better Arabic readability */
body.rtl .hero-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  text-align: right;
  max-width: 520px;
}

/* Hero actions — right-aligned, RTL order */
body.rtl .hero-actions {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .btn-primary,
body.rtl .btn-outline {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
}

/* Slide overlay — flip gradient for RTL (text is on right) */
body.rtl .slide-overlay {
  background: linear-gradient(
    285deg,
    rgba(11,13,15,0.88) 0%,
    rgba(11,13,15,0.55) 55%,
    rgba(11,13,15,0.3) 100%
  );
}

/* Hero stats — stay on right side in RTL (hero content is right-aligned) */
body.rtl .hero-stats {
  right: 4rem;
  left: auto;
  text-align: right;
  flex-direction: row;
}

body.rtl .stat {
  text-align: right;
}

body.rtl .stat-num {
  font-family: 'Cairo', sans-serif;
  font-size: 36px;
  font-weight: 900;
}

body.rtl .stat-label {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 600;
}

/* Scroll indicator — move to left */
body.rtl .scroll-indicator {
  left: auto;
  right: 4rem;
}

body.rtl .scroll-indicator span {
  font-family: 'Cairo', sans-serif;
  font-weight: 600;
}

/* Virtual Tour button — RTL */
body.rtl .hero-tour-btn {
  flex-direction: row-reverse;
}

body.rtl .hero-tour-text {
  text-align: right;
}

body.rtl .hero-tour-label,
body.rtl .hero-tour-sub {
  font-family: 'Cairo', sans-serif;
}

body.rtl .hero-tour-arrow {
  transform: scaleX(-1);
  margin-left: 0;
  margin-right: 4px;
}

body.rtl .hero-tour-btn:hover .hero-tour-arrow {
  transform: scaleX(-1) translateX(4px);
}

body.rtl .hero-tour-play svg {
  margin-left: 0;
  margin-right: 2px;
}


/* ═══════════════════════════════════════════════════════
   04. TICKER — RTL-Safe Scrolling Direction
   ═══════════════════════════════════════════════════════ */

/* Keep ticker scrolling LTR direction (Latin+Arabic content) */
body.rtl .ticker-track {
  direction: ltr;
  animation: ticker 30s linear infinite;
}

body.rtl .ticker-item {
  font-family: 'Cairo', sans-serif;
  font-weight: 700;
  font-size: 12px;
}


/* ═══════════════════════════════════════════════════════
   05. ABOUT — Section Layout, Badges, List Items
   ═══════════════════════════════════════════════════════ */

body.rtl #about {
  direction: rtl;
}

/* Image badge — flipped to left side */
body.rtl .about-badge {
  right: auto;
  left: -24px;
  bottom: -24px;
}

body.rtl .about-badge-text {
  font-family: 'Cairo', sans-serif;
  font-size: 9px;
  font-weight: 700;
}

/* Section heading */
body.rtl .section-h2 {
  font-family: 'Cairo', sans-serif;
  font-size: clamp(30px, 3.8vw, 54px);
  font-weight: 800;
  line-height: 1.25;
}

body.rtl .section-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 16px;
  line-height: 2;
  font-weight: 400;
  text-align: right;
  max-width: none;
}

/* Section label decoration — flip line to right side */
body.rtl .section-label {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .section-label::before {
  display: none;
}

body.rtl .section-label::after {
  content: '';
  display: block;
  width: 24px;
  height: 1px;
  background: var(--gold);
}

/* Divider — starts from right */
body.rtl .divider {
  margin-left: auto;
  margin-right: 0;
}

/* About list items — reverse direction */
body.rtl .about-item {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .about-item-text h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

body.rtl .about-item-text p {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  line-height: 1.85;
  text-align: right;
}


/* ═══════════════════════════════════════════════════════
   06. SPACES / GALLERY — Cards, Tabs, Filter
   ═══════════════════════════════════════════════════════ */

/* Spaces header layout */
body.rtl .spaces-header {
  flex-direction: row-reverse;
  align-items: flex-end;
}

/* Tab buttons */
body.rtl .spaces-tabs {
  flex-direction: row-reverse;
}

body.rtl .tab-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
}

/* Gallery info text — right aligned */
body.rtl .gallery-info {
  text-align: right;
}

body.rtl .gallery-info h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 18px;
  font-weight: 700;
}

body.rtl .gallery-info p {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
}

body.rtl .gallery-price {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
}

/* Gallery expand icon — flip to left side */
body.rtl .gallery-expand {
  right: auto;
  left: 16px;
}

/* Tour button in gallery */
body.rtl .gallery-tour-btn {
  flex-direction: row-reverse;
}


/* ═══════════════════════════════════════════════════════
   07. FLOOR PLAN — Detail Panel, Specs, Hints
   ═══════════════════════════════════════════════════════ */

/* Floor plan tabs */
body.rtl .fp-tabs {
  flex-direction: row-reverse;
}

body.rtl .fp-tab {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
  border-bottom: 2px solid transparent;
}

/* SVG header */
body.rtl .fp-svg-header {
  flex-direction: row-reverse;
}

body.rtl .fp-svg-title {
  font-family: 'Cairo', sans-serif;
  font-weight: 700;
}

/* Hint text */
body.rtl .fp-svg-hint {
  flex-direction: row-reverse;
}

body.rtl .fp-svg-hint-txt,
body.rtl .fp-svg-hint {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
}

/* Detail card */
body.rtl .fp-detail-card {
  text-align: right;
  direction: rtl;
}

body.rtl .fp-detail-card h3 {
  font-family: 'Cairo', sans-serif;
  font-size: 22px;
  font-weight: 800;
}

body.rtl .fp-type {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
}

/* Specs grid */
body.rtl .fp-specs {
  direction: rtl;
}

body.rtl .fp-spec-val {
  font-family: 'Cairo', sans-serif;
  font-weight: 800;
}

body.rtl .fp-spec-key {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 600;
}

/* Price */
body.rtl .fp-price {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .fp-price-num {
  font-family: 'Cairo', sans-serif;
  font-weight: 900;
}

body.rtl .fp-price-per,
body.rtl .fp-price-cur {
  font-family: 'Cairo', sans-serif;
}

/* Amenities pills */
body.rtl .fp-amenities {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .fp-amenity {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 600;
}

/* Legend */
body.rtl .fp-legend {
  flex-direction: row-reverse;
}

body.rtl .fp-legend-item {
  flex-direction: row-reverse;
}

body.rtl .fp-legend-item span {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
}

/* Inquire button */
body.rtl .fp-inquire-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 700;
}

/* Floor note */
body.rtl .fp-floor-note,
body.rtl #fp-ground-note,
body.rtl #fp-first-note {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  line-height: 1.9;
  text-align: right;
}

/* Office image label */
body.rtl .fp-office-img-wrap {
  direction: rtl;
}

body.rtl .fp-office-img-label {
  font-family: 'Cairo', sans-serif;
  right: auto;
  left: 0;
  text-align: left;
}


/* ═══════════════════════════════════════════════════════
   08. EQUIPMENT — Column Layout, List Items, Badges
   ═══════════════════════════════════════════════════════ */

/* Column headers — reverse order */
body.rtl .eq-col-header {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .eq-col-title {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 800;
  text-align: right;
}

body.rtl .eq-col-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  text-align: right;
}

/* Equipment items — reverse layout */
body.rtl .eq-item {
  flex-direction: row-reverse;
  text-align: right;
}

/* Left accent bar — flip to right side */
body.rtl .eq-item::before {
  left: auto;
  right: 0;
}

body.rtl .eq-item-text {
  text-align: right;
}

body.rtl .eq-item-text strong {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
  display: block;
}

body.rtl .eq-item-text span {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  line-height: 1.85;
}

/* Badge */
body.rtl .eq-badge {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 700;
  flex-direction: row-reverse;
}

/* Border between columns */
body.rtl .eq-col:first-child {
  border-right: none;
  border-left: 1px solid var(--border);
}

/* CTA section */
body.rtl .eq-cta {
  text-align: right;
}

body.rtl #eq-cta-label {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
}

body.rtl #eq-cta-p {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 2;
}

body.rtl #eq-cta-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}


/* ═══════════════════════════════════════════════════════
   09. SERVICES — Cards & Popups
   ═══════════════════════════════════════════════════════ */

/* Service cards */
body.rtl .service-card {
  text-align: right;
  border-top: 2px solid transparent;
  border-right: none;
  border-left: none;
}

body.rtl .service-card:hover {
  border-top-color: var(--gold);
}

body.rtl .service-card h3 {
  font-family: 'Cairo', sans-serif;
  font-size: 20px;
  font-weight: 700;
}

body.rtl .service-card p {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 1.9;
}

body.rtl .service-more {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 700;
  flex-direction: row-reverse;
  justify-content: flex-end;
}

/* Service popup — RTL layout */
body.rtl .srv-popup-title,
body.rtl .srv-popup-tag,
body.rtl .srv-popup-desc {
  text-align: right;
}

body.rtl .srv-popup-title {
  font-family: 'Cairo', sans-serif;
  font-size: 28px;
  font-weight: 800;
}

body.rtl .srv-popup-tag {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
}

body.rtl .srv-popup-desc {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  line-height: 2;
  font-weight: 400;
}

body.rtl .srv-popup-divider {
  transform-origin: right;
}

body.rtl .srv-popup-highlights {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

body.rtl .srv-highlight-pill {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 600;
}

/* Icon badge — flip to right side */
body.rtl .srv-popup-icon-badge {
  left: auto;
  right: 36px;
}

/* Close button — flip to left side */
body.rtl .srv-close-btn {
  right: auto;
  left: 14px;
}

/* CTA button */
body.rtl .srv-popup-cta {
  flex-direction: row-reverse;
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}

/* Corner hooks — flip for RTL */
body.rtl .srv-hook-tl {
  left: auto;
  right: 0;
  border-left: none;
  border-right: 2px solid var(--gold);
}

body.rtl .srv-hook-tr {
  right: auto;
  left: 0;
  border-right: none;
  border-left: 2px solid var(--gold);
}

body.rtl .srv-hook-br {
  border-right: none;
  border-left: 2px solid var(--gold);
  right: auto;
  left: 0;
}

body.rtl .srv-hook-bl {
  border-left: none;
  border-right: 2px solid var(--gold);
  left: auto;
  right: 0;
}


/* ═══════════════════════════════════════════════════════
   10. PLANS — Pricing Cards, Features, CTA
   ═══════════════════════════════════════════════════════ */

/* Plan cards */
body.rtl .plan-card {
  text-align: right;
  direction: rtl;
}

/* Featured badge — flip to left side in RTL */
body.rtl .plan-badge {
  top: 20px;
  right: auto;
  left: 20px;
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 700;
}

body.rtl .plan-type {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
}

body.rtl .plan-name {
  font-family: 'Cairo', sans-serif;
  font-size: 26px;
  font-weight: 800;
}

body.rtl .plan-desc {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 1.9;
}

body.rtl .plan-from {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 600;
}

body.rtl .plan-price {
  font-family: 'Cairo', sans-serif;
  font-size: 40px;
  font-weight: 900;
  direction: ltr; /* Keep numbers LTR */
  text-align: right;
}

body.rtl .plan-period {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
}

body.rtl .plan-discount {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
}

/* Feature list — RTL direction */
body.rtl .plan-features {
  direction: rtl;
}

body.rtl .plan-features li {
  flex-direction: row-reverse;
  justify-content: flex-start;
  text-align: right;
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 1.75;
}

body.rtl .plan-features li::before {
  margin-left: 0;
  margin-right: 0;
  order: 1;
}

/* Plan CTA */
body.rtl .plan-cta {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}

/* Incentives */
body.rtl .incentive-card {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .incentive-card h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
}

body.rtl .incentive-card p {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  line-height: 1.85;
}

body.rtl .incentive-card .tag {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  font-weight: 700;
}


/* ═══════════════════════════════════════════════════════
   11. CALCULATOR — Controls Alignment
   ═══════════════════════════════════════════════════════ */

body.rtl .calc-wrap {
  direction: rtl;
}

body.rtl .calc-header {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .calc-title {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-align: right;
}

body.rtl .calc-controls {
  text-align: right;
  border-right: none;
  border-left: 1px solid var(--border);
}

body.rtl .calc-label {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-align: right;
}

body.rtl .calc-chips {
  justify-content: flex-start;
  flex-direction: row-reverse;
  flex-wrap: wrap;
}

body.rtl .calc-chip {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
}

body.rtl .calc-result {
  text-align: right;
}

body.rtl .calc-result-label {
  font-family: 'Cairo', sans-serif;
  text-align: right;
}

body.rtl .calc-result-price {
  direction: ltr; /* Numbers stay LTR */
  text-align: right;
}

body.rtl .calc-result-price span {
  font-family: 'Cairo', sans-serif;
  font-weight: 900;
}

body.rtl .calc-breakdown {
  text-align: right;
  direction: rtl;
}

body.rtl .calc-breakdown-item {
  flex-direction: row-reverse;
}

body.rtl .calc-cta-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}

body.rtl .calc-disclaimer {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  text-align: right;
}


/* ═══════════════════════════════════════════════════════
   12. TESTIMONIALS — Quote Cards, Trust Stats, Carousel
   ═══════════════════════════════════════════════════════ */

/* Section heading */
body.rtl #testimonials .section-label {
  flex-direction: row-reverse;
}

/* Testimonial card */
body.rtl .tst-card {
  text-align: right;
  direction: rtl;
}

/* Quote mark — move to left (start of Arabic text flow) */
body.rtl .tst-quote-mark {
  text-align: right;
}

/* Quote text */
body.rtl .tst-body {
  font-family: 'Cairo', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  text-align: right;
}

/* Reviewer info */
body.rtl .tst-reviewer {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .tst-avatar {
  order: 1; /* Avatar on left in RTL */
}

body.rtl .tst-reviewer-info {
  text-align: right;
}

body.rtl .tst-name {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
}

body.rtl .tst-role {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 400;
}

/* Stars */
body.rtl .tst-stars {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

/* Carousel navigation */
body.rtl .tst-nav {
  flex-direction: row-reverse;
}

body.rtl .tst-btn-prev svg {
  transform: scaleX(-1);
}

body.rtl .tst-btn-next svg {
  transform: scaleX(-1);
}

/* Trust stats */
body.rtl .tst-trust {
  direction: rtl;
}

body.rtl .tst-trust-item {
  text-align: center; /* Keep trust stats centered */
}

body.rtl .tst-trust-num {
  font-family: 'Cairo', sans-serif;
  font-size: 40px;
  font-weight: 900;
  direction: ltr; /* Numbers LTR */
}

body.rtl .tst-trust-label {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 600;
}


/* ═══════════════════════════════════════════════════════
   13. FAQ — Accordion, Header, CTA
   ═══════════════════════════════════════════════════════ */

/* FAQ header */
body.rtl .faq-header {
  flex-direction: row-reverse;
  align-items: flex-start;
}

body.rtl .faq-book-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 700;
  flex-direction: row-reverse;
}

body.rtl .faq-book-btn svg {
  transform: scaleX(-1);
}

body.rtl .faq-book-btn:hover svg {
  transform: scaleX(-1) translateX(-3px);
}

/* FAQ grid */
body.rtl .faq-grid {
  direction: rtl;
}

/* FAQ items */
body.rtl .faq-item {
  text-align: right;
  direction: rtl;
}

body.rtl .faq-q {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-align: right;
  flex-direction: row-reverse;
  justify-content: space-between;
}

/* Plus/minus icon — flip position */
body.rtl .faq-icon {
  order: -1;
}

body.rtl .faq-a {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 2;
  text-align: right;
}

/* CTA below FAQ */
body.rtl .faq-cta {
  text-align: center;
}

body.rtl .faq-cta p {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
}

body.rtl .faq-cta-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}


/* ═══════════════════════════════════════════════════════
   14. BOOKING FORM — Labels, Inputs, Selects, Submit
   ═══════════════════════════════════════════════════════ */

/* Booking section */
body.rtl #booking {
  direction: rtl;
}

body.rtl .booking-grid {
  direction: rtl;
}

/* Info panel */
body.rtl .booking-info {
  text-align: right;
}

body.rtl .booking-info h2,
body.rtl .booking-info .section-h2 {
  font-family: 'Cairo', sans-serif;
  font-weight: 800;
}

body.rtl .booking-info p {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  line-height: 2;
}

/* Contact items */
body.rtl .contact-item {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .contact-item span {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
}

/* Booking features */
body.rtl .booking-feature {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .booking-feature span {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
}

/* Form */
body.rtl .booking-form {
  direction: rtl;
}

body.rtl .form-group {
  text-align: right;
}

body.rtl .form-group label {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-align: right;
  display: block;
}

body.rtl .form-group input,
body.rtl .form-group select,
body.rtl .form-group textarea {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  text-align: right;
  direction: rtl;
}

body.rtl .form-group input::placeholder,
body.rtl .form-group textarea::placeholder {
  font-family: 'Cairo', sans-serif;
  text-align: right;
  direction: rtl;
}

/* Select — arrow position */
body.rtl .form-group select {
  padding-right: 16px;
  padding-left: 40px;
  background-position: left 14px center;
}

/* Submit button */
body.rtl .booking-submit {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
  width: 100%;
}


/* ═══════════════════════════════════════════════════════
   15. FOOTER — Grid, Links, Bottom Bar
   ═══════════════════════════════════════════════════════ */

body.rtl footer {
  direction: rtl;
}

body.rtl .footer-grid {
  direction: rtl;
  text-align: right;
}

/* Footer brand */
body.rtl .footer-brand {
  text-align: right;
}

body.rtl .footer-brand .nav-logo,
body.rtl .nav-logo {
  flex-direction: row-reverse;
}

body.rtl .footer-desc {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 2;
  text-align: right;
}

/* Social buttons */
body.rtl .footer-social {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

/* Footer columns */
body.rtl .footer-col h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
}

body.rtl .footer-col ul {
  text-align: right;
  padding: 0;
}

body.rtl .footer-col ul li a {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 400;
  display: block;
  text-align: right;
}

/* Footer bottom bar */
body.rtl .footer-bottom {
  flex-direction: row-reverse;
}

body.rtl .footer-copy {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  text-align: right;
}

body.rtl .footer-credit {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  text-align: left;
}


/* ═══════════════════════════════════════════════════════
   16. POPUPS & MODALS — Booking Popup, General
   ═══════════════════════════════════════════════════════ */

/* Booking popup */
body.rtl .popup-box {
  direction: rtl;
  text-align: right;
}

body.rtl .popup-close {
  right: auto;
  left: 16px;
}

body.rtl .popup-title {
  font-family: 'Cairo', sans-serif;
  font-size: 22px;
  font-weight: 800;
  text-align: right;
}

body.rtl .popup-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  text-align: right;
  line-height: 1.9;
}

/* Popup input groups */
body.rtl .popup-input-group {
  text-align: right;
}

body.rtl .popup-input-group label {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-align: right;
  display: block;
}

body.rtl .popup-input-group input,
body.rtl .popup-input-group select,
body.rtl .popup-input-group textarea {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  text-align: right;
  direction: rtl;
}

body.rtl .popup-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
  width: 100%;
}

/* Popup form rows */
body.rtl .popup-form-row {
  direction: rtl;
}

/* Lightbox */
body.rtl .lightbox-title {
  font-family: 'Cairo', sans-serif;
  font-size: 20px;
  font-weight: 800;
  text-align: right;
}

body.rtl .lightbox-desc {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  text-align: right;
}

body.rtl .lightbox-close {
  right: auto;
  left: 20px;
}


/* ═══════════════════════════════════════════════════════
   17. CHATBOT WIDGET — RTL Panel, Messages
   ═══════════════════════════════════════════════════════ */

/* Widget — flip to left side in RTL */
body.rtl .wa-widget {
  right: auto;
  left: 36px;
  align-items: flex-start;
}

/* Chat panel — appears on left */
body.rtl .wa-chat-panel {
  right: auto;
  left: 0;
}

/* Chat header */
body.rtl .wa-chat-header {
  direction: rtl;
  flex-direction: row-reverse;
}

body.rtl .wa-chat-header-info {
  text-align: right;
}

body.rtl .wa-chat-agent-name {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
}

body.rtl .wa-chat-status {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
}

body.rtl .wa-header-actions {
  flex-direction: row-reverse;
}

/* AI banner */
body.rtl .wa-ai-banner {
  direction: rtl;
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .wa-ai-banner span {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 600;
}

/* Messages */
body.rtl .wa-msg-in {
  align-self: flex-start;
}

body.rtl .wa-msg-out {
  align-self: flex-end;
}

body.rtl .wa-msg-bot {
  border-radius: 4px 16px 16px 16px; /* RTL bubble shape */
  text-align: right;
  direction: rtl;
}

body.rtl .wa-msg-bubble {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  line-height: 1.7;
  direction: rtl;
  text-align: right;
}

/* Quick reply chips */
body.rtl .wa-quick-replies {
  direction: rtl;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  justify-content: flex-start;
}

body.rtl .wa-chip {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
  direction: rtl;
}

/* Chat input area */
body.rtl .wa-chat-footer {
  direction: rtl;
  flex-direction: row-reverse;
}

body.rtl .wa-chat-input {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  text-align: right;
  direction: rtl;
}

body.rtl .wa-chat-input::placeholder {
  font-family: 'Cairo', sans-serif;
  text-align: right;
}

/* Send button — flip arrow */
body.rtl .wa-chat-send svg {
  transform: scaleX(-1);
}

/* Footer brand */
body.rtl .wa-chat-footer-brand {
  direction: rtl;
  flex-direction: row-reverse;
  justify-content: center;
}

body.rtl .wa-chat-footer-brand span {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
}

/* Notification bubble */
body.rtl .wa-notify-bubble {
  right: auto;
  left: 0;
  border-radius: 16px 16px 16px 4px; /* RTL tail on left */
  flex-direction: row-reverse;
}

body.rtl .wa-notify-name {
  font-family: 'Cairo', sans-serif;
  font-weight: 700;
  text-align: right;
}

body.rtl .wa-notify-msg {
  font-family: 'Cairo', sans-serif;
  text-align: right;
}

/* Time label */
body.rtl .wa-msg-time-label {
  font-family: 'Cairo', sans-serif;
}

body.rtl .wa-msg-time {
  font-family: 'Cairo', sans-serif;
  font-size: 10px;
  direction: ltr; /* Time stays LTR */
}


/* ═══════════════════════════════════════════════════════
   18. FLOATING ELEMENTS — Tour Pill, Toast, Sticky Bar
   ═══════════════════════════════════════════════════════ */

/* Tour pill — flip to left side */
body.rtl .tour-pill {
  right: auto;
  left: 36px;
  flex-direction: row-reverse;
  transform: translateX(-20px);
}

body.rtl .tour-pill.visible {
  transform: translateX(0);
}

body.rtl .tour-pill-txt {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}

body.rtl .tour-pill-icon svg {
  margin-left: 0;
  margin-right: 2px;
}

body.rtl .tour-pill-arrow {
  transform: scaleX(-1);
}

body.rtl .tour-pill:hover .tour-pill-arrow {
  transform: scaleX(-1) translateX(3px);
}

/* Toast notifications */
body.rtl .toast {
  right: auto;
  left: 32px;
  text-align: right;
  direction: rtl;
}

body.rtl .toast-title {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
}

body.rtl .toast-msg {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
}

/* Tour CTA strip */
body.rtl .tour-cta-strip-inner {
  flex-direction: row-reverse;
}

body.rtl .tour-cta-strip-left {
  flex-direction: row-reverse;
}

body.rtl .tour-cta-strip-title {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-align: right;
}

body.rtl .tour-cta-strip-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  text-align: right;
}

body.rtl .tour-cta-strip-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
  flex-direction: row-reverse;
}

body.rtl .tour-cta-strip-btn svg {
  transform: scaleX(-1);
}

body.rtl .tour-cta-strip-btn:hover svg {
  transform: scaleX(-1) translateX(-3px);
}

/* Mobile sticky CTA bar */
body.rtl .mob-cta-call,
body.rtl .mob-cta-book {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
  flex-direction: row-reverse;
}

body.rtl .mob-cta-call span,
body.rtl .mob-cta-book span {
  font-family: 'Cairo', sans-serif;
}


/* ═══════════════════════════════════════════════════════
   19. RESPONSIVE — RTL Mobile Overrides
   ═══════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  body.rtl .hero-stats {
    right: 2.5rem;
    left: auto;
  }
  body.rtl .scroll-indicator {
    right: 2.5rem;
    left: auto;
  }
  body.rtl .calc-controls {
    border-left: none;
    border-bottom: 1px solid var(--border);
  }
}

@media (max-width: 768px) {
  /* Hero */
  body.rtl .hero-content {
    padding-right: 1.25rem;
    padding-left: 1.25rem;
    text-align: right;
  }

  body.rtl .hero-h1 {
    font-size: clamp(32px, 8vw, 50px);
    line-height: 1.2;
  }

  body.rtl .hero-actions {
    flex-direction: column;
    align-items: flex-end;
  }

  body.rtl .btn-primary,
  body.rtl .btn-outline {
    width: 100%;
    text-align: center;
    justify-content: center;
    font-size: 15px;
  }

  body.rtl .hero-tour-btn {
    align-self: flex-end;
  }

  body.rtl .hero-stats {
    right: 1.5rem;
    left: auto;
    display: flex;
  }

  body.rtl .scroll-indicator {
    display: none;
  }

  /* Nav */
  body.rtl .nav-lang-toggle {
    margin-left: 8px;
    margin-right: 0;
  }

  /* Spaces */
  body.rtl .spaces-header {
    flex-direction: column;
    align-items: flex-start;
  }

  body.rtl .spaces-tabs {
    flex-direction: row;
    width: 100%;
  }

  /* About */
  body.rtl #about {
    grid-template-columns: 1fr;
  }

  /* FAQ header */
  body.rtl .faq-header {
    flex-direction: column;
    align-items: flex-end;
  }

  body.rtl .faq-book-btn {
    align-self: flex-end;
  }

  /* Footer */
  body.rtl .footer-bottom {
    flex-direction: column;
    align-items: center;
  }

  /* Floating elements */
  body.rtl .tour-pill {
    left: 16px;
    right: auto;
  }

  body.rtl .wa-widget {
    left: 16px;
    right: auto;
  }

  body.rtl .toast {
    left: 16px;
    right: 16px;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  body.rtl .tour-pill {
    left: 12px;
    right: auto;
  }

  body.rtl .wa-widget {
    left: 12px;
    right: auto;
  }

  /* Hero adjustments */
  body.rtl .hero-h1 {
    font-size: clamp(28px, 9vw, 44px);
    line-height: 1.25;
  }

  body.rtl .hero-sub {
    font-size: 14px;
    line-height: 1.9;
  }

  /* Plans */
  body.rtl .plan-name {
    font-size: 22px;
  }
}

/* RTL with mobile sticky bar */
@media (max-width: 480px) {
  body.rtl.mob-bar-active .wa-widget {
    left: 12px;
    right: auto;
    bottom: 76px;
  }

  body.rtl.mob-bar-active .tour-pill {
    left: 12px;
    right: auto;
  }
}


/* ═══════════════════════════════════════════════════════
   20. TYPOGRAPHY SCALE — Arabic Font Size System
   ═══════════════════════════════════════════════════════ */

/*
  Arabic typography needs slightly larger font sizes than equivalent
  English text because Arabic letterforms are visually smaller at the
  same pixel size due to their complexity and x-height differences.
  
  All sizes below are calibrated for Cairo font at production quality.
*/

/* Display headings */
body.rtl .hero-h1 {
  font-size: clamp(42px, 5.8vw, 84px);
  line-height: 1.15;
  font-weight: 900;
}

body.rtl .section-h2 {
  font-size: clamp(30px, 3.8vw, 54px);
  line-height: 1.2;
  font-weight: 800;
}

/* Body text */
body.rtl p {
  font-size: 15px;
  line-height: 1.95;
  font-weight: 400;
}

body.rtl .section-sub {
  font-size: 16px;
  line-height: 2.0;
}

/* Cards and panels */
body.rtl .about-item-text p,
body.rtl .eq-item-text span,
body.rtl .service-card p,
body.rtl .plan-desc,
body.rtl .booking-info p {
  font-size: 14px;
  line-height: 1.9;
}

/* Labels and captions */
body.rtl .section-label span,
body.rtl .plan-type,
body.rtl .fp-type,
body.rtl .eq-col-sub,
body.rtl .gallery-info p {
  font-size: 11px;
  font-weight: 700;
}

/* Navigation */
body.rtl .nav-links a {
  font-size: 14px;
  font-weight: 600;
}

/* Buttons */
body.rtl .btn-primary,
body.rtl .btn-outline,
body.rtl .nav-cta,
body.rtl .booking-submit,
body.rtl .plan-cta {
  font-size: 14px;
  font-weight: 700;
}

/* Form elements */
body.rtl .form-group input,
body.rtl .form-group select,
body.rtl .form-group textarea {
  font-size: 14px;
}

body.rtl .form-group label {
  font-size: 12px;
  font-weight: 700;
}

/* FAQ */
body.rtl .faq-q {
  font-size: 15px;
  font-weight: 700;
}

body.rtl .faq-a {
  font-size: 14px;
  line-height: 2;
}

/* Testimonials */
body.rtl .tst-body {
  font-size: 16px;
  line-height: 2;
  font-weight: 400;
}

body.rtl .tst-name {
  font-size: 15px;
  font-weight: 700;
}

body.rtl .tst-role {
  font-size: 12px;
}

/* Footer */
body.rtl .footer-col ul li a {
  font-size: 14px;
  line-height: 2;
}

body.rtl .footer-desc {
  font-size: 14px;
  line-height: 2;
}

/* ── Stat Numbers — keep numeric display clean ── */
body.rtl .stat-num,
body.rtl .plan-price,
body.rtl .tst-trust-num,
body.rtl .fp-spec-val,
body.rtl .about-badge-num,
body.rtl .calc-result-price span {
  direction: ltr;
  unicode-bidi: bidi-override;
}

/* ── Number suffix labels ── */
body.rtl .stat-label,
body.rtl .plan-period,
body.rtl .fp-spec-key,
body.rtl .tst-trust-label {
  font-family: 'Cairo', sans-serif;
  font-weight: 600;
}

/* ═══════════════════════════════════════════════════════
   VIRTUAL TOUR PAGE — RTL
   ═══════════════════════════════════════════════════════ */

body.rtl .tour-header {
  flex-direction: row-reverse;
}

body.rtl .tour-header-left {
  text-align: right;
}

body.rtl .tour-title {
  font-family: 'Cairo', sans-serif;
  font-weight: 800;
}

body.rtl .tour-page-h1 {
  font-family: 'Cairo', sans-serif;
  font-weight: 900;
}

body.rtl .tour-tabs {
  flex-direction: row-reverse;
}

body.rtl .tour-tab {
  font-family: 'Cairo', sans-serif;
  font-weight: 600;
  border-right: none;
  border-left: 1px solid var(--border);
}

body.rtl .tour-tab:last-child {
  border-left: none;
}

body.rtl .tour-book-btn {
  flex-direction: row-reverse;
  font-family: 'Cairo', sans-serif;
  font-weight: 700;
}

body.rtl .tour-book-btn svg {
  transform: scaleX(-1);
}

body.rtl .tour-stage {
  direction: rtl;
}

body.rtl .tour-info {
  border-left: none;
  border-right: 1px solid var(--border);
  text-align: right;
}

body.rtl .tour-info-tag {
  font-family: 'Cairo', sans-serif;
  font-weight: 700;
}

body.rtl .tour-info-name {
  font-family: 'Cairo', sans-serif;
  font-size: 20px;
  font-weight: 700;
}

body.rtl .tour-info-desc {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 2;
}

body.rtl .tour-feat {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .tour-feat span {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
}

body.rtl .tour-enquire-btn {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 700;
}

body.rtl .tour-upload-note {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .tour-ph-hint {
  font-family: 'Cairo', sans-serif;
}

/* ═══════════════════════════════════════════════════════
   LANGUAGE PICKER — Bilingual Card
   ═══════════════════════════════════════════════════════ */

/* The language picker is always bilingual — no direction override needed */
.lp-card {
  text-align: center;
}

.lp-btn-ar .lp-btn-label {
  font-family: 'Cairo', sans-serif;
  font-size: 18px;
  font-weight: 700;
}

.lp-btn-ar .lp-btn-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
}

/* ═══════════════════════════════════════════════════════
   BOOKING CONTACT — Additional RTL Refinements
   ═══════════════════════════════════════════════════════ */

body.rtl .booking-contact {
  text-align: right;
}

body.rtl .booking-contact-item {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .booking-contact-item span,
body.rtl .booking-contact-item a {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
}

/* ─── Ensure no clipping on RTL select arrows ─── */
body.rtl select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23C9A84C' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 14px center;
  padding-right: 14px;
  padding-left: 36px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* ─── Fix textarea resize handle for RTL ─── */
body.rtl textarea {
  resize: vertical;
}

/* ─── Smooth transition on language switch ─── */
body.rtl,
body.rtl * {
  transition-property: font-family, font-size, line-height, text-align, direction;
  transition-duration: 0.2s;
}

/* Don't transition everything — only text properties */
body.rtl *:not(button):not(a):not(input):not(select) {
  transition: none;
}

/* ═══════════════════════════════════════════════════════
   21. MISSING COMPONENTS — Final Polish Pass
   ═══════════════════════════════════════════════════════ */

/* ── Booking popup: label + heading + sub ── */
body.rtl .popup-label {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-align: right;
}

body.rtl .popup-h2 {
  font-family: 'Cairo', sans-serif;
  font-size: 28px;
  font-weight: 800;
  text-align: right;
  line-height: 1.25;
}

body.rtl .popup-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 2;
  text-align: right;
}

/* ── Booking form: PHP success/error messages ── */
body.rtl .booking-php-success {
  direction: rtl;
  text-align: right;
}

body.rtl .booking-php-success h3,
body.rtl .booking-php-success p {
  font-family: 'Cairo', sans-serif;
}

body.rtl .booking-php-error {
  font-family: 'Cairo', sans-serif;
  text-align: right;
  direction: rtl;
}

/* ── Toast: flip to left side + RTL text ── */
body.rtl .toast {
  right: auto;
  left: 32px;
  text-align: right;
  direction: rtl;
}

body.rtl .toast-title {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
}

body.rtl .toast-msg {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  line-height: 1.7;
}

/* ── Lightbox caption ── */
body.rtl .lightbox-caption h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 20px;
  font-weight: 700;
}

body.rtl .lightbox-caption p {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 600;
}

/* ── Contact items in booking section ── */
body.rtl .contact-item {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .contact-item span,
body.rtl .contact-item a {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
}

/* ── Booking feature items ── */
body.rtl .booking-feature {
  flex-direction: row-reverse;
  text-align: right;
}

body.rtl .booking-feature h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-align: right;
}

body.rtl .booking-feature p {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  line-height: 1.9;
  text-align: right;
}

/* ── Booking contact card heading ── */
body.rtl .booking-contact h4 {
  font-family: 'Cairo', sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-align: right;
}

/* ── Form row: reverse column order in RTL ── */
body.rtl .form-row {
  direction: rtl;
}

/* ── Calc bonus pill ── */
body.rtl .calc-bonus-pill {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
}

/* ── Calc addon checkbox ── */
body.rtl .calc-addon-box {
  flex-direction: row-reverse;
}

body.rtl .calc-addon-label {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-align: right;
}

body.rtl .calc-addon-price {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
}

/* ── Calc group label ── */
body.rtl .calc-group-label {
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-align: right;
}

/* ── Calc savings label ── */
body.rtl .calc-savings-lbl,
body.rtl .calc-commit-lbl,
body.rtl .calc-result-sub {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  text-align: right;
}

/* ── Calc disclaimer ── */
body.rtl .calc-disclaimer {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  text-align: right;
  line-height: 1.8;
}

/* ── Floor plan pricing table ── */
body.rtl .fp-pricing-table {
  direction: rtl;
}

body.rtl .fp-pt-lbl,
body.rtl .fp-pt-val {
  font-family: 'Cairo', sans-serif;
  font-size: 13px;
}

/* ── Gallery filter — "virtual tour" button text ── */
body.rtl .gallery-tour-txt {
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  font-weight: 600;
}

/* ── About section label + heading fix ── */
body.rtl #about .section-label {
  flex-direction: row-reverse;
}

/* ── Spaces header fix: section label + heading ── */
body.rtl #spaces .section-label,
body.rtl #equipment .section-label,
body.rtl #services .section-label,
body.rtl #plans .section-label,
body.rtl #testimonials .section-label,
body.rtl #faq .section-label,
body.rtl #booking .section-label,
body.rtl #floorplan .section-label {
  flex-direction: row-reverse;
}

/* ── Section heading em tags (gold words) ── */
body.rtl .section-h2 em {
  font-family: 'Cairo', sans-serif;
  font-style: normal;
  font-weight: 900;
  color: var(--gold);
}

/* ── Hero h1 em tag ── */
body.rtl .hero-h1 em {
  font-family: 'Cairo', sans-serif;
  font-style: normal;
  font-weight: 900;
  color: var(--gold);
}

/* ══════════════════════════════════════════════════
   22. DIRECTION-SENSITIVE ICONS — Complete Coverage
   ══════════════════════════════════════════════════ */

/* 
  Icons that are direction-sensitive and need flipping in RTL:
  - Any arrow pointing right (→) should point left (←)
  - Back arrows, forward arrows, chevrons in navigation
  - Exception: upload/download arrows (vertical) should NOT flip
*/

/* Calculator CTA arrow */
body.rtl .calc-cta svg {
  transform: scaleX(-1);
}

/* Tour CTA strip button arrow */
body.rtl .tour-cta-strip-btn svg {
  transform: scaleX(-1);
}
body.rtl .tour-cta-strip-btn:hover svg {
  transform: scaleX(-1) translateX(-3px);
}

/* Book tour button arrow in tour page */
body.rtl .tour-book-btn svg {
  transform: scaleX(-1);
}

/* Gallery expand icon — use ⤡ for RTL instead of ⤢ */
/* (handled in JS via applyRTLFixes gallery-expand override) */

/* Testimonial nav prev/next arrows */
body.rtl .tst-prev svg,
body.rtl .tst-next svg {
  transform: scaleX(-1);
}

/* EQ item hover accent — left→right bar */
body.rtl .eq-item::before {
  left: auto;
  right: 0;
  transform-origin: top; /* same animation but mirrored */
}

/* Service card hover border — top accent stays top */
/* (no direction change needed for top borders) */

/* Plan card top accent line */
body.rtl .plan-card::before {
  /* Top border stays — no flip needed */
}

/* Floor plan: detail panel sticky top */
body.rtl .fp-details {
  position: sticky;
  top: 100px;
}

/* ══════════════════════════════════════════════════
   23. PRINT / ACCESSIBILITY ENHANCEMENTS
   ══════════════════════════════════════════════════ */

/* Ensure Arabic text is readable when text-decoration applied */
body.rtl a {
  text-decoration-skip-ink: auto;
}

/* Screen reader: dir attribute inheritance */
[dir="rtl"] .ltr-override {
  direction: ltr;
  unicode-bidi: embed;
}

/* Numbers and prices always LTR */
body.rtl .price-display,
body.rtl .stat-num,
body.rtl .plan-price,
body.rtl .fp-spec-val,
body.rtl .tst-trust-num,
body.rtl .about-badge-num,
body.rtl .calc-result-price span {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* Phone numbers stay LTR */
body.rtl .phone-number,
body.rtl a[href^="tel"] {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* Email addresses stay LTR */
body.rtl a[href^="mailto"] {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* ══════════════════════════════════════════════════
   24. MOBILE MENU — RTL ALIGNMENT
   ══════════════════════════════════════════════════ */

body.rtl .mobile-menu {
  text-align: right;
  direction: rtl;
}

body.rtl .mobile-menu a {
  font-family: 'Cairo', sans-serif;
  font-size: 17px;
  font-weight: 600;
  text-align: right;
  padding-right: 1.5rem;
  padding-left: 0;
  justify-content: flex-end;
  display: flex;
  align-items: center;
}

body.rtl .mobile-menu .nav-cta {
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  width: 100%;
}

/* Mobile nav: lang toggle position */
body.rtl .mobile-menu .lang-section {
  text-align: right;
}

/* ══════════════════════════════════════════════════
   25. HIGH-DENSITY DISPLAY (Retina) — Arabic sharpness
   ══════════════════════════════════════════════════ */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body.rtl,
  body.rtl p,
  body.rtl h1,
  body.rtl h2,
  body.rtl h3,
  body.rtl h4 {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }
}

/* ══════════════════════════════════════════════════
   END OF arabic-rtl.css
   EHG Business Center — Arabic RTL Optimization v2.0
   ══════════════════════════════════════════════════ */