/* ===========================================================
   DEPOSIT V2.1 — Frenzy96 player deposit (improved, 2026-05-30)
   Sidebar nav + right detail + notice card + receipt sheet.
   Vanilla, dark theme, English-only. Mounts into #modal-deposit.
   =========================================================== */
:root{
  --dp-bg:#0b0c10; --dp-surface:#141620; --dp-surface2:#0f1117;
  --dp-border:#1e2028; --dp-border2:#1a1c24;
  --dp-gold:#e8a124; --dp-gold-bg:#1f1a0d;
  --dp-blue:#4a8ee8; --dp-blue-bg:#0d1520;
  --dp-green:#2dc98a; --dp-red:#e84040;
  --dp-text:#eee; --dp-text2:#aaa; --dp-text3:#555; --dp-text4:#3a3e4d;
}

/* full-screen container (override .modal-backdrop) */
#modal-deposit.dep-v2{
  position:fixed !important; inset:0 !important; background:var(--dp-bg) !important;
  z-index:9000 !important; display:none !important;
  align-items:stretch !important; justify-content:center !important; padding:0 !important; opacity:1 !important;
}
#modal-deposit.dep-v2.show{ display:flex !important; }
#modal-deposit.dep-v2 .dpw{
  width:100%; max-width:480px; margin:0 auto; height:100%;
  display:flex; flex-direction:column; background:var(--dp-bg); color:var(--dp-text);
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif; overflow:hidden;
}

