/* =========================================================
   OmniumHub — i18n.css
   تصميم زر تغيير اللغة
   ========================================================= */

.lang-switcher {
  position: fixed;
  top: 20px;
  left: 20px;
  z-index: 9000;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(6,22,52,.85);
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  border: 1px solid rgba(255,255,255,.15);
  color: #fff;
  font-family: 'Cairo', system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 12px 28px -12px rgba(0,0,0,.6);
  transition: transform .15s ease, background .2s ease, box-shadow .25s ease;
}
.lang-switcher:hover {
  transform: translateY(-2px);
  background: rgba(30,136,229,.25);
  box-shadow: 0 16px 32px -12px rgba(30,136,229,.6);
}
.lang-switcher:active {
  transform: translateY(0);
}
.lang-globe {
  font-size: 16px;
  line-height: 1;
}

/* موضع الزر عند RTL */
html[dir="rtl"] .lang-switcher {
  left: auto;
  right: 20px;
}
html[dir="ltr"] .lang-switcher {
  right: auto;
  left: 20px;
}

/* على الجوال — تصغير */
@media (max-width: 480px) {
  .lang-switcher {
    padding: 8px 12px;
    font-size: 12px;
    top: 14px;
  }
  html[dir="rtl"] .lang-switcher { right: 14px; }
  html[dir="ltr"] .lang-switcher { left: 14px; }
}

/* لا تضع الزر على لوحة الإدارة */
body.admin-page .lang-switcher {
  display: none !important;
}

/* ═══════════════════════════════════════════════
   خط مناسب للغة الإنجليزية
   ═══════════════════════════════════════════════ */
html.lang-en body {
  font-family: 'Inter', 'Cairo', system-ui, sans-serif;
}
html.lang-ar body {
  font-family: 'Cairo', system-ui, sans-serif;
}

/* ═══════════════════════════════════════════════
   زر اللغة داخل قائمة المستخدم
   ═══════════════════════════════════════════════ */
.user-menu-lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 10px;
  background: rgba(30,136,229,.12);
  border: 1px solid rgba(30,136,229,.35);
  color: #42a5f5;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s ease;
}
.user-menu-lang-btn:hover {
  background: rgba(30,136,229,.25);
  border-color: rgba(30,136,229,.55);
  color: #fff;
  transform: translateY(-1px);
}
.user-menu-lang-btn:active {
  transform: translateY(0);
}
.user-menu-lang-btn [data-lang-icon] {
  font-size: 14px;
  line-height: 1;
}

/* أخفِ الزر العائم القديم إن وُجد في أي صفحة */
.lang-switcher:not(.user-menu-lang-btn) {
  display: none !important;
}

/* ═══════════════════════════════════════════════
   RTL_switcher_fix_v1
   In Arabic (RTL) mode, move inline-styled
   language switchers to the LEFT side to avoid
   overlapping with the "Back to Home" button.
   In English (LTR) mode, keep them at the right.
   ═══════════════════════════════════════════════ */
html[dir="rtl"] button[data-lang-switcher][style] {
  right: auto !important;
  left: 16px !important;
}
@media (max-width: 480px) {
  html[dir="rtl"] button[data-lang-switcher][style] {
    right: auto !important;
    left: 14px !important;
    top: 14px !important;
  }
}

/* ═══════════════════════════════════════════════
   Phase 8c — Small copy button
   ═══════════════════════════════════════════════ */
.btn-copy-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  color: #dfe6ef;
  font-size: 11px;
  cursor: pointer;
  transition: all .15s ease;
  flex-shrink: 0;
  line-height: 1;
  font-family: inherit;
}
.btn-copy-sm:hover {
  background: rgba(30,136,229,.25);
  border-color: rgba(30,136,229,.55);
  color: #fff;
  transform: translateY(-1px);
}
.btn-copy-sm:active {
  transform: translateY(0);
}

/* Phase 10-C1 — Withdrawal summary marker */
.withdraw-summary::-webkit-details-marker { display: none; }
.withdraw-summary::marker { content: ''; }
.withdraw-summary { list-style: none; }
