/* L1 (22 Oct 2026): the language button on Home - one tap, in the frozen header next to the cart.
   It names the other language in its own script and font, so an Arabic speaker finds "العربية" on an
   English page at a glance (and "English" on an Arabic page). Colours come only from the theme's roles,
   so every style (heritage and the generated ones) draws it in its own colours. */
.lang-quick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  height: 44px;
  min-width: 44px;
  padding: 0 14px 0 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--bg-2);
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.12s ease;
}
[dir="rtl"] .lang-quick { padding: 0 11px 0 14px; }
.lang-quick:hover { border-color: color-mix(in srgb, var(--orange) 55%, var(--line)); }
.lang-quick:active { transform: scale(0.96); }
.lang-quick:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
.lang-quick[lang="ar"] { font-family: "Cairo", "Outfit", system-ui, sans-serif; font-size: 15px; }
.lang-quick[lang="en"] { font-family: "Outfit", "Cairo", system-ui, sans-serif; }
.lang-quick-icon {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: var(--orange);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.lang-quick span { padding-top: 1px; }
/* a narrow phone keeps the branch line readable: the globe goes, the word stays */
@media (max-width: 359px) {
  .lang-quick { padding: 0 12px; }
  .lang-quick-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lang-quick { transition: none; }
  .lang-quick:active { transform: none; }
}