/* ================================================================
   BETZULA CUSTOM NAV v4.0 — Full Betting Integration
================================================================ */

/* ── TELEGRAM BANNER ──────────────────────────────────────────── */
.telegram-banner-bc {
  background: #0d1e3d;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 9px 40px 9px 16px;
  font-size: 13px;
  font-weight: 700;
  position: relative !important;
  z-index: 100;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  width: 100%;
  box-sizing: border-box;
  /* Header ile bitişik olması için float/absolute kaldırıldı */
  top: auto !important;
  left: auto !important;
  transform: none !important;
}
.telegram-banner-bc a { color: #fff; text-decoration: none; display: flex; align-items: center; gap: 10px; }
.telegram-banner-bc i.bc-i-telegram { color: #29b6f6; font-size: 20px; }
.telegram-banner-bc .close-banner-bc {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  cursor: pointer; font-size: 14px; opacity: 0.7; color: #fff; padding: 4px;
}
.telegram-banner-bc .close-banner-bc:hover { opacity: 1; }

/* Banner + header birlikte bir component gibi dursun */
.layout-header-holder-bc {
  display: flex !important;
  flex-direction: column !important;
}

/* ── LOGGED-IN USER WRAP ──────────────────────────────────────── */
.bz-user-logged-wrap {
  display: flex; align-items: center; gap: 0; margin-left: 4px;
}

/* Bakiye metni — sade, kutu yok, ekrana doğrudan yerleşik */
.bz-balance-val {
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.3px;
  white-space: nowrap;
  cursor: pointer;
  line-height: 1;
  margin-right: 8px; /* bakiye ile profil arası boşluk */
}
.bz-balance-val:hover { opacity: 0.85; }

/* Profil ikonu — screenshot 2'deki gibi gri dolgulu daire */
.bz-profile-icon {
  width: 34px; height: 34px; border-radius: 50%;
  background: #5c6a7e;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 18px;
  transition: background 0.15s;
  flex-shrink: 0;
}
.bz-profile-icon:hover { background: #6d7b8f; }
.bz-profile-icon .bc-i-user { font-size: 18px; color: #b0b8c4; line-height: 1; }

/* Üç nokta butonu — sarı çember YOK, sade beyaz noktalar */
.bz-notif-btn {
  position: relative;
  width: 28px; height: 34px;
  background: transparent;
  border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 20px;
  flex-shrink: 0;
}
.bz-notif-btn:hover { opacity: 0.8; }
.bz-notif-btn i { font-size: 20px; color: #ffffff; line-height: 1; }

/* Rozet (sayı etiketi) — üç noktanın sağ üstünde */
.bz-notif-badge {
  position: absolute;
  top: -4px; right: -8px;
  background: #4CAF50;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  min-width: 16px; height: 16px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px;
  line-height: 1;
  border: 1.5px solid #111d33;
  pointer-events: none;
}

/* ── CONNECT TO WALLET — screenshot 2 stili ─────────────────── */
.hdr-connection-wallet-bc {
  display: flex;
  align-items: center;
  height: 28px;
  padding: 0;
  background: transparent;
  border: none;
}
.hdr-connection-wallet-bc a {
  display: flex; align-items: center; justify-content: center;
  background: #dac795;
  color: #000;
  font-weight: 700; font-size: 11px;
  text-decoration: none; text-transform: uppercase; letter-spacing: 0.5px;
  height: 100%;
  padding: 0 30px;
  border-radius: 0 6px 6px 0;
  gap: 6px;
  width: auto;
  min-width: 45%;
}
.hdr-connection-wallet-bc a:hover {
  background: #c9b67e;
}
.hdr-connection-wallet-bc a i {
  display: none; /* ikon gizle, sadece text */
}

/* ── BETTING SELECTED STATE ──────────────────────────────────── */
.sgm-market-g-i-cell-bc.bz-selected {
  background: rgba(22, 199, 46, 0.25) !important;
  border: 1px solid rgba(22, 199, 46, 0.6) !important;
  border-radius: 4px;
}

/* ── BETSLIP PANEL STYLES ────────────────────────────────────── */
.bz-betslip-item {
  padding: 12px;
  color: #fff;
}
.bz-betslip-match {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom: 10px;
}
.bz-betslip-match-label {
  font-size: 13px; font-weight: 700; color: rgb(218,199,149);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 85%;
}
.bz-betslip-remove {
  cursor: pointer; color: #ff5252; font-size: 16px; padding: 4px;
  transition: color 0.15s;
}
.bz-betslip-remove:hover { color: #ff8a80; }

.bz-betslip-info {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 12px;
}
.bz-betslip-bet-label {
  background: rgba(22,199,46,0.2); color: #16c72e; padding: 3px 10px;
  border-radius: 4px; font-size: 12px; font-weight: 700;
}
.bz-betslip-odd {
  background: #000; color: rgb(218,199,149); padding: 4px 12px;
  border-radius: 4px; font-weight: 800; font-size: 14px;
}

.bz-betslip-amount-row {
  margin-bottom: 12px;
}
.bz-betslip-amount-row label {
  display: block; font-size: 11px; color: #8899aa; margin-bottom: 4px;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.bz-bet-input {
  width: 100%; padding: 10px 12px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.15); background: rgba(0,0,0,0.4);
  color: #fff; font-size: 16px; font-weight: 700;
  outline: none; transition: border-color 0.2s;
  box-sizing: border-box;
}
.bz-bet-input:focus {
  border-color: rgb(218,199,149);
}
.bz-bet-input::placeholder { color: #556; }

.bz-betslip-potential {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-top: 1px solid rgba(255,255,255,0.08);
  margin-bottom: 6px;
}
.bz-betslip-potential span:first-child { color: #8899aa; font-size: 12px; }
#bz-potential-win {
  color: #16c72e; font-weight: 800; font-size: 16px;
}

.bz-betslip-balance {
  text-align: center; font-size: 11px; color: #667;
  padding: 6px 0;
}

/* ── BET HISTORY PANEL (KUPON & PROFILE) ─────────────────────── */
.bz-loading {
  text-align: center; color: #aaa; padding: 20px;
  font-size: 13px;
}
.bz-bet-history {
  display: flex; flex-direction: column; gap: 8px;
  padding: 8px;
}
.bz-bet-history-item {
  background: rgba(0,0,0,0.3); border-radius: 8px;
  padding: 10px 12px; border-left: 3px solid #556;
}
.bz-bet-history-item.bz-bet-pending { border-left-color: #f9a825; }
.bz-bet-history-item.bz-bet-won { border-left-color: #16c72e; }
.bz-bet-history-item.bz-bet-lost { border-left-color: #ff5252; }
.bz-bet-history-item.bz-bet-cancelled { border-left-color: #888; }

.bz-bet-h-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.bz-bet-h-match {
  font-size: 12px; font-weight: 700; color: rgb(218,199,149);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 70%;
}
.bz-bet-h-status {
  font-size: 10px; font-weight: 800; padding: 2px 8px;
  border-radius: 10px; text-transform: uppercase;
}
.bz-bet-pending .bz-bet-h-status { background: rgba(249,168,37,0.2); color: #f9a825; }
.bz-bet-won .bz-bet-h-status { background: rgba(22,199,46,0.2); color: #16c72e; }
.bz-bet-lost .bz-bet-h-status { background: rgba(255,82,82,0.2); color: #ff5252; }
.bz-bet-cancelled .bz-bet-h-status { background: rgba(136,136,136,0.2); color: #888; }

.bz-bet-h-details {
  display: flex; justify-content: space-between;
  font-size: 11px; color: #aab; margin-bottom: 4px;
}
.bz-bet-h-amounts {
  display: flex; justify-content: space-between;
  font-size: 12px; color: #dde; font-weight: 600;
}
.bz-bet-h-date {
  font-size: 10px; color: #667; margin-top: 4px;
}

/* ── PROFILE BETS PANEL ──────────────────────────────────────── */
.bz-profile-bets-panel {
  padding: 12px; margin: 0 8px;
}
.bz-profile-bets-title {
  color: rgb(218,199,149); font-size: 14px; font-weight: 800;
  padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom: 10px; text-transform: uppercase; letter-spacing: 0.5px;
}

/* ── NAVIGATION LINK BORDERS (match reference) ──────────────── */
.hdr-navigation-scrollable-content {
  display: flex !important;
  align-items: stretch !important;
  gap: 3px !important;
  padding: 4px 4px !important;
}

.hdr-navigation-link-bc {
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 3px !important;
  padding: 7px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  transition: background 0.15s ease !important;
  margin: 0 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
}

.hdr-navigation-link-bc:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

.hdr-navigation-link-bc .nav-menu-title {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

.hdr-navigation-scrollable-bc-holder {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* ── MOBILE TWEAKS ───────────────────────────────────────────── */
@media (max-width: 768px) {
  .bz-user-logged-wrap { gap: 5px; }
  .bz-balance-val { font-size: 12px; }
  .bz-profile-icon { width: 30px; height: 30px; font-size: 16px; }
  .bz-notif-btn { width: 24px; height: 30px; font-size: 18px; }
  .bz-notif-badge { top: -4px; right: -7px; min-width: 14px; height: 14px; font-size: 8px; }
  .bz-bet-history-item { padding: 8px 10px; }
}
