/* ─────────────────────────────────────────────
   TEEB INTERNATIONAL — ARABIC / RTL OVERRIDES
   Loaded after styles-v2.css
───────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400;1,700&family=Cairo:wght@300;400;500;600;700&display=swap');

/* ── BASE RTL ── */
html[dir="rtl"] body {
  direction: rtl;
  text-align: right;
}

/* Arabic font assignments */
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6 {
  font-family: 'Amiri', Georgia, serif;
}

html[dir="rtl"] p,
html[dir="rtl"] li,
html[dir="rtl"] a,
html[dir="rtl"] span,
html[dir="rtl"] label,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] button {
  font-family: 'Cairo', sans-serif;
}

/* ── NAV ── keep LTR layout (logo left, links right) with RTL text inside links ── */
html[dir="rtl"] nav {
  direction: ltr;
}

html[dir="rtl"] .logo {
  flex-direction: row;
}

html[dir="rtl"] .logo-text {
  align-items: center;
}

html[dir="rtl"] .logo-descriptor {
  font-family: 'Cairo', sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  text-transform: none;
  font-weight: 500;
  text-align: center;
  max-width: 120px;
  line-height: 1.3;
}

html[dir="rtl"] .nav-links {
  flex-direction: row;
  direction: rtl;
}


/* ── LANGUAGE TOGGLE ── */
.lang-toggle {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--v2-navy);
  letter-spacing: 0.08em;
  text-decoration: none;
  border: 1px solid var(--v2-taupe-mid);
  padding: 0.38rem 0.75rem;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  white-space: nowrap;
}

.lang-toggle:hover {
  background: var(--v2-navy);
  color: var(--v2-white) !important;
  border-color: var(--v2-navy);
}

/* English pages: toggle sits in nav-links */
.nav-links .lang-toggle {
  background: transparent;
  border-radius: 0;
}

/* ── MOBILE NAV RTL ── */
html[dir="rtl"] .mobile-nav-close {
  right: auto;
  left: 1.5rem;
}

/* ── HERO CONTENT — home/nat images have empty space on left ── */
html[dir="rtl"] .home-hero-content,
html[dir="rtl"] .nat-hero-content {
  right: auto;
  left: 5%;
  text-align: right;
}

/* manufacturing image — anchor content upper-left clear zone */
html[dir="rtl"] .mfg-hero-content {
  right: auto;
  left: 4%;
  top: 18%;
  bottom: auto;
  transform: none;
  text-align: right;
}
/* oud image: empty space is on the left — text sits in left zone */
html[dir="rtl"] .oud-hero-content {
  right: auto;
  left: 5%;
  width: 38%;
  max-width: none;
  text-align: right;
}

html[dir="rtl"] .mfg-banner-rule,
html[dir="rtl"] .oud-title-rule {
  margin-left: 0;
  margin-right: 0;
}

/* ── MANUFACTURING — process rows ── */
html[dir="rtl"] .mfg-row {
  grid-template-columns: 56px 1fr 240px;
  direction: rtl;
}

html[dir="rtl"] .mfg-row-aside {
  border-left: none;
  border-right: 1px solid var(--v2-taupe-mid);
  padding-left: 0;
  padding-right: 1.5rem;
  text-align: right;
  order: 1;
}

html[dir="rtl"] .mfg-row-num {
  order: -1;
  text-align: right;
}

/* ── OIL TRADE — who section ── */
html[dir="rtl"] .ot-who-right {
  border-left: none;
  border-right: 1px solid var(--v2-taupe-mid);
  padding-left: 0;
  padding-right: 3rem;
}

/* ── WHO WE ARE — banner ── */
html[dir="rtl"] .wwa-banner-left {
  border-right: none;
  border-left: 1px solid var(--v2-taupe-mid);
}

/* ── FLOW STEPS — border swap ── */
html[dir="rtl"] .ot-flow-step {
  border-left: none;
  border-right: 1px solid var(--v2-taupe-mid);
}

html[dir="rtl"] .ot-flow-step:last-child {
  border-right: 1px solid var(--v2-taupe-mid);
  border-left: 1px solid var(--v2-taupe-mid);
}

/* ── CONTACT FORM ── */
html[dir="rtl"] .contact-form-block label {
  text-align: right;
}

html[dir="rtl"] .contact-detail-item h4,
html[dir="rtl"] .contact-detail-item p {
  text-align: right;
}

/* ── FOOTER ── */
html[dir="rtl"] .footer-brand-wrap {
  flex-direction: row-reverse;
}

html[dir="rtl"] footer ul {
  text-align: right;
}

html[dir="rtl"] .footer-bottom {
  flex-direction: row-reverse;
}

