/* =====================================================================
   deposit-redesign.css — Redesign do modal de Depósito + PIX (RX7)
   Carregado DEPOIS de style.css/plataforma2.css para sobrepor o visual antigo.
   Objetivos:
   - Corrigir texto branco-no-branco (CTA "Continuar" e valor selecionado).
   - Trocar caixas chapadas (#1a1a1a/#0d0d0d/#1f1f1f) por vidro coerente c/ o tema.
   - Unificar o acento no AZUL da marca RX7 (verde só p/ "pago/sucesso").
   ===================================================================== */

:root{
  --rx7-blue:#2563EB;
  --rx7-blue-2:#1E40AF;
  --rx7-blue-soft:#60A5FA;
  --rx7-glass:rgba(255,255,255,.05);
  --rx7-glass-2:rgba(255,255,255,.08);
  --rx7-bord:rgba(255,255,255,.12);
}

/* ───── Card do modal ───── */
.deposit-sheet,
.deposit-center-card{
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:linear-gradient(180deg, rgba(16,22,44,.72), rgba(8,12,28,.82)) !important;
  backdrop-filter:blur(28px) saturate(160%) !important;
  -webkit-backdrop-filter:blur(28px) saturate(160%) !important;
  box-shadow:0 30px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04) inset,
             0 0 60px rgba(37,99,235,.12) !important;
  padding:22px 20px !important;
}

/* botão fechar (x) */
.deposit-modal-x{
  width:34px !important;height:34px !important;border-radius:10px !important;
  background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.10) !important;
  color:rgba(255,255,255,.75) !important;font-size:15px !important;line-height:1 !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  transition:background .15s ease,color .15s ease,border-color .15s ease !important;
}
.deposit-modal-x:hover{background:rgba(255,255,255,.12) !important;color:#fff !important;}

/* ───── Cabeçalho ───── */
.deposit-form-head-icon{
  width:44px !important;height:44px !important;border-radius:13px !important;
  background:linear-gradient(135deg, rgba(37,99,235,.30), rgba(30,64,175,.16)) !important;
  border:1px solid rgba(96,165,250,.35) !important;
  color:#93C5FD !important;
  box-shadow:0 6px 18px rgba(37,99,235,.22) !important;
}
.deposit-form-title{font-size:19px !important;}
.deposit-form-sub{color:rgba(255,255,255,.6) !important;}

/* ───── Valores sugeridos ───── */
.deposit-suggest-label,
.deposit-amt-label{letter-spacing:.02em !important;}
.quick-values--row{gap:10px !important;}
.quick-values--row .quick-value{
  padding:13px 6px !important;
  font-size:13px !important;font-weight:800 !important;
  border-radius:12px !important;
  background:transparent !important; /* transparente a pedido */
  border:1px solid var(--rx7-bord) !important;
  color:rgba(255,255,255,.82) !important;
  box-shadow:none !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .12s ease,box-shadow .15s ease !important;
}
.quick-values--row .quick-value:hover{
  background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.22) !important;color:#fff !important;
}
/* FIX branco-no-branco: selecionado = azul da marca, texto branco */
.quick-values--row .quick-value.active{
  background:linear-gradient(135deg, var(--rx7-blue), var(--rx7-blue-2)) !important;
  border-color:rgba(96,165,250,.65) !important;
  color:#fff !important;
  box-shadow:0 6px 18px rgba(37,99,235,.35), 0 0 0 1px rgba(96,165,250,.25) inset !important;
}

/* ───── Campo de valor ───── */
.deposit-amt-field{
  min-height:52px !important;border-radius:13px !important;
  background:transparent !important; /* barra do valor transparente a pedido */
  border:1px solid var(--rx7-bord) !important;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease !important;
}
.deposit-amt-field:focus-within{
  border-color:rgba(96,165,250,.6) !important;background:rgba(255,255,255,.04) !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.18) !important;
}
.deposit-amt-prefix{color:rgba(255,255,255,.55) !important;font-weight:700 !important;}
.deposit-amt-input{font-size:17px !important;font-weight:700 !important;background:transparent !important;border:none !important;box-shadow:none !important;}
.deposit-amt-input:focus{box-shadow:none !important;background:transparent !important;}

