/* =========================================================
   Carmala — language button + Arabic (right-to-left) styles
   Load after style.css and menu.css.
   ========================================================= */

/* ---------- language button in the nav ---------- */
.nav__end { justify-self: end; display: flex; align-items: center; gap: .4rem; }
.nav__end .nav__cta { justify-self: auto; }

.lang-btn {
  padding: .55rem .85rem;
  border: 1.5px solid rgba(53, 72, 16, .3); border-radius: 999px;
  background: transparent; color: #354810;
  font-family: "Tajawal", "Montserrat", system-ui, sans-serif;
  font-size: .88rem; font-weight: 700; line-height: 1;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}
.lang-btn:hover { border-color: #4E6320; background: rgba(78, 99, 32, .08); }
html[lang="ar"] .lang-btn { font-family: "Montserrat", system-ui, sans-serif; font-size: .74rem; }

/* ---------- Arabic typography ---------- */
html[lang="ar"] {
  /* Latin words keep their fonts, Arabic letters use Amiri / Aref Ruqaa */
  --serif: "Libre Caslon Text", "Amiri", Georgia, serif;
  --script: "Playball", "Aref Ruqaa", cursive;
  font-size: 106.25%;
}
/* spaced-out letters break Arabic joining */
html[lang="ar"] *,
html[lang="ar"] *::before,
html[lang="ar"] *::after { letter-spacing: 0 !important; }

/* small spaced-caps labels need a bigger size in Arabic */
html[lang="ar"] .btn { font-size: .92rem; }
html[lang="ar"] .btn--sm { font-size: .84rem; }
html[lang="ar"] .eyebrow,
html[lang="ar"] .hero__brand { font-size: .95rem; }
html[lang="ar"] .nav__menu { font-size: .9rem; }
html[lang="ar"] .ticker__list li { font-size: clamp(.95rem, 1.5vw, 1.1rem); }
html[lang="ar"] .chip { font-size: .88rem; }
html[lang="ar"] .tag { font-size: .78rem; }
html[lang="ar"] .price { font-size: .9rem; }
html[lang="ar"] .footer h3 { font-size: .9rem; }

html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3 { line-height: 1.4; }
html[lang="ar"] .hero__title { line-height: 1.05; }
html[lang="ar"] .reviews__note,
html[lang="ar"] .footer__kicker { line-height: 1.5; }
html[lang="ar"] .note blockquote { font-style: normal; line-height: 1.7; }

/* ---------- right-to-left fixes ---------- */
html[dir="rtl"] .nav__menu { padding: 0 0 0 .6rem; }
html[dir="rtl"] .skip { left: auto; right: -9999px; }
html[dir="rtl"] .skip:focus { right: 1rem; }
html[dir="rtl"] .hero { overflow-x: clip; }
html[dir="rtl"] .hero__float--olives { right: auto; left: 2%; }
html[dir="rtl"] .hero__float--leaf { left: auto; right: 0; }
html[dir="rtl"] .hero__float--spoon { left: auto; right: -6%; }
html[dir="rtl"] .ticker__track { animation-name: ticker-rtl; }
@keyframes ticker-rtl { to { transform: translateX(50%); } }

/* ---------- small phones: keep the nav on one line ---------- */
@media (max-width: 420px) {
  .nav { gap: .4rem; }
  .logo__text { display: none; }
  .lang-btn { padding: .5rem .7rem; }
}