<div class="dealflow-dashboard-widget" style="display:flex;flex-direction:column;position:relative;flex:1 1 0;min-height:0;">
    <div style="flex:1;display:flex;justify-content:space-between;text-align:center;font-size:13px;">
        <div style="flex:1;">
            <a href="{{ path('mautic_dealflow_index') }}" style="color:inherit;text-decoration:none;">
                <div style="font-size:24px;font-weight:700;color:var(--label-color-green, #28a745);">
                    {{ wonCount }}
                </div>
                <div style="color:var(--label-color-green, #28a745);font-size:11px;text-transform:uppercase;font-weight:700;margin-top:4px;">Won</div>
            </a>
        </div>
        <div style="flex:1;border-left:1px solid var(--border-subtle-01, #eee);border-right:1px solid var(--border-subtle-01, #eee);">
            <a href="{{ path('mautic_dealflow_index') }}" style="color:inherit;text-decoration:none;">
                <div style="font-size:24px;font-weight:700;color:var(--label-color-red, #bc4f4f);">
                    {{ lostCount }}
                </div>
                <div style="color:var(--label-color-red, #bc4f4f);font-size:11px;text-transform:uppercase;font-weight:700;margin-top:4px;">Lost</div>
            </a>
        </div>
        <div style="flex:1;">
            <a href="{{ path('mautic_dealflow_index') }}" style="color:inherit;text-decoration:none;">
                <div style="font-size:24px;font-weight:700;color:var(--brand-primary, #4e79a7);">
                    {{ openCount }}
                </div>
                <div style="color:var(--brand-primary, #4e79a7);font-size:11px;text-transform:uppercase;font-weight:700;margin-top:4px;">Open</div>
            </a>
        </div>
    </div>
    {% include '@DealFlow/Dashboard/_config_popover.html.twig' %}
</div>
