
      /* ============ BOTON DE MAYOREO POR WHATSAPP (ficha) ============ */
      .er_mayoreo {
        display:flex !important; align-items:center; justify-content:center;
        gap:.5rem;
        width:100%; margin-top:.75rem;
        padding:10px 22px;
        border:1px solid #25D366;
        border-radius:10px;
        background:transparent;
        color:#128C4A !important;
        font-size:.88rem; font-weight:650; letter-spacing:.15px;
        text-decoration:none !important;
        transition:background .15s ease, color .15s ease, box-shadow .15s ease; }
      .er_mayoreo:hover {
        background:#25D366;
        color:#fff !important;
        box-shadow:0 6px 16px rgba(37,211,102,.28); }
      .er_mayoreo svg { flex:0 0 auto; }
      .er_mayoreo .er_may_sub {
        font-weight:500; opacity:.75; }

      @media (max-width: 575.98px) {
        .er_mayoreo { font-size:.82rem; padding:10px 14px; }
        .er_mayoreo .er_may_sub { display:none; }
      }

      /* ⚠️ NO poner padding-bottom en .o_wsale_product_details_content_section_cta
         para "despejar" la barra fija de compra. Se probo con 5.5rem y quedo un
         HUECO enorme entre "Terminos y condiciones" y "Caracteristicas": esa
         seccion NO es la ultima de la ficha, tiene descripcion y especificaciones
         debajo, asi que el relleno se ve como un vacio a media pagina.
         Ademas no arreglaba nada: la barra es fixed y tapa lo que quede debajo
         sin importar el relleno. Se midio con elementFromPoint que NINGUN boton
         queda atrapado -- todos se pueden desplazar por encima y todos reciben
         el clic. El traslape al desplazarse es el comportamiento normal de una
         barra fija, y la barra tiene fondo solido, borde y sombra, asi que el
         contenido pasa DETRAS y no se ve roto. */

      @media (prefers-reduced-motion: reduce) {
        .er_mayoreo { transition:none; }
      }
    