/* =====================================================
   CONTENEDOR COMÚN
   ===================================================== */
.bhorus-cta{
  width: 100%;
}


/* =====================================================
   ACCIONES (BOTÓN o MENSAJE)
   ===================================================== */
.bhorus-cta__actions{
  margin-top: 30px;        /* separación vertical respecto al precio */
  padding-left: 30px;

  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* Evitar que el form ocupe todo el ancho */
.bhorus-cta__actions form.cart{
  display: inline-flex;
  margin: 0;
}

/* Quitar cantidad si aparece */
.bhorus-cta__actions .quantity{
  display: none !important;
}


/* =====================================================
   BOTÓN (cuando hay huecos)
   ===================================================== */
.bhorus-cta__actions .single_add_to_cart_button{
  margin: 0 !important;
  padding: 10px 18px !important;
  border-radius: 999px !important;
}


/* =====================================================
   MENSAJE (cuando NO hay huecos)
   ===================================================== */

/* El contenedor ocupa toda la fila para empujar el mensaje a la derecha */
.bhorus-cta__actions--msg{
  width: 90%;
  display: flex;
  align-items: center;
}

/* Caja del mensaje: comportamiento tipo botón */
.bhorus-cta__actions--msg .bhorus-cta__msg{
  margin-left: 20px;          /* clave: misma posición que el botón */

  display: inline-flex;
  align-items: center;
  justify-content: center;    /* centra el texto */

  width: clamp(220px, 32vw, 300px);
  padding: 10px 16px;

  border: 1px solid rgba(0,0,0,.22);
  border-radius: 999px;
  background: #fff;
}

/* Texto del mensaje */
.bhorus-cta__msg-text{
  text-align: center;
  color: #d32f2f;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.25;
  display: block;
}


/* añadimos */

/* El contenedor debe ser relativo para poder posicionar el mensaje dentro */
.bhorus-price-cta{
  position: relative;
}

/* SOLO cuando es mensaje: lo sacamos del flujo y lo colocamos junto al precio */
.bhorus-price-cta .bhorus-cta__actions--msg{
  position: absolute;
  top: 0;              /* empieza arriba del contenedor */
  /* right: 15px; */
  margin: 0 !important;
  padding: 0 !important;
  width: auto;
}

/* Ajuste fino para alinearlo con la línea del precio */
.bhorus-price-cta .bhorus-cta__actions--msg .bhorus-cta__msg{
  transform: translateY(12px); /* sube/baja para que quede a la altura exacta */
}





/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 767px){

  /* ================================
     MENSAJE EN MÓVIL (layout normal)
     ================================ */

  /* Quitamos el overlay y lo devolvemos al flujo */
  .bhorus-price-cta .bhorus-cta__actions--msg{
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;

    width: 100% !important;

    /* separación con el precio y con la NOTA */
    margin: 12px 0 20px 0 !important;
    padding: 0 !important;

    display: flex;
    justify-content: center;
  }

  /* La píldora ocupa toda la anchura de la columna */
  .bhorus-price-cta .bhorus-cta__actions--msg .bhorus-cta__msg{
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 auto !important;   /* centrado real */
    padding: 12px 16px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;
  }

  /* Texto perfectamente centrado */
  .bhorus-price-cta .bhorus-cta__msg-text{
    text-align: center;
    line-height: 1.3;
  }

}