.lang-suggest {
  position: fixed;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  background: #fff;
  color: #111;
  border: 1px solid #ddd;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  padding: 10px 14px;
  border-radius: 8px;
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 14px;
  max-width: 720px;
  width: calc(100% - 40px);
}
.lang-suggest img { width:24px; height:16px; object-fit:cover; border-radius:2px; }
.lang-suggest .msg { flex:1; }
.lang-suggest .actions { display:flex; gap:8px; }
.lang-suggest button { padding:6px 10px; border-radius:6px; border:1px solid #ccc; background:#f8f8f8; cursor:pointer; }
.lang-suggest .primary { background:#0078d4; color:#fff; border-color:#0078d4; }
@media (max-width:480px){ .lang-suggest { font-size:13px; padding:8px; } }

/* RTL safety: keep banner layout but ensure text aligns properly */
[dir="rtl"] .lang-suggest { direction: rtl; }

/* RTL support for the suggestion banner itself */
.lang-suggest[dir="rtl"],
.lang-suggest.rtl {
  direction: rtl;
  text-align: right;
}

/* Reverse action buttons order in RTL for natural layout */
.lang-suggest[dir="rtl"] .actions,
.lang-suggest.rtl .actions {
  flex-direction: row-reverse;
}