/* ───── Ações (Cancelar / Continuar) ───── */
.deposit-form-actions{margin-top:22px !important;}
.btn-deposit-cancel{
  border-radius:12px !important;
  background:transparent !important;border:1px solid rgba(255,255,255,.2) !important;color:rgba(255,255,255,.8) !important;
}
.btn-deposit-cancel:hover{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.34) !important;color:#fff !important;}
/* FIX branco-no-branco: CTA principal = gradiente azul, texto branco */
.btn-deposit-continue{
  flex:1 1 auto !important;justify-content:center !important;
  min-height:48px !important;border-radius:12px !important;
  background:linear-gradient(135deg, var(--rx7-blue), var(--rx7-blue-2)) !important;
  color:#fff !important;border:none !important;font-weight:800 !important;font-size:14px !important;
  box-shadow:0 10px 24px rgba(37,99,235,.35) !important;
}
.btn-deposit-continue:hover{filter:brightness(1.06) !important;}
.btn-deposit-continue:active{transform:scale(.985) !important;}

/* ───── Banner saldo insuficiente (refino) ───── */
.deposit-low-balance-banner{
  border-radius:12px !important;background:rgba(127,29,29,.30) !important;border-color:rgba(239,68,68,.4) !important;
}

/* ═════════ PIX ═════════ */
.pix-timer-bar{
  background:linear-gradient(135deg, var(--rx7-blue), var(--rx7-blue-2)) !important;
  color:#EAF2FF !important;border-radius:12px !important;
  box-shadow:0 6px 18px rgba(37,99,235,.30) !important;
}
.pix-timer-bar--ended{background:#3f3f46 !important;color:rgba(255,255,255,.88) !important;box-shadow:none !important;}

.pix-pending--waiting{
  background:rgba(255,255,255,.05) !important;color:rgba(255,255,255,.55) !important;border:1px solid rgba(255,255,255,.10) !important;
  border-radius:10px !important;padding:8px 12px !important;font-size:12px !important;
}
.pix-pending--paid{
  background:rgba(16,185,129,.16) !important;color:#6EE7B7 !important;border:1px solid rgba(16,185,129,.45) !important;
}

/* QR — fundo branco (necessário) com moldura azul sutil */
.pix-qr-wrap{
  background:#fff !important;border-radius:16px !important;padding:12px !important;max-width:230px !important;
  box-shadow:0 8px 26px rgba(0,0,0,.35), 0 0 0 1px rgba(96,165,250,.35) !important;
}

.pix-value-block{margin-bottom:14px !important;}
.pix-value-lbl{color:rgba(255,255,255,.55) !important;}
/* valor em branco forte com brilho azul (consistente com a marca) */
.pix-value-num{
  font-size:24px !important;font-weight:900 !important;color:#fff !important;
  text-shadow:0 0 18px rgba(96,165,250,.45) !important;
}

.pix-code-scroll{
  background:rgba(255,255,255,.04) !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:12px !important;
}
.pix-code{color:rgba(255,255,255,.7) !important;}

/* Botão copiar = CTA azul principal */
.pix-cta--copy{
  background:linear-gradient(135deg, var(--rx7-blue), var(--rx7-blue-2)) !important;
  color:#fff !important;border:none !important;font-weight:800 !important;min-height:50px !important;
  box-shadow:0 10px 24px rgba(37,99,235,.35) !important;
}
.pix-cta--copy:not(.pix-cta--copied):hover:not(:disabled){filter:brightness(1.06) !important;background:linear-gradient(135deg, var(--rx7-blue), var(--rx7-blue-2)) !important;}
.pix-cta--copied{background:rgba(16,185,129,.9) !important;color:#03140a !important;}

/* Rodapé: Novo PIX / Atualizar = ghost glass */
.pix-foot-row{display:flex !important;gap:10px !important;margin-top:12px !important;}
.pix-foot-btn{
  flex:1 1 auto !important;min-height:42px !important;border-radius:11px !important;
  background:var(--rx7-glass) !important;border:1px solid var(--rx7-bord) !important;color:rgba(255,255,255,.82) !important;
  font-weight:700 !important;font-size:13px !important;cursor:pointer !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease !important;
}
.pix-foot-btn:hover{background:var(--rx7-glass-2) !important;border-color:rgba(255,255,255,.22) !important;color:#fff !important;}

.pix-info-foot{
  margin-top:14px !important;color:rgba(255,255,255,.5) !important;font-size:11.5px !important;line-height:1.5 !important;
  display:flex !important;gap:7px !important;align-items:flex-start !important;justify-content:center !important;text-align:center !important;
}
.pix-loading-spinner{border-top-color:var(--rx7-blue-soft) !important;}
