For the record, I upgraded my style and it fixed my outdated template but did not resolve my mobile login issue. It turns out the issue we were having was due to a CSS bug causing responsiveness to only apply if user had either twitter, facebook or Google plus connection. We enabled responsiveness irrespective of those connections being active by making change in login_bar.css template.
<xen:if is="@enableResponsive">
@media (max-width: @maxResponsiveWideWidth)
{
.Responsive #loginBar form.xenForm .ctrlWrapper
{
border-right: none;
margin-right: 10px;
}
.Responsive #loginBar form.xenForm #eAuthUnit
{
/*position: static;*/
width: @eAuthButtonWidth;
margin: 0 auto 10px;
}
}
</xen:if>