Why doesn't navigation work properly in breadcrumbs (micro markup)?

Question

WordPress

Hello everyone!) I have the following problem: in the Schema.org microdata of breadcrumbs, 1 out of 4 "ListItem" navigation elements is incorrectly formed, namely the directory.
WordPress site, seo plugin - Rank Math SEO
Link to check

What I have now (only 3 elements):

{
            "@type": "BreadcrumbList",
            "@id": "https://www.soskin.com.ua/product/cicaplex-flash/#breadcrumb",
            "itemListElement": [
                {
                    "@type": "ListItem",
                    "position": 1,
                    "item": {
                        "@id": "https://www.soskin.com.ua/",
                        "name": "\u0413\u043b\u0430\u0432\u043d\u0430\u044f"
                    }
                },
                {
                    "@type": "ListItem",
                    "position": 2,
                    "item": {
                        "@id": "https://www.soskin.com.ua/product-category/r-vosstanovlenie/",
                        "name": "[ R+ ] \u0412\u043e\u0441\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435"
                    }
                },
                {
                    "@type": "ListItem",
                    "position": 3,
                    "item": {
                        "@id": "https://www.soskin.com.ua/product/cicaplex-flash/",
                        "name": "CICAPLEX FLASH HYDRA-CALMING INFUSION MASK – \u0413\u0438\u0434\u0440\u043e\u0443\u0441\u043f\u043e\u043a\u0430\u0438\u0432\u0430\u044e\u0449\u0430\u044f \u0438\u043d\u0444\u0443\u0437\u0438\u043e\u043d\u043d\u0430\u044f \u043c\u0430\u0441\u043a\u0430 \u0432 \u0431\u0438\u043e\u0446\u0435\u043b\u044e\u043b\u043e\u0437\u0435"
                    }
                }
            ]
        }

And this is how it should be (the directory is added):

{
"@context": "http://schema.org",
"@type": "BreadcrumbList",
"itemListElement":
[
{"@type": "ListItem",
"position": 1,
"item":
{"@id": "https://www.soskin.com.ua/",
"name": "Главная"}
},
{"@type": "ListItem",
"position": 2,
"item":
{"@id": "https://www.soskin.com.ua/katalog/",
"name": "Каталог"}
},
{"@type": "ListItem",
"position": 3,
"item":
{"@id": "https://www.soskin.com.ua/product-category/r-vosstanovlenie/",
"name": "[ R+ ] ВОССТАНОВЛЕНИЕ"}
},
{"@type": "ListItem",
"position": 4,
"item":
{"@id": "https://www.soskin.com.ua/product/cicaplex-flash/",
"name": "CICAPLEX FLASH HYDRA-CALMING INFUSION MASK – ГИДРОУСПОКАИВАЮЩАЯ ИНФУЗИОННАЯ МАСКА В БИОЦЕЛЮЛОЗЕ
"}
}
]
}

Here is the breadcrumb code from functions.php:

/
 * Filter to change breadcrumb args.
 *
 * @param  array $args Breadcrumb args.
 * @return array $args.
 */
add_filter( 'rank_math/frontend/breadcrumb/args', function( $args ) {
  $args = array(
    'delimiter'   => ' / ',
    'wrap_before' => '<nav class="rank-math-breadcrumb" itemscope itemtype="https://schema.org/BreadcrumbList">',
    'wrap_after'  => '</nav>',
    'before'      => '<span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">',
    'after'       => '</span>',
  );
  return $args;
});

/
 * Filter to change breadcrumb html.
 *
 * @param  html  $html Breadcrumb html.
 * @param  array $crumbs Breadcrumb items
 * @param  class $class Breadcrumb class
 * @return html  $html.
 */
add_filter( 'rank_math/frontend/breadcrumb/html', function( $html, $crumbs, $class ) {?>

<nav class="mkdf-container-inner breadcrumbs rank-math-breadcrumb" itemscope="" itemtype="https://schema.org/BreadcrumbList">

        <? $iii = 0;
        foreach ($crumbs as $key => $crumb) {
            $iii++;
      if(is_woocommerce() && !is_shop()){
        $summ = count($crumbs) + 1;  
      }else{
        $summ = count($crumbs);
      }?>
                <? if($iii == $summ){?>
                    <span itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
                        <span class="last" itemprop="name"><? echo $crumb[0]?></span>
                        <meta itemprop="position" content="<? echo $iii?>" />
                    </span>
                <?}else{?>
            <span itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
              <a itemprop="item" href="<? echo $crumb[1]?>">
                <span itemprop="name"><? echo $crumb[0]?></span>
              </a>
              <meta itemprop="position" content="<? echo $iii?>" />
            </span>
            <span class="separator"> / </span>
          <? if($key == 0){
            if(is_woocommerce() && !is_shop()){
              $shop_page_url = '/katalog';
              $iii++;?>
              <span itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
                <a itemprop="item" href="<? echo $shop_page_url?>">
                  <span itemprop="name">Каталог</span>
                </a>
                <meta itemprop="position" content="<? echo $iii?>" />
              </span>
              <span class="separator"> / </span>
            <?}
          }
                }?>

        <?}?>

    </nav>

  <?
}, 10, 3);

Actually, there is a code for the catalog, but the markup element is not formed. I would be very grateful for any answer!