/* ── PARTNER SECTION ── */
html[dir="rtl"] .wwa-partners-wrap {
  direction: rtl;
}

/* ── CHAIN ── */
html[dir="rtl"] .wwa-chain {
  flex-direction: row-reverse;
}

/* ── OFFER CARDS ── */
html[dir="rtl"] .home-offer-card a::after {
  content: ' ←';
}

/* ── OUD PAGE BANNER TAG ── */
html[dir="rtl"] .ot-banner-inner {
  direction: rtl;
}

/* ── STRIP TEXT ── */
html[dir="rtl"] .ot-strip-above,
html[dir="rtl"] .ot-strip-below {
  left: auto;
  right: 11%;
  text-align: right;
}

/* ── AR/EN LANGUAGE TABS (mobile top bar) ── */
.mobile-lang-tabs {
  display: none; /* hidden on desktop — nav-links handles it */
}

@media (max-width: 900px) {
  .mobile-lang-tabs {
    display: flex;
    align-items: center;
    gap: 2px;
    grid-column: 3;
    justify-self: end;
  }
  .mlt-active,
  .mlt-link {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 0.28rem 0.45rem;
    text-decoration: none;
    border: 1px solid var(--v2-taupe-mid);
    line-height: 1;
  }
  .mlt-active {
    background: var(--v2-navy);
    color: var(--v2-white);
    border-color: var(--v2-navy);
    cursor: default;
  }
  .mlt-link {
    background: transparent;
    color: var(--v2-navy);
  }
  .mlt-link:hover {
    background: var(--v2-navy);
    color: var(--v2-white);
    border-color: var(--v2-navy);
  }
}

/* ── MOBILE NAV — bolder font ── */
@media (max-width: 900px) {
  html[dir="rtl"] #mobile-nav a {
    font-family: 'Cairo', sans-serif;
    font-weight: 600;
    font-size: 1.15rem;
    letter-spacing: 0;
    text-transform: none;
    line-height: 1.6;
  }
}

/* ── MOBILE NAV ITEMS ── */
@media (max-width: 900px) {
  html[dir="rtl"] nav {
    direction: ltr;
    grid-template-columns: 44px 1fr auto;
  }

  html[dir="rtl"] .logo {
    grid-column: 2;
    flex-direction: column;
  }

  html[dir="rtl"] .logo-text {
    align-items: center;
  }

  html[dir="rtl"] .home-hero-content,
  html[dir="rtl"] .mfg-hero-content,
  html[dir="rtl"] .nat-hero-content,
  html[dir="rtl"] .oud-hero-content {
    right: auto;
    text-align: center;
  }

  html[dir="rtl"] .mfg-row {
    grid-template-columns: 1fr 44px;
    direction: rtl;
  }

  html[dir="rtl"] .mfg-row-aside {
    border-right: none;
    border-top: 1px solid var(--v2-taupe-mid);
    padding-right: 0;
    padding-top: 1rem;
    margin-top: 0.8rem;
  }

  html[dir="rtl"] .ot-who-right {
    border-right: none;
    border-top: 1px solid var(--v2-taupe-mid);
    padding-right: 0;
    padding-top: 2rem;
  }

  html[dir="rtl"] .wwa-banner-left {
    border-left: none;
    border-bottom: 1px solid var(--v2-taupe-mid);
  }

  html[dir="rtl"] .wwa-chain {
    flex-direction: row;
    flex-wrap: wrap;
  }
}


/* ── FIX: Remove letter-spacing & text-transform from Arabic text elements ── */

/* Desktop nav links */
html[dir="rtl"] .nav-links a {
  letter-spacing: 0;
  text-transform: none;
  font-family: 'Cairo', sans-serif;
}

/* Logo descriptor (tagline under logo) */
html[dir="rtl"] .logo-descriptor {
  letter-spacing: 0;
  text-transform: none;
  font-family: 'Cairo', sans-serif;
  font-size: 0.65rem;
}

/* Footer section headings (النطاق، التواصل) */
html[dir="rtl"] footer h5 {
  letter-spacing: 0;
  text-transform: none;
  font-family: 'Cairo', sans-serif;
}

/* Footer tagline (EU · Gulf · Asia) */
html[dir="rtl"] .footer-tagline {
  letter-spacing: 0;
  font-family: 'Cairo', sans-serif;
}

/* Footer links */
html[dir="rtl"] footer a,
html[dir="rtl"] footer li {
  font-family: 'Cairo', sans-serif;
  letter-spacing: 0;
}

/* Page eyebrow labels */
html[dir="rtl"] .hero-eyebrow,
html[dir="rtl"] .page-eyebrow {
  letter-spacing: 0.05em;
  font-family: 'Cairo', sans-serif;
}