Currently working on a streamlit project,
when I started to make a bar chart with altair, I need a grouped bar graph with a text on top, something like below:

But what I got was something like this:

What I am currently coding looks something like this:

bars = alt.Chart().encode(
        x=selected_actual,
        y=alt.Y(" ", axis=alt.Axis(tickSize=0, labelFontSize=0, title="")),
        color=" ",
        tooltip= [alt.Tooltip("Nombre de Tienda", title = "Tienda"),
                  alt.Tooltip(shorthand=selected_actual, format=",.4r")]
    ).properties(height=50)

    text=alt.Chart(df_Total[df_Total[" "]=='Diferencia']).encode(
        y="Nombre de Tienda",
        x=selected_actual,
        text=alt.Text(selected_actual, format=".2%", aggregate='min'),
    )

    combined = alt.layer(bars.mark_bar(), text.mark_text(size=15, dx=10, dy=0, align='left'))
    c = combined.facet(data=df_Total, row=alt.Row("Nombre de Tienda", title='', header=alt.Header(labelAngle=-55, labelAnchor='end')))

    st.altair_chart(c)

I do not completely understand how altair works, is there a simpler way to do this? that can show a tooltip on hover, I tried matplotlib, but it does not contemplate the interactions.
I would greatly appreciate your help!