/* assets/zlot/zlot.css  -  Zlot ek davranis CSS'i.
   272zlot.com'un kendi CSS'inin uzerine eklenir; sadece JS-injected
   drawer/modal/tab davranislari ve mobil safe-area dokunuslar icindir.
*/

/* === Zlot palette referans (bilgi amacli) ============================
 * cyan brand:   #4EFBF0
 * cyan-d:       #1FE1D1
 * magenta:      #EC44FB
 * amber:        #FFB444
 * orange:       #FF8743
 * red:          #EE0039
 * green:        #74E22B
 * chrome bg:    #24292D  (body)
 * chrome surf:  #1B1F22  (header)
 * content bg:   #EDF2F2  (main)
 * ===================================================================== */

/* === Drawer (mobil yan menu) — orijinal 272zlot.com kalibi ============
 * Kullanici acik tema + dar genislik + yuvarlak koseler istedi.
 * Orijinal CSS variable'lari ('--landing-v2-right-menu-bg' vb)
 * '#component' scope'unda olabildigi icin bizim CSS'imizde TEKRAR tanimlariz.
 */
[class*="side-menu-wrapper-mobile--"] {
  /* Orijinal CSS variable'lari (eski CSS'te scope kaybolmus olabilir) */
  --landing-v2-right-menu-bg: #f4f5f6;
  --landing-v2-right-menu-shadow: 0 -1px 0 0 #dde1e4 inset;
  --landing-v2-right-menu-item-active-bg: linear-gradient(90deg, #fff, #f4f5f6);
  --text: #2d3439;
  --active: #b544fb;
  --background: #edf2f2;

  /* Orijinal kurallar (verilen CSS'ten) */
  background-color: #f4f5f6;
  color: #2d3439;
  box-sizing: border-box;
  cursor: auto;
  visibility: visible;
  white-space: normal;
  z-index: 9999;
  flex-direction: column;
  justify-content: space-between;
  width: 320px;
  max-width: calc(100dvw - 60px);
  height: calc(100dvh - 32px);
  margin: 16px 0;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  font-family: Outfit, sans-serif;
  position: fixed;
  top: 0;
  right: -360px;                  /* baslangic: ekrandan disari, sag tarafa */
  display: none;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .15);
  transition: right .3s linear;
  overflow: hidden;
}
[class*="side-menu-wrapper-mobile--"].visible--U9uv_ {
  display: flex;
  right: 16px;                     /* ekran kenarindan icerde (margin gibi) */
}

/* Drawer ust header */
[class*="side-menu-wrapper-mobile--"] [class*="mobile-header--"] {
  justify-content: space-between;
  align-items: center;
  margin: 12px 8px;
  padding: 0 16px;
  display: flex;
  position: relative;
  background: transparent;
}
[class*="side-menu-wrapper-mobile--"] [class*="logo-icon--H3gAE"],
[class*="side-menu-wrapper-mobile--"] [class*="mobile-header--"] img {
  filter: invert(1);               /* beyaz tema icin koyu logo */
  width: 54px;
  height: 30px;
}
[class*="side-menu-wrapper-mobile--"] [class*="close--airbs"],
[class*="side-menu-wrapper-mobile--"] [class*="close--"] {
  background: #fff;
  border: 2px solid #dde1e4;
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  padding: 9px;
  display: flex;
  width: 32px;
  height: 32px;
  box-sizing: border-box;
}

/* "Zlot'a Hoş Geldiniz" bolumu */
[class*="side-menu-wrapper-mobile--"] [class*="not-logged-container--"] {
  flex-direction: column;
  align-items: center;
  display: flex;
  padding: 0 0 8px;
  box-shadow: 0 -1px 0 0 #dde1e4 inset;
}
[class*="side-menu-wrapper-mobile--"] [class*="not-logged-text--"] {
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: 0 24px;
  display: flex;
}
[class*="side-menu-wrapper-mobile--"] [class*="not-logged-title--"] {
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: #000 !important;
  text-transform: capitalize;
  text-align: start;
}
[class*="side-menu-wrapper-mobile--"] [class*="not-logged-subtitle--"] {
  color: #2d3439;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  overflow-wrap: break-word;
  white-space: pre-wrap;
}
[class*="side-menu-wrapper-mobile--"] [class*="not-logged-container-buttons--"] {
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  display: flex;
  width: 100%;
}

/* Drawer Giris/Kayit butonlari — orijinal renkler */
[class*="side-menu-wrapper-mobile--"] [class*="btn-login--"] {
  background: linear-gradient(180deg, #4efbf0 0%, #4ed1fb 100%);
  color: #000;
  border-radius: 22px;
  height: 40px;
  font-size: 14px;
  font-weight: 500;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  min-width: 130px;
}
[class*="side-menu-wrapper-mobile--"] [class*="btn-join-now--"] {
  background: linear-gradient(180deg, #ec44fb 0%, #b544fb 100%);
  color: #fff;
  border-radius: 22px;
  height: 40px;
  font-size: 14px;
  font-weight: 500;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  min-width: 130px;
}

/* Menu link itemleri — beyaz tema, ince ayrac */
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"] {
  box-shadow: 0 -1px 0 0 #dde1e4 inset;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  width: 100%;
  height: 48px;
  padding: 10px 24px;
  line-height: 28px;
  display: flex;
  position: relative;
  color: #2d3439;
  background: transparent;
  text-decoration: none;
}
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"]:last-of-type {
  border-bottom: none;
}
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"].active {
  background: linear-gradient(90deg, #fff, #f4f5f6);
}
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"].active svg {
  color: #b544fb;
}
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"].active::before {
  background: #b544fb;
  content: "";
  z-index: 1;
  width: 2px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  border-top-right-radius: 40%;
  border-bottom-right-radius: 40%;
}
[class*="side-menu-wrapper-mobile--"] [class*="nav-link-item--"] svg {
  color: #2d3439;
  flex-shrink: 0;
}

