How to prevent stacked bars aggregating by date in DASH?

Question

I have a simple dataframe who's index is a time series. The dataframe looks something like this:

I want to shows stacked bars for the 'Percent_male' and 'Percent_Female' columns using plotly.graph_objects and Dash. This works fine for data rows who's date index are unique. However, any rows whose index is not a unique date, such as for '2022-10-10' for example, in which there are 4 data samples occurring on the same date, the 4 samples all aggregate into one large stacked bar, but I wish to keep separate bars per sample/ row. The end result looks like:

The 2 traces are quite simply:

`trace1 = go.Bar(
    x = df.index,
    y = df.Percent_Male,
    name = '% Male',
)

trace2 = go.Bar(
    x = df.index,
    y = df.Percent_Female,
    name = '% Female'
)`

And the Plotly go figure is created in the Dash app.layout like so:

`app.layout = html.Div([
    html.H1('Gender Balance'),
    html.Div([
        dcc.Graph(
            id='plot1',
            figure={
                'data': data2,
                'layout':go.Layout(
                    title='Historic',
                    height=640,
                    width=980,
                    barmode='stack',
                )
            }
        )],style={'display':'inline-block'}
])`

Is there any way to plot unique bars per dataframe column?