How to correctly define colors for widget View for accented colors on watchOS?

Question

This is how it look like for all colors accent:

and it is ok, but when I change to the next accent it look the following way:

which is not ok.

The View 16h 18' is defined the following way:

var body: some View {
    HStack() {
        HStack(alignment: .center, spacing: 5) {
            Image.briefcase
                .renderingMode(.template)
                .resizable()
                .scaledToFit()
                .foregroundColor(color.inversed)
                .frame(width: 22, height: 22)
            Text("16h 18'")
                .font(.openSansLight(withSize: 17))
                .multilineTextAlignment(.center)
                .foregroundColor(color.inversed)
                .fixedSize()
        }
        .padding(.leading, 5)
        .padding(.trailing, 5)
        .padding(.top, 1)
        .padding(.bottom, 1)
    }
    .frame(height: 26)
    .background(color)
    .cornerRadius(13)
}

What to do to display it correctly for every possible accented configuration? I would prefer here, if there is white background, then black text.