/* header (fixed) */
.dp-hd{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid var(--dp-border); flex-shrink:0; }
.dp-back{ width:28px; height:28px; border-radius:8px; background:#151720; border:0; color:var(--dp-text); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }
.dp-back svg{ width:16px; height:16px; }
.dp-title{ font-size:14px; font-weight:600; color:var(--dp-text); }
.dp-bal{ text-align:right; }
.dp-bal .l{ font-size:9px; color:var(--dp-text3); text-transform:uppercase; letter-spacing:.06em; display:block; }
.dp-bal .a{ font-size:12px; font-weight:600; color:var(--dp-gold); font-family:"JetBrains Mono",ui-monospace,monospace; }

/* body */
.dp-body{ flex:1; display:flex; min-height:0; }
.dp-nav{ width:72px; flex-shrink:0; border-right:1px solid var(--dp-border); overflow-y:auto; padding:8px 0; }
.dp-nav-i{ display:flex; flex-direction:column; align-items:center; gap:5px; padding:11px 2px; cursor:pointer; border-left:2.5px solid transparent; color:var(--dp-text3); }
.dp-nav-i .ic{ width:32px; height:32px; border-radius:9px; background:var(--dp-surface); display:flex; align-items:center; justify-content:center; color:var(--dp-text3); }
.dp-nav-i .ic svg{ width:17px; height:17px; }
.dp-nav-i .lb{ font-size:9px; text-align:center; line-height:1.2; }
.dp-nav-i.on{ border-left-color:var(--dp-gold); background:var(--dp-surface2); }
.dp-nav-i.on .ic{ background:var(--dp-blue-bg); color:var(--dp-blue); }
.dp-nav-i.on .lb{ color:var(--dp-text2); }

.dp-detail{ flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px; -webkit-overflow-scrolling:touch; }

/* 1. method title row */
.dp-mhd{ display:flex; align-items:center; gap:10px; }
.dp-mhd .bic{ width:36px; height:36px; border-radius:10px; background:var(--dp-blue-bg); color:var(--dp-blue); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.dp-mhd .bic svg{ width:20px; height:20px; }
.dp-mhd .t{ font-size:14px; font-weight:600; color:var(--dp-text); }
.dp-pill{ font-size:8px; font-weight:700; letter-spacing:.04em; color:var(--dp-gold); background:var(--dp-gold-bg); border:1px solid #3a2e0a; padding:3px 8px; border-radius:20px; margin-left:auto; }

/* 2. info card */
.dp-info{ background:var(--dp-surface); border:1px solid var(--dp-border); border-radius:10px; overflow:hidden; }
.dp-info-r{ display:flex; align-items:center; justify-content:space-between; padding:9px 12px; border-bottom:1px solid var(--dp-border2); }
.dp-info-r:last-child{ border-bottom:0; }
.dp-info-r .k{ display:flex; align-items:center; gap:7px; font-size:11px; color:var(--dp-text3); }
.dp-info-r .k svg{ width:13px; height:13px; color:var(--dp-text4); }
.dp-info-r .v{ font-size:11px; font-weight:600; color:var(--dp-text); }
.dp-info-r .v.gold{ color:var(--dp-gold); }
.dp-info-r .v.green{ color:var(--dp-green); }
.dp-info-r .v.gray{ color:var(--dp-text2); }

/* small section label */
.dp-lbl{ font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:var(--dp-text4); margin:0 0 7px; }

/* 3. quick select */
.dp-quick{ display:flex; gap:7px; }
.dp-quick button{ flex:1; padding:9px 0; border-radius:20px; background:var(--dp-surface); border:1px solid var(--dp-border); color:#666; font-size:10px; font-weight:600; cursor:pointer; font-family:"JetBrains Mono",ui-monospace,monospace; }
.dp-quick button.on{ background:var(--dp-gold-bg); border-color:var(--dp-gold); color:var(--dp-gold); }

/* 4. amount input */
.dp-amt{ display:flex; align-items:center; gap:8px; background:var(--dp-surface); border:1.5px solid #2a2d38; border-radius:10px; padding:10px 14px; }
.dp-amt.foc{ border-color:var(--dp-gold); }
.dp-amt.err{ border-color:var(--dp-red); }
.dp-amt .pfx{ font-size:18px; font-weight:700; color:var(--dp-gold); }
.dp-amt input{ flex:1; background:transparent; border:0; outline:0; color:var(--dp-text); font-size:22px; font-weight:700; font-family:"JetBrains Mono",ui-monospace,monospace; min-width:0; }
.dp-err{ font-size:10px; color:var(--dp-red); min-height:13px; margin-top:5px; }

/* 5. confirm */
.dp-confirm{ width:100%; height:48px; border:0; border-radius:11px; background:var(--dp-gold); color:#0b0c10; font-size:13px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:7px; }
.dp-confirm svg{ width:16px; height:16px; }
.dp-confirm:disabled{ background:#252831; color:#555; cursor:not-allowed; }
.dp-spin{ width:15px; height:15px; border:2px solid rgba(11,12,16,.3); border-top-color:#0b0c10; border-radius:50%; animation:dp-rot .7s linear infinite; }
.dp-confirm:disabled .dp-spin{ border-color:rgba(255,255,255,.2); border-top-color:#777; }
@keyframes dp-rot{ to{ transform:rotate(360deg); } }
.dp-note{ font-size:9px; color:var(--dp-text4); text-align:center; line-height:1.5; margin-top:-2px; }

/* 6. notice card */
.dp-notice{ background:var(--dp-surface2); border:1px solid var(--dp-border); border-left:2.5px solid var(--dp-gold); border-radius:10px; padding:11px 12px; margin-top:2px; }
.dp-notice-hd{ display:flex; align-items:center; gap:6px; margin-bottom:7px; }
.dp-notice-hd svg{ width:14px; height:14px; color:var(--dp-gold); }
.dp-notice-hd .t{ font-size:10px; font-weight:600; color:var(--dp-text2); }
.dp-notice-li{ display:flex; gap:7px; font-size:9px; color:var(--dp-text3); line-height:1.5; margin-bottom:4px; }
.dp-notice-li:last-child{ margin-bottom:0; }
.dp-notice-li .dot{ width:4px; height:4px; border-radius:50%; background:var(--dp-text4); flex-shrink:0; margin-top:5px; }

/* receipt bottom sheet */
.dp-sov{ position:fixed; inset:0; z-index:9500; background:rgba(0,0,0,.72); display:none; align-items:flex-end; justify-content:center; }
.dp-sov.show{ display:flex; }
.dp-sheet{ width:100%; max-width:480px; max-height:92vh; overflow-y:auto; background:var(--dp-bg); border-top:1px solid var(--dp-border); border-radius:18px 18px 0 0; color:var(--dp-text); -webkit-overflow-scrolling:touch; }
.dp-grip{ width:32px; height:3px; border-radius:3px; background:#2a2d38; margin:10px auto 4px; }
.dp-sheet-hd{ display:flex; align-items:center; justify-content:space-between; padding:6px 18px 12px; }
.dp-sheet-hd .t{ font-size:13px; font-weight:600; }
.dp-sx{ background:none; border:0; color:var(--dp-text3); font-size:20px; line-height:1; cursor:pointer; padding:2px 6px; }
.dp-sheet-bd{ padding:0 18px max(26px, env(safe-area-inset-bottom)); }
.dp-recap{ background:var(--dp-gold-bg); border:1px solid #3a2e0a; border-radius:9px; padding:9px 12px; font-size:11px; color:var(--dp-gold); margin-bottom:14px; line-height:1.5; }
.dp-recap b{ font-weight:800; }
.dp-btab{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.dp-btab button{ padding:6px 12px; border-radius:16px; font-size:11px; font-weight:600; cursor:pointer; border:1px solid var(--dp-border); background:transparent; color:var(--dp-text3); }
.dp-btab button.on{ border-color:var(--dp-gold); background:var(--dp-gold-bg); color:var(--dp-gold); }
.dp-bcard{ background:var(--dp-surface); border:1px solid var(--dp-border); border-radius:10px; padding:12px; }
.dp-brow{ display:flex; align-items:center; justify-content:space-between; padding:7px 0; font-size:12px; border-bottom:1px solid var(--dp-border2); }
.dp-brow:last-child{ border-bottom:0; }
.dp-brow .k{ color:var(--dp-text3); }
.dp-brow .v{ font-weight:700; font-family:"JetBrains Mono",ui-monospace,monospace; display:flex; align-items:center; gap:8px; color:var(--dp-text); }
.dp-cpy{ background:var(--dp-gold-bg); border:1px solid var(--dp-gold); color:var(--dp-gold); border-radius:6px; font-size:10px; font-weight:700; padding:3px 9px; cursor:pointer; }
.dp-bnote{ margin-top:9px; font-size:10px; color:var(--dp-text3); line-height:1.5; }
.dp-bqr{ width:150px; height:150px; object-fit:contain; display:block; margin:0 auto 12px; background:#fff; border-radius:8px; padding:6px; }
.dp-div{ height:1px; background:var(--dp-border); margin:16px 0; }
.dp-drop{ display:block; padding:22px; background:var(--dp-surface); border:1px dashed #2a2d38; border-radius:10px; text-align:center; cursor:pointer; }
.dp-drop.drag{ border-color:var(--dp-gold); background:var(--dp-gold-bg); }
.dp-drop svg{ width:20px; height:20px; color:var(--dp-text4); display:block; margin:0 auto 7px; }
.dp-drop .dt{ font-size:10px; color:var(--dp-text3); }
.dp-drop .df{ font-size:9px; color:var(--dp-text4); margin-top:4px; }
.dp-prev{ margin-top:10px; }
.dp-prev img{ max-width:100%; max-height:170px; border-radius:8px; border:1px solid var(--dp-border); display:block; }
.dp-prev .re{ font-size:10px; color:var(--dp-gold); cursor:pointer; margin-top:6px; display:inline-block; }
.dp-submit{ width:100%; height:46px; margin-top:16px; position:sticky; bottom:8px; border:0; border-radius:10px; background:var(--dp-gold); color:#0b0c10; font-size:14px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:7px; }
.dp-submit:disabled{ opacity:.55; cursor:not-allowed; }
.dp-empty{ padding:22px; text-align:center; color:var(--dp-gold); font-size:12px; background:var(--dp-surface); border:1px solid var(--dp-border); border-radius:10px; }

/* toast */
.dp-toast{ position:fixed; left:50%; bottom:32px; transform:translateX(-50%); z-index:10000; max-width:88vw; padding:12px 18px; border-radius:10px; color:#fff; font-size:12px; font-weight:600; box-shadow:0 8px 28px rgba(0,0,0,.4); text-align:center; line-height:1.4; }

/* Hide legacy deposit modal content re-shown by app.js */
#modal-deposit .modal > *:not(.dpw), #modal-deposit > *:not(.dpw){ display:none !important; }

/* ── Deposit bonus selection (SELECT BONUS) 2026-06-01 ── */
.dp-bonus { margin: 4px 0 2px; }
.dp-bonus-lbl { font-size: 9px; font-weight: 600; color: #3a3e4d; text-transform: uppercase; letter-spacing: .8px; margin: 8px 0 8px; }
.dp-bo { position: relative; display: flex; align-items: center; gap: 11px; background: #141620; border: 1px solid #1e2028; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; cursor: pointer; transition: border-color .12s, background .12s; }
.dp-bo.sel { border: 1.5px solid #e8a124; background: #0f1117; }
.dp-bo.sel::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: #e8a124; }
.dp-bo.claimed { opacity: .5; cursor: not-allowed; }
.dp-bo-radio { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #3a3e4d; box-sizing: border-box; position: relative; }
.dp-bo.sel .dp-bo-radio { border-color: #e8a124; }
.dp-bo.sel .dp-bo-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: #e8a124; }
.dp-bo-mid { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dp-bo-mid .n { font-size: 12px; font-weight: 600; color: #eee; }
.dp-bo-mid .n.nb { font-weight: 500; color: #aaa; }
.dp-bo-mid .d { font-size: 10px; color: #555; }
.dp-bo-mid .r { font-size: 10px; color: #3a3e4d; }
.dp-bo-right { flex: 0 0 auto; text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.dp-bo-est { font-size: 13px; font-weight: 700; color: #e8a124; }
.dp-bo-est.cap { color: #2dc98a; }
.dp-bo-max { font-size: 10px; color: #555; }
.dp-bo-claimed { font-size: 10px; color: #555; }