/* "Yeni" badge */
[class*="side-menu-wrapper-mobile--"] [class*="new-label--"],
[class*="side-menu-wrapper-mobile--"] [class*="label--"] {
  background: #ffb444;
  color: #2d3439;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
  font-weight: 500;
}
[class*="side-menu-wrapper-mobile--"] [class*="end--"] {
  margin-inline-start: auto;
}

/* Dil dropdown / TR bayrak */
[class*="side-menu-wrapper-mobile--"] [class*="language-trigger-v2--"] {
  background: #24292d;
  border-radius: 18px;
  align-items: center;
  gap: 8px;
  width: 60px;
  height: 32px;
  padding: 8px 12px;
  display: flex;
  color: #fff;
  border: 0;
}

/* Scroll wrapper — React ScrollbarsCustom zincirini SADELESTIR:
 * Tum ic wrapper'lari "saydam" yap (position static, padding/margin/inset sifir),
 * gercek scroll'u en dis .ScrollbarsCustom div'inde tutalim. Bu sayede flex
 * column drawer'inda nav listesi taşinca touch scroll cihazda calisir. */
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom,
[class*="side-menu-wrapper-mobile--"] [class*="bet-scroll--"] {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;             /* flex item taşmayı dogru hesaplasin */
  width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  position: relative !important;
}
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom-Wrapper,
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom-Scroller,
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom-Content {
  position: static !important;
  inset: auto !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  transform: none !important;
}
/* React tarafindan eklenen scroll trackleri tamamen gizle (kendi browser
 * scroll'umuzu kullaniyoruz). */
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom-Track,
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom-Thumb {
  display: none !important;
}
/* WebKit native scrollbar'i ince ve discrete yap */
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom::-webkit-scrollbar,
[class*="side-menu-wrapper-mobile--"] [class*="bet-scroll--"]::-webkit-scrollbar {
  width: 4px;
}
[class*="side-menu-wrapper-mobile--"] .ScrollbarsCustom::-webkit-scrollbar-thumb,
[class*="side-menu-wrapper-mobile--"] [class*="bet-scroll--"]::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, .2);
  border-radius: 4px;
}

/* content--JO2Fm: nav listesi ve bottom-side arasinda BOSLUK kalmasin.
 * Orijinal CSS justify-content:space-between veriyor → az icerikte
 * arada gap oluyor. Flex-start + gap:0 ile baslayalim. */
[class*="side-menu-wrapper-mobile--"] [class*="content--JO2Fm"] {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  height: auto !important;
  min-height: 100% !important;
  padding: 0 !important;
}
/* nav-link-item listesini saran ilk div — gap kapat */
[class*="side-menu-wrapper-mobile--"] [class*="content--JO2Fm"] > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* "Canli Destek 7/24" + "Sosyal Medya" alt blok
 * margin-top: auto → liste kisaysa bottom alta itilir, listeyle bitisik degil ama
 * bunu istiyoruz cunku orijinalde bottom-side scrollun ICINDE liste hemen altinda
 * gozukuyor. margin-top: 0 yapalim. */
