/**
 * Honor Co-Create — RTL overrides (Arabic)
 * Loaded after style.min.css when lang=ar. Bootstrap RTL handles most layout.
 */

html[dir="rtl"] {
  --font-display: "IBM Plex Sans Arabic", "Manrope", "Segoe UI", Tahoma, sans-serif;
  --font-body: "IBM Plex Sans Arabic", "Source Sans 3", "Segoe UI", Tahoma, sans-serif;
}

html[dir="rtl"] body {
  font-family: var(--font-body);
  text-align: right;
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] .section-title,
html[dir="rtl"] .hero-caption h1,
html[dir="rtl"] .navbar-brand .brand-text {
  font-family: var(--font-display);
}

/* Hero caption: keep readable padding on both sides */
html[dir="rtl"] .hero-caption .container {
  text-align: right;
}

/* Values infographic arrows face reading direction */
html[dir="rtl"] .values-infographic-arrow {
  transform: scaleX(-1);
}

/* Input icons: mirror start/end */
html[dir="rtl"] .input-icon > .bi {
  left: auto;
  right: 0.95rem;
}

html[dir="rtl"] .input-icon .form-control {
  padding-left: 0.9rem;
  padding-right: 2.55rem;
}

/* Quote contact / check list icons */
html[dir="rtl"] .quote-promises .bi,
html[dir="rtl"] .check-list .bi {
  margin-left: 0.5rem;
  margin-right: 0;
}

html[dir="rtl"] .check-list li::before {
  margin-left: 0.65rem;
  margin-right: 0;
}

/* Solution / explore links */
html[dir="rtl"] .solution-link {
  display: inline-flex;
  flex-direction: row-reverse;
  gap: 0.25rem;
}

/* Split badge / media frame stays LTR-safe */
html[dir="rtl"] .split-badge {
  text-align: right;
}

/* Product code badge alignment */
html[dir="rtl"] .product-code {
  margin-right: auto;
  margin-left: 0;
}

/* Lang switcher spacing */
html[dir="rtl"] .lang-switch a {
  letter-spacing: 0;
}

/* Navbar brand text */
html[dir="rtl"] .navbar-brand strong {
  letter-spacing: 0;
}

/* Footer small caps / uppercase labels: avoid excessive tracking in Arabic */
html[dir="rtl"] .text-uppercase {
  letter-spacing: 0.02em;
}

html[dir="rtl"] .pillars,
html[dir="rtl"] .eyebrow,
html[dir="rtl"] .hero-eyebrow {
  letter-spacing: 0.04em;
}

/* Soften italic emphasis in Arabic titles (less common typographically) */
html[dir="rtl"] .section-title em,
html[dir="rtl"] .hero-caption h1 em {
  font-style: normal;
  color: var(--hc-teal-bright, #2AA5A0);
}
