OwlCarousel vs Bootstrap tabs. Incorrect display after resize. How to fix?

Question

JavaScript

Hello. The situation is as follows: there is a standard bootstrap tab - two tabs, each with a slider (Owl Carousel). Initialization of the first slider occurs immediately when the page is loaded (plus, when I switch the tab again, I will refresh it via refresh.owl.carousel), the second - by clicking on the second tab (after the shown.bs.tab event).

In general, everything works correctly, but after resizing the page, if you make another tab active, the slider in it is displayed incorrectly. I can not understand why, if in theory it should be rendered again.

The sandbox is here . Big request for help..