Displaying overlapping user data reflecting the status of an inventory in a horizontal stacked bar chart

I have an app in which users can track items. The app will flag when there are issues with items:

Warnings (orange UI colour)

  • Low stock
  • Expiring this month

Problems (red UI colour)

  • Out of stock
  • Expired

Items may have both a warning and a problem (e.g. an item with low stock that is expired).

There is a simple summary chart to summarise their inventory to the user.

Chart 1

This summarises 15 items; 1 has only a problem, 3 have only a warning, and 2 have both. The rest have no issues. Here the items with both are shown with overlapping orange and red lines. I am concerned that it looks confusing to have a separate number for the combined section, even though the numbers all add to the total.

Another option is to simplify it and show any items that have a problem as red (including those that also have a warning), and then show in orange those that only have warnings.

Chart 2

I think this is simpler and easier to see at a glance, but does not convey the full information. This might be acceptable as problems (red) are likely to be of more interest to the user than warnings (orange).

I would be grateful for advice on which provides the best user experience, or ways in which either could be improved.