/* Sprache und Flaggen – an die Photoshopvorlage vom 14.09.2026 angelehnt. */
.header-inner {
  position: relative;
  padding-top: 10px;
}
.language-switcher {
  display: flex;
  align-items: center;
  gap: 4px;
  direction: ltr;
}
.header-inner > .language-switcher {
  position: absolute;
  top: 3px;
  right: 0;
  z-index: 4;
}
/* Im eingeblendeten Sticky Header entfällt die Sprachauswahl. */
.site-header.is-sliding-sticky .language-switcher {
  display: none;
}

.language-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 24px;
  padding: 2px 1px;
  border: 1px solid transparent;
  border-radius: 3px;
  line-height: 1;
  transition: background 160ms ease, border-color 160ms ease;
}
.language-flag img {
  display: block;
  width: 19.8px;
  height: 13.5px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}
.language-flag:hover,
.language-flag:focus-visible {
  background: #fff4cc;
  border-color: #c49b13;
  outline: 2px solid transparent;
}
.language-flag:focus-visible { outline-color: #a27a00; outline-offset: 2px; }
.language-flag.is-active { border-bottom: 2px solid #c9a21a; }
.language-name {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.dealer-topbar { position: relative; padding-top: 22px; }
.dealer-topbar > .language-switcher { position: absolute; right: 0; top: 1px; }
.translation-note { font-size: 0.8rem; line-height: 1.5; color: #686b70; margin-top: 0.65rem; }
.translated-copy { overflow-wrap: anywhere; }
@font-face {
  font-family: "Mobi24 Arabic";
  src: url("../fonts/noto-sans-arabic.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
html[dir="rtl"] body {
  font-family: "Mobi24 Arabic", Tahoma, Arial, sans-serif;
  line-height: 1.8;
}
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] button { font-family: inherit; }
html[dir="rtl"] p,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] label { letter-spacing: normal; }
html[dir="rtl"] .eyebrow,
html[dir="rtl"] .section-kicker,
html[dir="rtl"] .dealer-eyebrow,
html[dir="rtl"] .newsletter-eyebrow { letter-spacing: normal; }
/* Logo und die Flaggen bleiben wie in der Vorlage an ihrem Platz. */
html[dir="rtl"] .header-inner,
html[dir="rtl"] .main-navigation,
html[dir="rtl"] .nav-primary,
html[dir="rtl"] .nav-account,
html[dir="rtl"] .dealer-topbar { direction: ltr; }
html[dir="rtl"] .main-navigation a,
html[dir="rtl"] .dealer-account,
html[dir="rtl"] .dealer-brand span { direction: rtl; }
html[dir="rtl"] .nav-primary { flex-direction: row-reverse; }
html[dir="rtl"] .main-navigation { font-size: 0.86rem; gap: 24px; }
html[dir="rtl"] .nav-primary { gap: 22px; }
html[dir="rtl"] .nav-account { gap: 16px; }
html[dir="rtl"] .hero h1,
html[dir="rtl"] .home-hero h1,
html[dir="rtl"] .search-page-hero h1 { line-height: 1.5; }
html[dir="rtl"] .hero-copy,
html[dir="rtl"] .lead-copy { line-height: 1.9; }
html[dir="rtl"] .home-arrow,
html[dir="rtl"] .newsletter-arrow,
html[dir="rtl"] .bx-arrow-back,
html[dir="rtl"] .bx-link-external { transform: scaleX(-1); }
/* Sliderbewegung und Bildreihenfolge bleiben technisch links-nach-rechts. */
html[dir="rtl"] .home-offer-viewport,
html[dir="rtl"] .home-slider-controls,
html[dir="rtl"] .gallery-navigation,
html[dir="rtl"] .gallery-thumbnails { direction: ltr; }
html[dir="rtl"] .home-offer-track .vehicle-card { direction: rtl; }
html[dir="rtl"] .vehicle-title-row > strong,
html[dir="rtl"] .detail-price strong,
html[dir="rtl"] .dealer-vehicle-price,
html[dir="rtl"] .gallery-counter,
html[dir="rtl"] time,
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[type="password"],
html[dir="rtl"] input[inputmode="numeric"],
html[dir="rtl"] input[inputmode="decimal"],
html[dir="rtl"] input[name="vin"],
html[dir="rtl"] input[name="internal_number"],
html[dir="rtl"] input[name="postal_code"],
html[dir="rtl"] input[name="vat_id"] { direction: ltr; unicode-bidi: isolate; }
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[inputmode="numeric"],
html[dir="rtl"] input[inputmode="decimal"] { text-align: right; }
html[dir="rtl"] .legal-navigation,
html[dir="rtl"] .legal-card,
html[dir="rtl"] .dealer-form-section,
html[dir="rtl"] .register-card { text-align: start; }
html[dir="rtl"] .legal-card ol,
html[dir="rtl"] .legal-card ul,
html[dir="rtl"] .equipment-grid ul { padding-left: 0; padding-right: 1.5rem; }
html[dir="rtl"] .search-field select { background-position: left 14px center; padding-left: 40px; padding-right: 14px; }
html[dir="rtl"] .register-select i,
html[dir="rtl"] .dealer-select-wrap > i { right: auto; left: 14px; }
html[dir="rtl"] .register-select select,
html[dir="rtl"] .dealer-select-wrap select { padding-left: 40px; padding-right: 14px; }
html[dir="rtl"] .search-filter-toggle { text-align: right; }
html[dir="rtl"] .newsletter-consent,
html[dir="rtl"] .register-checkbox { text-align: right; }
html[dir="rtl"] .dealer-navigation a { text-align: start; }
html[dir="rtl"] .detail-breadcrumb { flex-wrap: wrap; }
html[dir="rtl"] .vehicle-title-row,
html[dir="rtl"] .dealer-page-heading { gap: 14px; }
html[dir="rtl"] .vehicle-title-row > div { min-width: 0; }
html[dir="rtl"] .vehicle-title-row > strong { flex-shrink: 0; }
@media (min-width: 901px) {
  .header-inner > .brand,
  .header-inner > .main-navigation { transform: translateY(3px); }
  .site-header.is-sliding-sticky .header-inner { min-height: 84px; }
  .main-navigation { gap: clamp(16px, 2.2vw, 38px); }
  .nav-primary { gap: clamp(14px, 1.8vw, 30px); }
  .nav-primary a,
  .nav-account a { white-space: nowrap; }
}
@media (min-width: 901px) and (max-width: 1250px) {
  html:not([lang="de"]) .brand img { width: 205px; }
  html:not([lang="de"]) .header-inner { gap: 20px; }
  html:not([lang="de"]) .main-navigation { font-size: 0.8rem; gap: 14px; }
  html:not([lang="de"]) .nav-primary { gap: 13px; }
  html:not([lang="de"]) .nav-account { gap: 12px; padding-left: 15px; }
}
@media (max-width: 900px) {
  .header-inner { min-height: 100px; padding-top: 20px; }
  .site-header.is-sliding-sticky .header-inner { min-height: 92px; }
  .header-inner > .language-switcher { top: 1px; right: 0; }
  .language-flag { width: 27px; height: 28px; }
  .header-inner > .brand,
  .header-inner > .menu-toggle { margin-top: 9px; }
  html[dir="rtl"] .nav-primary { flex-direction: column; }
  html[dir="rtl"] .nav-primary > a,
  html[dir="rtl"] .nav-account > a { text-align: right; }
  html[dir="rtl"] .nav-account { gap: 4px; }
  .dealer-topbar { padding-top: 35px; }
}
@media (max-width: 480px) {
  .brand img { max-width: 205px; }
  .header-inner { gap: 16px; }
  html[dir="rtl"] .home-hero h1 { font-size: clamp(1.8rem, 7vw, 2.5rem); }
}

/* Native Auswahllisten halten in RTL Platz für den links stehenden Pfeil frei. */
html[dir="rtl"] .field select {
  padding-right: 13px;
  padding-left: 34px;
}

/* Der geöffnete Kontobereich beginnt unter Logo und Sprachleiste. */
@media (max-width: 850px) {
  .dealer-topbar {
    min-height: 112px;
  }

  .dealer-topbar > .language-switcher {
    right: 18px;
  }

  .dealer-navigation {
    top: 112px;
  }
}
