How to modify text in heading attr in angular bootstrap accordion

I am using accordion from angular bootstrap and I encountered a problem. I have the following code for the accordion:

<accordion close-others="true">
    <accordion-group heading="Living Room  Status: Complete">
        //some content
    </accordion-group>
    <accordion-group heading="Bed Room  Status: Complete">
        //some content
    </accordion-group>
</accordion>

The problem here is the header text is always left-aligned. I want the word "Status:Complete" to be right aligned but how can I do that?

enter image description here

Additional Info: I'm using this file from angular bootstrap >> ui-bootstrap-tpls-0.11.0.min.js

Solution

This solution might help you

<accordion close-others="true">
    <accordion-group heading="Living Room  Status: Complete">
       <accordion-heading>
        <p class="clearfix" style="margin-bottom: 0;"><span  style="float: left;">Living Room</span> <span style="float: right;">Status: Complete</span></p>
       </accordion-heading>
  This content is straight in the template.
</accordion-group>
    </accordion-group>
    <accordion-group heading="Bed Room  Status: Complete">
     <accordion-heading>
        <p class="clearfix" style="margin-bottom: 0;"><span  style="float: left;">Bed Room</span> <span style="float: right;">Status: Complete</span></p>
       </accordion-heading>
    </accordion-group>
</accordion>