Fill content responsively into card with reduced rowheight

Hello community,

Can any html/css experts please guide me as to how to fill the contents of a card responsively. Also the card content should fill all empty horizontal space even when the sidebar is collapsed. Using fixed spacers or HSpacer doesn’t help unfortunately.

MRE below

import panel as pn
import param

class Inputs(param.Parameterized):
    input1 = param.ObjectSelector(objects=[1, 2, 3, 4])
    input2 = param.ObjectSelector(objects=[1, 2, 3, 4])

def main_pane():
    a = pn.pane.Markdown('<span style="font-family:Trebuchet MS;font-size:16px;color:gray">ABC (10 Sep 2022)</span>')
    b = pn.pane.Markdown('<span style="font-family:Trebuchet MS;font-size:16px;color:gray">A</span>'
                         '<span style="color:red;font-size:13px">100.00</span>')
    c = pn.pane.Markdown('<span style="font-family:Trebuchet MS;font-size:16px;color:gray">B</span>'
                         '<span style="color:red">120.00</span>')
    d = pn.pane.Markdown('<span style="font-family:Trebuchet MS;font-size:16px;color:gray">C</span>'
                         '<span style="color:red">130.00</span>')
    return pn.Row(pn.Column(a), pn.layout.HSpacer(), pn.Column(b), pn.Column(c), pn.Column(d), margin=(-25, 0, 0, 0),

if __name__.startswith('bokeh'):
    t = pn.template.FastGridTemplate(
        site='Panel', title='Test',
        cols={'lg': 24, 'md': 20, 'sm': 12, 'xs': 8, 'xxs': 2},
    t.main[:1, 0:11] = pn.panel(main_pane, lazy=True)

Empty Space even with sizing_mode set to stretch_width

More empty space when the sidebar is collapsed:

Many Thanks