/**
 * BET24 mobile header ? saldo + avatar (v2)
 * Fixes clipping/cutoff on small screens.
 */

/* ===== Base: right cluster never clipped ===== */
.menu[data-v-6f1b9634],
.menu {
  overflow: visible !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  gap: 8px !important;
}

.nav-cluster[data-v-6f1b9634],
.nav-cluster {
  min-width: 0 !important;
}

.nav-cluster--left[data-v-6f1b9634],
.nav-cluster--left {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.nav-cluster--right[data-v-6f1b9634],
.nav-cluster--right,
.nav-cluster.nav-cluster--right {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  margin-left: auto !important;
}

/* Logo must not eat the whole bar on mobile */
.mibilelogo[data-v-6f1b9634],
.mibilelogo,
.imagem-logo[data-v-6f1b9634],
.imagem-logo {
  max-width: 110px !important;
  width: auto !important;
}

.mibilelogo img,
.imagem-logo {
  max-height: 22px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* ===== Balance chip ===== */
.btn-balance[data-v-5b9e47bc],
.btn-balance,
.btn-balance.new[data-v-5b9e47bc] {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 1 auto !important;
  gap: 4px !important;
  min-height: 32px !important;
  max-height: 34px !important;
  height: 32px !important;
  padding: 0 8px 0 6px !important;
  margin: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  box-sizing: border-box !important;
}

.wallet-money[data-v-5b9e47bc],
.wallet-money {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: auto !important;
  max-width: none !important;
  overflow: visible !important;
  padding: 0 !important;
}

.realAmount[data-v-5b9e47bc],
.realAmount {
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  color: var(--color-text, #fff) !important;
}

/* Reload icon ? stable size, never cut */
.reloadButton[data-v-5b9e47bc],
.reloadButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  overflow: visible !important;
  line-height: 0 !important;
  color: var(--color-primary, #f5b800) !important;
  background: radial-gradient(circle at center, var(--color-surface-2, #2a2a2a) 0%, var(--color-background, #111) 70%, transparent 100%) !important;
  box-shadow: 0 0 8px var(--color-primary-alpha-045, rgba(255,180,0,.35)) !important;
}

.reloadButton svg,
.reloadButton[data-v-5b9e47bc] svg {
  width: 11px !important;
  height: 11px !important;
  min-width: 11px !important;
  min-height: 11px !important;
  max-width: 11px !important;
  max-height: 11px !important;
  display: block !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
}

.reloadButton svg path {
  fill: currentColor !important;
}

/* ===== Yellow + deposit ===== */
.btn-deposit-nav[data-v-6f1b9634],
.btn-deposit-nav {
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  gap: 0 !important;
  justify-content: center !important;
  border-radius: 50% !important;
  overflow: visible !important;
}

.btn-deposit-nav-label[data-v-6f1b9634],
.btn-deposit-nav-label {
  display: none !important;
}

/* ===== Avatar ===== */
.margin-teste[data-v-6f1b9634],
.margin-teste {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  margin-left: 2px !important;
  margin-right: 0 !important;
  overflow: visible !important;
  width: auto !important;
  height: auto !important;
}

.margin-teste button[data-dropdown-toggle="dropdown-user2"],
.margin-teste > button,
button.nav-avatar-btn {
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  max-width: 32px !important;
  max-height: 32px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  border: 2px solid var(--color-primary, #f5b800) !important;
  background: var(--color-surface-2, #1a1a1a) !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  line-height: 0 !important;
}

.margin-teste button img,
.margin-teste img,
button.nav-avatar-btn img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
}

/* Kill old fixed positioning that pushes deposit/avatar off-screen */
@media (max-width: 480px) {
  .menudepositoperfil[data-v-6f1b9634],
  .menudepositoperfil {
    position: static !important;
    right: auto !important;
  }

  .menu[data-v-6f1b9634],
  .menu {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .mibilelogo[data-v-6f1b9634],
  .mibilelogo {
    max-width: 88px !important;
    width: auto !important;
  }

  .nav-cluster--right {
    gap: 5px !important;
  }

  .btn-balance[data-v-5b9e47bc],
  .btn-balance {
    padding: 0 6px 0 4px !important;
    height: 30px !important;
    min-height: 30px !important;
  }

  .realAmount[data-v-5b9e47bc],
  .realAmount {
    font-size: 11px !important;
  }

  .btn-deposit-nav[data-v-6f1b9634],
  .btn-deposit-nav,
  .margin-teste button,
  button.nav-avatar-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }
}

/* Very small phones: compress further but never clip */
@media (max-width: 360px) {
  .mibilelogo[data-v-6f1b9634],
  .mibilelogo {
    max-width: 72px !important;
  }

  .realAmount[data-v-5b9e47bc],
  .realAmount {
    font-size: 10.5px !important;
  }

  .nav-cluster--right {
    gap: 4px !important;
  }

  .btn-balance[data-v-5b9e47bc],
  .btn-balance {
    padding: 0 5px 0 3px !important;
  }
}

/* Extra-tight: hide currency decoration only if needed via smaller type ? keep full value visible */
@media (max-width: 320px) {
  .mibilelogo[data-v-6f1b9634],
  .mibilelogo {
    max-width: 56px !important;
  }
}

/* Avatar lightbox removido — clique no avatar vai para /profile/account */
.bet24-avatar-lightbox {
  display: none !important;
}