/* ===== Bolha flutuante reutilizável (upload/excluir) ===== */

.bux-float{
  /* Tema padrão (upload) */
  --bux-color:   #3b82f6; /* cor do progresso */
  --bux-success: #16a34a; /* cor do “✓”/sucesso */

  position:fixed; left:12px; top:calc(var(--topbar-h, 0px) + 64px);
  width:64px; height:64px; border-radius:999px; background:#fff;
  box-shadow:0 10px 26px rgba(2,6,23,.18), 0 2px 8px rgba(2,6,23,.08);
  display:grid; place-items:center; z-index:9999; user-select:none; cursor:grab;
  touch-action:none; -webkit-user-select:none;
  transition:transform .12s ease, opacity .18s ease;
}
.bux-float.dragging{ cursor:grabbing; }

.bux-ring{ position:absolute; inset:0; }
.bux-bg{ stroke:#eef2f7; }
.bux-active{ stroke:var(--bux-color); } /* usa var */

.bux-float.is-delete{
  /* Tema de exclusão: tudo no vermelho */
  --bux-color:#ef4444;
  --bux-success:#ef4444;
}

.bux-pct{
  position:absolute; inset:0; display:grid; place-items:center;
  font-weight:800; font-size:.95rem; color:#111827;
}
.bux-cancel{
  position:absolute; right:-8px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:999px; background:#ef4444; color:#fff;
  border:2px solid #fff; display:grid; place-items:center; font-size:12px; line-height:1;
  box-shadow:0 6px 14px rgba(239,68,68,.35); cursor:pointer;
}
.bux-cancel:active{ transform:translateY(-50%) scale(.96); }

/* quando termina, o número herda a cor de sucesso do modo */
.bux-float.is-success .bux-pct{ color:var(--bux-success); }
.bux-float.is-hidden{ opacity:0; pointer-events:none; transform:scale(.92); }