[class*="side-menu-wrapper-mobile--"] [class*="bottom-side--"] {
  padding: 12px 8px;
  flex-direction: column;
  display: flex;
  gap: 4px;
  margin-top: 0 !important;            /* nav listesinin hemen altina yapis */
  flex-shrink: 0;
}
[class*="side-menu-wrapper-mobile--"] [class*="button-container--"] {
  background: #fff;
  border-radius: 50px;
  height: 48px;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Backdrop */
.zlot-drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
.zlot-drawer-backdrop.zlot-show {
  opacity: 1;
  visibility: visible;
}

/* Hamburger ikonu */
[class*="drawer-menu--"][class*="drawer-menu--"] {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* === Modal (Giris / Kayit) ===========================================
 * Tum stil orijinal 272zlot CSS'inden geliyor (sayfada zaten yuklu);
 * sadece data-zlot-modal[hidden] icin display:none uygulanir (browser
 * default ile zaten gelir ama IE/eski destek icin acik yazıyoruz).
 *
 * Acik state'te: overlay--ucUm3 ve bottom-sheet--WiUhn orijinal kurallari
 * ile (position:fixed, bottom:0 vb.) calisir.
 */
[data-zlot-modal][hidden] { display: none !important; }
/* Orijinal .content--SlA80 / .content--Gw71E "display:block/flex" veriyor; [hidden]
   attribute'unu zorlayarak pane swap'ı çalıştırıyoruz. */
[data-zlot-modal] [data-zlot-pane][hidden] { display: none !important; }
[data-zlot-modal] {
  /* iOS safe-area icin alt padding */
  --zlot-safe-bottom: env(safe-area-inset-bottom);
}
[data-zlot-modal] .bottom-sheet--WiUhn {
  padding-bottom: var(--zlot-safe-bottom);
}

/* ===== Bonusunu Seç dropdown listesi (register form) ===== */
.zlot-bonus-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--color-2, #e8ebed);
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
  padding: 6px;
  z-index: 10;
  max-height: 260px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.zlot-bonus-list[hidden] { display: none; }
.zlot-bonus-list button {
  background: transparent;
  border: 0;
  text-align: left;
  padding: 12px 16px;
  border-radius: 12px;
  font: 500 14px/1.3 Outfit, sans-serif;
  color: var(--text, #2d3439);
  cursor: pointer;
  transition: background .15s ease;
}
.zlot-bonus-list button:hover { background: var(--cultured, #f4f5f6); }

/* ===== Toast / uyarı pop-up ===== */
.zlot-toast {
  position: fixed;
  top: 18px;
  left: 50%;
  z-index: 10100;
  transform: translateX(-50%) translateY(-160%);
  background: linear-gradient(180deg, #FFB444 0%, #FF8743 100%);
  color: #1B1F22;
  padding: 12px 18px;
  border-radius: 999px;
  font: 600 14px/1.3 Outfit, Helvetica, Arial, sans-serif;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, .35),
    0 0 0 1px rgba(255, 255, 255, .12) inset;
  max-width: min(92vw, 460px);
  display: flex;
  align-items: center;
  gap: 10px;
  opacity: 0;
  pointer-events: none;
  transition: transform .35s cubic-bezier(.16, 1, .3, 1), opacity .25s ease;
  margin-top: env(safe-area-inset-top);
  white-space: normal;
  text-align: center;
}
.zlot-toast.zlot-show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.zlot-toast[data-type="error"] {
  background: linear-gradient(180deg, #EE0039 0%, #B91D0D 100%);
  color: #fff;
}
.zlot-toast[data-type="success"] {
  background: linear-gradient(180deg, #74E22B 0%, #4EA31E 100%);
  color: #fff;
}
.zlot-toast .zlot-toast-ic {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.zlot-toast .zlot-toast-ic svg { width: 100%; height: 100%; }
.zlot-toast .zlot-toast-msg { line-height: 1.3; }

/* ===== Bonus seç dropdown'a position için parent relative ===== */
[data-zlot-bonus] { position: relative; }

/* === Pill tab aktif state (bizden) ==================================== */
.zlot-active {
  background: linear-gradient(180deg, #4EFBF0 0%, #4ED1FB 100%) !important;
  color: #1B1F22 !important;
}

/* === iOS safe area + body bg fallback ================================ */
body {
  -webkit-overflow-scrolling: touch;
}

/* === Auth: kullanici pill (header bar'da Giris/Kayit yerine) ============ */
.zlot-user-pill {
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none;
  background: linear-gradient(135deg, rgba(78,251,240,.12), rgba(186,93,255,.12));
  border: 1px solid rgba(78,251,240,.35); border-radius: 999px;
  padding: 4px 12px 4px 4px; color: #fff; font-family: inherit; cursor: pointer;
  transition: background .2s, transform .15s;
}
.zlot-user-pill:hover, .zlot-user-pill:active {
  background: linear-gradient(135deg, rgba(78,251,240,.22), rgba(186,93,255,.22));
  transform: scale(0.97);
}
.zlot-up-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, #4EFBF0, #BA5DFF); color: #0F1722;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.zlot-up-info { display: inline-flex; flex-direction: column; gap: 0; line-height: 1.15; }
.zlot-up-name {
  font-size: 11px; font-weight: 700; color: #fff;
  max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.zlot-up-balance { font-size: 12px; font-weight: 800; color: #4EFBF0; letter-spacing: 0.2px; }

/* === Drawer: kullanici karti (uye ise drawer ustunde) =================== */
.zlot-drawer-user {
  margin: 14px 16px; padding: 16px;
  background: linear-gradient(135deg, rgba(78,251,240,.10), rgba(186,93,255,.08));
  border: 1px solid rgba(78,251,240,.25); border-radius: 16px; color: #fff;
}
.zdu-row { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.zdu-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: linear-gradient(135deg, #4EFBF0, #BA5DFF); color: #0F1722;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.zdu-info { flex: 1; min-width: 0; }
.zdu-name {
  font-size: 16px; font-weight: 700; color: #fff;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.zdu-code { font-size: 11px; color: rgba(255,255,255,.6); margin-top: 2px; font-family: ui-monospace, "SF Mono", Menlo, monospace; }
.zdu-balance { padding: 10px 12px; background: rgba(0,0,0,.25); border-radius: 10px; margin-bottom: 12px; }
.zdu-bal-label { font-size: 11px; color: rgba(255,255,255,.65); text-transform: uppercase; letter-spacing: 0.6px; }
.zdu-bal-amount { font-size: 22px; font-weight: 800; color: #4EFBF0; margin-top: 4px; letter-spacing: 0.3px; }
.zdu-bonus { font-size: 12px; color: #FFB444; margin-top: 4px; font-weight: 600; }
.zdu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.zdu-btn {
  display: flex; align-items: center; justify-content: center;
  padding: 11px 8px; border-radius: 10px; font-size: 13px; font-weight: 700;
  text-decoration: none; text-align: center; transition: transform .15s;
}
.zdu-btn:active { transform: scale(0.96); }
.zdu-deposit { background: linear-gradient(135deg, #2EE38A, #00B860); color: #001a0d; }
.zdu-withdraw { background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.15); }

/* === Toast container (footer.php tarafindan basilir) ===================== */
#zlot-toasts {
  position: fixed; top: 0; left: 0; right: 0; z-index: 99999;
  display: flex; flex-direction: column; align-items: center; pointer-events: none;
  padding-top: env(safe-area-inset-top, 0);
}

/* === Account pill: balance popup (chevron'a tikla -> Bakiye/Bonus/Free Bet)
 * NOT: pozisyon JS tarafindan fixed/top/right ile ayarlanir; burada
 * sadece gorsel stil tanimlari var.
 */
.zlot-balance-popup {
  min-width: 240px;
  max-width: calc(100vw - 16px);
  padding: 14px 16px 8px;
  background: #1B1F22;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,.5), 0 4px 12px rgba(0,0,0,.3);
  color: #fff;
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  animation: zlotBalancePopupIn .18s ease-out;
}
.zlot-balance-popup[hidden] { display: none !important; }
@keyframes zlotBalancePopupIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Ust ucgen ok (sag tarafa hizali) */
.zlot-balance-popup::before {
  content: '';
  position: absolute;
  top: -6px; right: 18px;
  width: 12px; height: 12px;
  background: #1B1F22;
  border-left: 1px solid rgba(255,255,255,.06);
  border-top: 1px solid rgba(255,255,255,.06);
  transform: rotate(45deg);
}
.zlot-balance-popup .detail--JRXlw {
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px; padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
  font-size: 13px;
}
.zlot-balance-popup .detail--JRXlw:last-of-type { border-bottom: none; }
.zlot-balance-popup .detail--JRXlw > .ellipsis--Z23bR {
  color: rgba(255,255,255,.7); font-weight: 400; letter-spacing: -0.1px;
}
.zlot-balance-popup .detail--JRXlw .balance--_tdhz {
  color: #4EFBF0; font-weight: 600; font-size: 14px; letter-spacing: -0.1px;
}
.zlot-balance-popup .detail--JRXlw .free-bet-balance--ahGHB {
  color: #FFB444 !important;
}
/* Popup acikken pill'in chevron'u dondurulur (zlot.js inline stiliyle override) */
[data-zlot-popup-open] [class*="collapse--KJrPA"] {
  transition: transform .15s ease;
}

/* === Account menu popup (avatar tikinda) — orijinal header-menu--d7J5l
 * Pozisyon JS tarafindan fixed/top/right ile ayarlanir.
 */
.zlot-account-menu-popup {
  min-width: 280px;
  max-width: calc(100vw - 16px);
  padding: 16px;
  background: #1B1F22;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,.5), 0 4px 12px rgba(0,0,0,.3);
  color: #fff;
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  animation: zlotBalancePopupIn .18s ease-out;
}
.zlot-account-menu-popup[hidden] { display: none !important; }
.zlot-account-menu-popup::before {
  content: '';
  position: absolute;
  top: -6px; right: 14px;
  width: 12px; height: 12px;
  background: #1B1F22;
  border-left: 1px solid rgba(255,255,255,.06);
  border-top: 1px solid rgba(255,255,255,.06);
  transform: rotate(45deg);
}

.zlot-account-menu-popup .profile--HFrPM {
  padding-bottom: 12px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.zlot-account-menu-popup .user-name--MHVMB {
  font-size: 16px; font-weight: 700; color: #fff; letter-spacing: -0.3px;
}
.zlot-account-menu-popup .widget-level--iE9HX {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: rgba(255,255,255,.7);
}
.zlot-account-menu-popup .widget-level--iE9HX > span { color: rgba(255,255,255,.65); }
.zlot-account-menu-popup .widget-level--iE9HX > div {
  color: #fff; font-weight: 600;
}

.zlot-account-menu-popup .vip-club-player-state--wqiB4 {
  display: flex; flex-direction: column; gap: 10px; margin-top: 8px;
}
.zlot-account-menu-popup .vip-club-progress-wrapper--x7X3v {
  display: flex; flex-direction: column; gap: 6px;
}
.zlot-account-menu-popup .vip-club-progress-header--yL457 {
  display: flex; justify-content: space-between; align-items: center;
}
.zlot-account-menu-popup .vip-club-progress-title--qvkdr {
  font-size: 12px; color: rgba(255,255,255,.65); font-weight: 500;
}
.zlot-account-menu-popup .info-block--hcayD {
  display: inline-flex; align-items: center; gap: 6px;
  color: #fff; font-size: 13px; font-weight: 700;
}
.zlot-account-menu-popup .progress-percent--cHPbN { letter-spacing: 0.2px; }
.zlot-account-menu-popup .info--VfdVN {
  color: rgba(255,255,255,.45);
  display: inline-flex; align-items: center;
}

.zlot-account-menu-popup .vip-club-progress-container--kHaEg {
  width: 100%; height: 5px;
  background: rgba(255,255,255,.08);
  border-radius: 999px; overflow: hidden;
}
.zlot-account-menu-popup .vip-club-progress-line--_4tWF {
  height: 100%; background-color: #4EFBF0;
  border-radius: 999px;
  transition: width 2s ease-out;
}

/* Linkler: orjinal sade gorunum (background YOK, sadece divider) */
.zlot-account-menu-popup .link--eaQpx {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 0; border-radius: 0;
  color: rgba(255,255,255,.92); text-decoration: none;
  font-size: 14px; font-weight: 500;
  transition: color .15s, opacity .15s;
  border-bottom: 1px solid rgba(255,255,255,.05);
  background: transparent;
  cursor: pointer;
}
.zlot-account-menu-popup .link--eaQpx:hover {
  color: #4EFBF0;
  background: transparent;
}
.zlot-account-menu-popup .link--eaQpx:last-of-type {
  border-bottom: none;
}
.zlot-account-menu-popup .link--eaQpx .wrapper--vVcrc {
  color: rgba(255,255,255,.7);
  flex-shrink: 0;
}
.zlot-account-menu-popup .link--eaQpx:hover .wrapper--vVcrc {
  color: #4EFBF0;
}
.zlot-account-menu-popup .link-title--F_AAg {
  font-size: 14px; line-height: 1.3; letter-spacing: -0.1px;
}

/* Logout: sade kirmizi text + ikon (kutu YOK) */
.zlot-account-menu-popup .logout-link--xrk7D {
  margin-top: 0;
  padding: 12px 0;
  background: transparent !important;
  border: none !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  color: #FF4366 !important;
  justify-content: flex-start;
  border-radius: 0;
}
.zlot-account-menu-popup .logout-link--xrk7D:hover {
  background: transparent !important;
  color: #FF4366 !important;
  opacity: .85;
}
.zlot-account-menu-popup .logout-link--xrk7D .wrapper--vVcrc,
.zlot-account-menu-popup .logout-link--xrk7D:hover .wrapper--vVcrc {
  color: #FF4366;
}
.zlot-account-menu-popup .logout-link--xrk7D .icon-container--rtUm3 {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px;
}
.zlot-account-menu-popup .logout-link--xrk7D .name--ffxXm {
  font-size: 14px; font-weight: 600; letter-spacing: -0.1px;
}

/* === Deposit page: tutar input (orijinal light-theme uyumlu) ============ */
.zlot-amount-card-light {
  background: #fff;
  border: 1px solid #dde1e4;
  box-shadow: 0 2px 0 0 #dde1e4;
  border-radius: 18px;
  padding: 16px 20px;
  margin-bottom: 20px;
}
.zlot-amount-label-light {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #64727d;
  margin-bottom: 8px;
  letter-spacing: -0.2px;
}
.zlot-amount-input-light input[type="number"] {
  width: 100%;
  padding: 14px 16px;
  font-size: 22px;
  font-weight: 700;
  background: #f4f5f6;
  border: 1px solid #dde1e4;
  border-radius: 12px;
  color: #2d3439;
  text-align: center;
  outline: none;
  font-family: 'Outfit', system-ui, sans-serif;
  letter-spacing: 0.5px;
  transition: border-color .15s, background .15s;
}
.zlot-amount-input-light input[type="number"]:focus {
  border-color: #b544fb;
  background: #fff;
}
.zlot-amount-input-light input[type="number"]::placeholder { color: #99a5ad; }
.zlot-amount-suggest-light {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 10px;
}
.zlot-amount-suggest-light button {
  padding: 8px 4px; font-size: 12px; font-weight: 600;
  background: #f4f5f6; border: 1px solid #dde1e4; border-radius: 18px;
  color: #2d3439; cursor: pointer; font-family: inherit;
  transition: background .15s, color .15s, border-color .15s;
}
.zlot-amount-suggest-light button:hover {
  background: linear-gradient(180deg, #ec44fb 0%, #b544fb 100%);
  color: #fff; border-color: transparent;
}
.zlot-amount-limits-light {
  font-size: 11px; color: #82909b; margin: 10px 0 0; text-align: center;
  font-weight: 500;
}

/* Payment-card mobile 1 sütun + min-height kart (orijinal SSR 230px) */
[data-mobile="true"] .payment-method-list--y5ggw {
  flex-direction: column;
}
[data-mobile="true"] .payment-method-list--y5ggw .payment-card--W76JR {
  width: 100%;
}
[data-mobile="true"] .payment-method-list--y5ggw .payment-card--OtgZ6 {
  min-height: 200px;
}

/* Kategori tab'lar (tabs--PAgkG) yatay scroll — child'ları zorla yan-yana */
[data-mobile="true"] .scroll--QPUoW {
  max-width: 100% !important;
}
[data-mobile="true"] .tabs--PAgkG {
  width: max-content;
  min-width: 100%;
  flex-wrap: nowrap;
}
[data-mobile="true"] .tab--fzHt0 {
  flex-shrink: 0;
  white-space: nowrap;
}
[data-mobile="true"] .tab--fzHt0 .group-img--PuqGl {
  width: 22px; height: 22px; flex-shrink: 0;
  border-radius: 6px;
}

/* Pending link içindeki count parantezi */
.pending-link--aRGHd {
  font-size: 12px !important; padding: 8px 14px !important;
  justify-content: center !important;
}

/* Search container mobile uygun */
[data-mobile="true"] .search-container--D0V7V {
  height: 46px; padding: 0 18px; border-radius: 23px;
}
[data-mobile="true"] .search--xfi5i { font-size: 14px; }

/* Header title biraz daha kompakt mobile */
[data-mobile="true"] .header-title--Sjq4u {
  font-size: 22px; line-height: 26px;
}

/* Tutar input kompakt (header'ın altında) */
.zlot-amount-card-light {
  margin-bottom: 16px; padding: 14px 18px;
}
[data-mobile="true"] .zlot-amount-input-light input[type="number"] {
  padding: 12px 14px; font-size: 20px;
}

/* === Quick Actions Popup (hero CTA tıkı — radial yıldız grid) ============ */
.zlot-qa-overlay {
  position: fixed; inset: 0;
  z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  opacity: 0; pointer-events: none;
  transition: opacity .22s ease;
}
.zlot-qa-overlay.zlot-qa-open { opacity: 1; pointer-events: auto; }
.zlot-qa-overlay.zlot-qa-closing { opacity: 0; }
.zlot-qa-backdrop {
  position: absolute; inset: 0;
  background: rgba(15, 23, 34, 0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.zlot-qa-panel {
  position: relative;
  width: calc(100% - 32px);
  max-width: 380px;
  max-height: 80vh;
  padding: 22px 18px 26px;
  background: linear-gradient(180deg, #1B1F22 0%, #0F1722 100%);
  border: 1px solid rgba(78,251,240,.20);
  border-radius: 22px;
  box-shadow:
    0 24px 64px rgba(186, 68, 251, 0.25),
    0 8px 24px rgba(0,0,0,.5);
  transform: scale(0.92) translateY(20px);
  transition: transform .26s cubic-bezier(0.22, 1.5, 0.36, 1);
  overflow-y: auto;
}
.zlot-qa-open .zlot-qa-panel {
  transform: scale(1) translateY(0);
}
.zlot-qa-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 18px;
}
.zlot-qa-title {
  font-size: 18px; font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #4EFBF0 0%, #EC44FB 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.2px;
}
.zlot-qa-close {
  width: 32px; height: 32px;
  background: rgba(255,255,255,.08);
  border: none; border-radius: 50%;
  color: rgba(255,255,255,.7);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .15s, color .15s, transform .12s;
}
.zlot-qa-close:hover { background: rgba(255,255,255,.14); color: #fff; }
.zlot-qa-close:active { transform: scale(0.92); }

.zlot-qa-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.zlot-qa-item {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 18px 6px 12px;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease;
  opacity: 0;
  animation: zqaItemIn .35s ease forwards;
}
@keyframes zqaItemIn {
  from { opacity: 0; transform: scale(0.6) translateY(20px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
.zlot-qa-item:hover { transform: translateY(-3px); }
.zlot-qa-item:active { transform: scale(0.95); }

.zlot-qa-item-star {
  position: relative;
  width: 76px; height: 80px;
  display: flex; align-items: center; justify-content: center;
  filter: drop-shadow(0 8px 22px rgba(186,68,251,.4));
}
.zlot-qa-item-star .zqa-star {
  width: 100%; height: 100%;
  position: absolute; top: 0; left: 0;
}
.zlot-qa-item-icon {
  position: relative; z-index: 2;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.zlot-qa-item-icon svg { filter: drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
.zlot-qa-item-label {
  font-size: 12px; font-weight: 600; color: #fff;
  text-align: center; line-height: 1.25;
  margin-top: 4px;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
  letter-spacing: -0.1px;
}
/* Stagger items: Yatirim biraz farkli/daha parlak */
.zlot-qa-item:first-child .zlot-qa-item-star {
  filter: drop-shadow(0 10px 26px rgba(78,251,240,.45));
}
.zlot-qa-item:first-child .zqa-star path {
  fill: url(#zqaPaint_0);
}
@media (max-width: 360px) {
  .zlot-qa-item-star { width: 66px; height: 70px; }
  .zlot-qa-item-label { font-size: 11px; }
}

/* ============ ACCOUNT PAGES (deposit / withdraw / my-details / 2fa / payment-accounts / pending-bets) ============ */
.zlot-acct-page {
  background: #0F1722;
  color: #E8ECF2;
  min-height: 100vh;
  padding-bottom: 100px;
  font-family: 'Roboto', system-ui, -apple-system, sans-serif;
}
.zlot-acct-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #1B2536 0%, #0F1722 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.zlot-back-btn {
  background: rgba(255,255,255,.06); border: none; color: #fff;
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .15s;
}
.zlot-back-btn:active { background: rgba(255,255,255,.12); }
.zlot-acct-title { flex: 1; font-size: 18px; font-weight: 700; margin: 0; color: #fff;
  display: flex; align-items: center; gap: 8px; }
.zlot-acct-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px;
  background: #FF4366; color: #fff; font-size: 11px; font-weight: 700;
}
.zlot-balance-chip {
  display: inline-flex; flex-direction: column; align-items: flex-end;
  text-decoration: none; padding: 6px 12px; border-radius: 10px;
  background: rgba(78,251,240,.10); border: 1px solid rgba(78,251,240,.3);
  line-height: 1.1;
}
.zbc-label { font-size: 10px; color: rgba(255,255,255,.6); text-transform: uppercase; letter-spacing: 0.5px; }
.zbc-amount { font-size: 14px; font-weight: 800; color: #4EFBF0; margin-top: 2px; }

.zlot-acct-tabs {
  display: flex; gap: 0; overflow-x: auto; scrollbar-width: none;
  background: #1B2536;
  border-bottom: 1px solid rgba(255,255,255,.05);
  padding: 0 12px;
}
.zlot-acct-tabs::-webkit-scrollbar { display: none; }
.zlot-tab {
  flex-shrink: 0; padding: 14px 18px; font-size: 13px; font-weight: 600;
  color: rgba(255,255,255,.55); text-decoration: none;
  border-bottom: 2px solid transparent; transition: color .15s, border-color .15s;
  white-space: nowrap;
}
.zlot-tab:hover { color: rgba(255,255,255,.8); }
.zlot-tab.active { color: #4EFBF0; border-bottom-color: #4EFBF0; }

.zlot-filter-tabs { display: flex; gap: 6px; padding: 12px 16px; overflow-x: auto; scrollbar-width: none; }
.zlot-filter-tabs::-webkit-scrollbar { display: none; }
.zft-tab {
  padding: 8px 14px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: rgba(255,255,255,.06); color: rgba(255,255,255,.7); text-decoration: none;
  white-space: nowrap; transition: background .15s;
}
.zft-tab:hover { background: rgba(255,255,255,.10); }
.zft-tab.active { background: linear-gradient(135deg, #4EFBF0, #BA5DFF); color: #0F1722; }

/* Amount card (deposit) */
.zlot-amount-card {
  margin: 14px 16px; padding: 18px;
  background: linear-gradient(135deg, rgba(78,251,240,.08), rgba(186,93,255,.05));
  border: 1px solid rgba(78,251,240,.2); border-radius: 14px;
}
.zlot-amount-label { display: block; font-size: 12px; color: rgba(255,255,255,.7); margin-bottom: 8px; font-weight: 600; }
.zlot-amount-input input {
  width: 100%; padding: 14px 16px; font-size: 24px; font-weight: 800;
  background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.08); border-radius: 10px;
  color: #fff; text-align: center; letter-spacing: 0.5px;
  font-family: inherit; outline: none; transition: border-color .15s;
}
.zlot-amount-input input:focus { border-color: #4EFBF0; }
.zlot-amount-input input::placeholder { color: rgba(255,255,255,.2); }
.zlot-amount-suggest { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 8px; }
.zlot-amount-suggest button {
  padding: 8px 4px; font-size: 12px; font-weight: 600;
  background: rgba(255,255,255,.08); border: none; border-radius: 8px;
  color: rgba(255,255,255,.85); cursor: pointer; font-family: inherit;
  transition: background .15s;
}
.zlot-amount-suggest button:hover { background: rgba(78,251,240,.20); color: #4EFBF0; }
.zlot-amount-limits { font-size: 11px; color: rgba(255,255,255,.5); margin: 10px 0 0; text-align: center; }

/* PM grupları */
.zlot-pm-group { margin: 14px 16px 22px; }
.zlot-pm-title {
  font-size: 13px; color: rgba(255,255,255,.6); font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.6px; margin: 0 0 8px 4px;
}
.zlot-pm-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.zlot-pm-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; background: #1B2536; border: 1px solid rgba(255,255,255,.05);
  border-radius: 12px; cursor: pointer; transition: background .15s, transform .12s, border-color .15s;
}
.zlot-pm-item:hover { background: #243049; border-color: rgba(78,251,240,.3); }
.zlot-pm-item:active { transform: scale(0.99); }
.zlot-pm-logo {
  width: 44px; height: 44px; object-fit: contain; flex-shrink: 0;
  background: #fff; border-radius: 8px; padding: 4px;
}
.zlot-pm-logo-empty { background: rgba(255,255,255,.06); }
.zlot-pm-info { flex: 1; min-width: 0; }
.zlot-pm-name { font-size: 14px; font-weight: 700; color: #fff;
  display: flex; align-items: center; gap: 6px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zlot-pm-net { font-size: 10px; font-weight: 700; padding: 2px 7px;
  background: rgba(255,180,68,.15); color: #FFB444; border-radius: 999px; }
.zlot-pm-range { font-size: 11px; color: rgba(255,255,255,.5); margin-top: 2px; }
.zlot-pm-arrow { color: rgba(255,255,255,.4); flex-shrink: 0; }

/* Form card (withdraw) */
.zlot-form-card {
  margin: 14px 16px; padding: 18px;
  background: #1B2536; border: 1px solid rgba(255,255,255,.05); border-radius: 14px;
}
.zlot-form-title { font-size: 16px; font-weight: 700; margin: 0 0 14px; color: #fff; }
.zlot-fld { display: block; margin-bottom: 14px; }
.zlot-lbl { display: block; font-size: 12px; color: rgba(255,255,255,.7); font-weight: 600; margin-bottom: 6px; }
.zlot-fld input, .zlot-fld select {
  width: 100%; padding: 12px 14px; font-size: 14px;
  background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.08); border-radius: 10px;
  color: #fff; font-family: inherit; outline: none;
  transition: border-color .15s;
}
.zlot-fld input:focus, .zlot-fld select:focus { border-color: #4EFBF0; }
.zlot-fld input::placeholder { color: rgba(255,255,255,.25); }
.zlot-help { display: block; font-size: 11px; color: rgba(255,255,255,.5); margin-top: 4px; }
.zlot-help strong { color: #4EFBF0; }

.zlot-btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; padding: 14px 20px; font-size: 14px; font-weight: 700;
  background: linear-gradient(135deg, #4EFBF0, #BA5DFF); color: #0F1722;
  border: none; border-radius: 10px; cursor: pointer; text-decoration: none;
  font-family: inherit; transition: opacity .15s, transform .12s;
}
.zlot-btn-primary:hover { opacity: 0.92; }
.zlot-btn-primary:active { transform: scale(0.98); }
.zlot-btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }

.zlot-btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; padding: 14px 20px; font-size: 14px; font-weight: 600;
  background: rgba(255,255,255,.06); color: #fff;
  border: 1px solid rgba(255,255,255,.12); border-radius: 10px; cursor: pointer; text-decoration: none;
  font-family: inherit; transition: background .15s;
}
.zlot-btn-ghost:hover { background: rgba(255,255,255,.10); }

.zlot-form-msg { margin-top: 12px; padding: 10px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; }
.zlot-form-msg.success { background: rgba(46,227,138,.15); color: #2EE38A; border: 1px solid rgba(46,227,138,.3); }
.zlot-form-msg.error   { background: rgba(255,67,102,.15); color: #FF4366; border: 1px solid rgba(255,67,102,.3); }

/* Profile card (my-details) */
.zlot-profile-card {
  margin: 14px 16px; padding: 18px;
  background: #1B2536; border: 1px solid rgba(255,255,255,.05); border-radius: 14px;
}
.zlot-section-title { font-size: 14px; font-weight: 700; margin: 0 0 14px; color: #fff;
  text-transform: uppercase; letter-spacing: 0.5px; }
.zlot-info-list { list-style: none; padding: 0; margin: 0; }
.zlot-info-list li {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.05);
}
.zlot-info-list li:last-child { border-bottom: none; }
.zil-lbl { font-size: 13px; color: rgba(255,255,255,.6); }
.zil-val { font-size: 13px; color: #fff; font-weight: 600; text-align: right; word-break: break-word; }
.zil-val.mono { font-family: ui-monospace, "SF Mono", Menlo, monospace; color: #4EFBF0; }
.zil-badge {
  display: inline-block; padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
}
.zil-badge.ok { background: rgba(46,227,138,.20); color: #2EE38A; }
.zil-badge.danger { background: rgba(255,67,102,.20); color: #FF4366; }

.zlot-bal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.zbg-item { padding: 14px; background: rgba(0,0,0,.25); border-radius: 10px; text-align: center; }
.zbg-label { font-size: 11px; color: rgba(255,255,255,.6); text-transform: uppercase; letter-spacing: 0.5px; }
.zbg-amount { font-size: 18px; font-weight: 800; margin-top: 4px; }
.zbg-amount.c-mint { color: #4EFBF0; }
.zbg-amount.c-amber { color: #FFB444; }
.zlot-bal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.zlot-logout-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 13px 18px; font-size: 14px; font-weight: 700;
  background: rgba(255,67,102,.12); color: #FF4366;
  border: 1px solid rgba(255,67,102,.3); border-radius: 10px; cursor: pointer;
  text-decoration: none; transition: background .15s;
}
.zlot-logout-btn:hover { background: rgba(255,67,102,.20); }

/* 2FA */
.zlot-2fa-info { text-align: center; padding: 10px 0; }
.zlot-2fa-info svg { display: block; margin: 0 auto 14px; }
.zlot-2fa-info p { color: rgba(255,255,255,.75); font-size: 13px; line-height: 1.55; margin: 0 0 16px; }
.zlot-2fa-info-text { color: rgba(255,255,255,.7); font-size: 13px; line-height: 1.55; margin: 0; }
.zlot-2fa-status {
  display: inline-flex; align-items: center; gap: 8px;
  margin-bottom: 14px; padding: 8px 14px;
  background: rgba(0,0,0,.25); border-radius: 999px;
}
.zlot-2fa-label { font-size: 12px; color: rgba(255,255,255,.65); font-weight: 600; }
.zlot-badge.danger { background: rgba(255,67,102,.20); color: #FF4366; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.zlot-badge.ok { background: rgba(46,227,138,.20); color: #2EE38A; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.zlot-badge.pending { background: rgba(255,180,68,.18); color: #FFB444; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }

/* Activity list */
.zlot-activity-list { list-style: none; padding: 0; margin: 0; }
.zlot-activity-list li {
  display: flex; align-items: center; gap: 10px; padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.05); font-size: 13px;
}
.zlot-activity-list li:last-child { border-bottom: none; }
.zal-event { color: #fff; flex: 1; font-weight: 500; }
.zal-ip { color: rgba(255,255,255,.5); font-size: 11px; }
.zal-time { color: rgba(255,255,255,.4); font-size: 11px; }

/* Payment-accounts list */
.zlot-acc-item {
  padding: 14px; background: #1B2536; border: 1px solid rgba(255,255,255,.05);
  border-radius: 12px; margin-bottom: 8px;
}
.zlot-acc-bank { font-size: 13px; color: rgba(255,255,255,.6); font-weight: 600; margin-bottom: 4px; }
.zlot-acc-iban { font-size: 14px; color: #4EFBF0; font-weight: 600; word-break: break-all; }
.zlot-acc-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; font-size: 11px; color: rgba(255,255,255,.5); }
.zlot-acc-name { font-weight: 600; color: rgba(255,255,255,.7); }

/* Empty state */
.zlot-empty-card {
  margin: 30px 16px; padding: 30px 20px; text-align: center;
  background: #1B2536; border: 1px solid rgba(255,255,255,.05); border-radius: 14px;
}
.zlot-empty-card svg { display: block; margin: 0 auto 14px; color: rgba(255,255,255,.5); }
.zlot-empty-card h3 { font-size: 16px; color: #fff; margin: 0 0 8px; font-weight: 700; }
.zlot-empty-card p { font-size: 13px; color: rgba(255,255,255,.6); margin: 0 0 20px; line-height: 1.5; }

/* Transaction history */
.zlot-tx-list { list-style: none; padding: 0 16px; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.zlot-tx-item {
  padding: 12px 14px; background: #1B2536; border: 1px solid rgba(255,255,255,.05);
  border-radius: 12px;
}
.zlot-tx-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.zlot-tx-type-label { font-size: 14px; font-weight: 700; color: #fff; display: block; }
.zlot-tx-method { font-size: 11px; color: rgba(255,255,255,.55); margin-top: 2px; display: block; }
.zlot-tx-amount { font-size: 16px; font-weight: 800; }
.zlot-tx-amount.plus { color: #2EE38A; }
.zlot-tx-amount.minus { color: #FF4366; }
.zlot-tx-meta { display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.zlot-tx-date { font-size: 11px; color: rgba(255,255,255,.5); }
.zlot-tx-id { font-size: 11px; color: rgba(255,255,255,.3); margin-left: auto; }
.zlot-tx-note {
  margin-top: 8px; padding: 8px 10px; background: rgba(0,0,0,.25);
  border-left: 2px solid #4EFBF0; border-radius: 6px;
  font-size: 12px; color: rgba(255,255,255,.7); line-height: 1.45;
}

.zlot-acct-footer-note {
  margin: 16px; padding: 12px 16px;
  text-align: center; font-size: 12px; color: rgba(255,255,255,.55); line-height: 1.6;
}
.zlot-acct-footer-note strong { color: #4EFBF0; }

/* Mono */
.mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }

/* === Casino slider--ROdkx Pragmatic mini kartlari (games-row icindekiler) ===
 * JackpotPlay 3 / JackpotStar provider kartinin altinda 4 mini kart var
 * (.games-row--nU0DQ > div). Cok kucukler — biraz buyutup oynunun adi okunsun.
 * Provider kartinin kendisine (h=334) dokunmuyoruz, sadece icteki mini'leri.
 */
.slider--ROdkx .games-row--nU0DQ {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
}
.slider--ROdkx .games-row--nU0DQ > div,
.slider--ROdkx .games-row--nU0DQ .item--pDQmU {
  flex: 1 1 0 !important;
  min-width: 78px !important;
  max-width: 100px !important;
  aspect-ratio: 1 / 1 !important;
}
.slider--ROdkx .games-row--nU0DQ img.img--FXGFn,
.slider--ROdkx .games-row--nU0DQ picture img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}
/* Buyuk ekranlarda biraz daha buyuk */
@media (min-width: 600px) {
  .slider--ROdkx .games-row--nU0DQ > div,
  .slider--ROdkx .games-row--nU0DQ .item--pDQmU {
    min-width: 110px !important;
    max-width: 130px !important;
  }
}

/* === Casino label-games-truncated sectionlar (Tumu / Populer) ============
 * Orijinal SSR'da grid-template-rows: repeat(12, 187px) (12 satir x 2 sutun =
 * 24 yer) ayrilmis ama biz daha az kart koyuyoruz -> bos satirlar = bosluk.
 * Grid'i auto'ya zorla, gap genislet, section margin sifirla. */
.label-games-truncated--FVHn0 {
  margin: 0 !important;
  padding: 12px 0 16px !important;
}
.label-games-truncated--FVHn0:not(:first-child) {
  border-top: 1px solid rgba(0,0,0,0.06);
}
.label-games-truncated--FVHn0 .games--EU3U7,
.label-games-truncated--FVHn0 [class*="games--EU"] {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-template-rows: none !important;     /* Inline repeat(12, 187px) zorla off */
  gap: 12px !important;
  padding: 0 12px !important;
}
.label-games-truncated--FVHn0 .grid-item--l5sby,
.label-games-truncated--FVHn0 [class*="grid-item--l5"] {
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}