/* Contenedor de botones flotantes */
   /* Contenedor de los botones */
.botones-flotantes {
  position: fixed;
  top: 175px; /* Mitad de 349px aprox (ajusta este valor según tu banner) */
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;               /* espacio entre icono y texto */
  z-index: 9999;
  transform: translateY(-50%); /* centra los botones en el medio */
}
.boton-flotante {
  width: 190px;
  height: 40px;
  background-color: #ff00aa; /* fucsia */
  color: white;
  font-size: 14px;
  font-family: Arial, sans-serif;
  font-weight: bold;
  text-align: left;   /* alineamos contenido a la izquierda */
  padding-left: 2px; /* espacio para la imagen */
  line-height: 40px;
  border: 2px solid gray;
  border-radius: 10px 0 0 10px;
  text-decoration: none;
  position: relative;
  right: -130px; /* sobresale 20px */
  display: flex;          /* ✅ flex para alinear imagen + texto */
  align-items: center;    /* centra verticalmente */
  gap: 8px;               /* espacio entre icono y texto */
  transition: right 0.3s ease, color 0.3s ease;
  margin-top: 10px;
}

.boton-flotante img {
  width: 20px;
  height: 20px;
}
.boton-flotante:hover {
  right: 0;
  color: rgb(250, 250, 250); /* cambia el texto a color */
}