/* ============================================
   Ikony kategorií v menu – desktop i mobil
   Přidání nové kategorie:
   1) doplnit .menu-item-XXXX do seznamů v :is()
   2) přidat řádek .menu-item-XXXX{--i:url(...)}
   ============================================ */

/* Ikona před názvem kategorie */
#navigation :is(.menu-item-1468, .menu-item-1870, .menu-item-1888, .menu-item-1564, .menu-item-995, .menu-item-1805, .menu-item-1937, #nav-manufacturers) > a::before {
  content: "";
  display: block;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  background-color: #fff;
  -webkit-mask: var(--i) no-repeat center / contain;
  mask: var(--i) no-repeat center / contain;
}

/* Přiřazení SVG ikon */
.menu-item-1468 { --i: url(/user/documents/upload/set.svg); }
.menu-item-1870 { --i: url(/user/documents/upload/stamp.svg); }
.menu-item-1888 { --i: url(/user/documents/upload/paws.svg); }
.menu-item-1564 { --i: url(/user/documents/upload/flower.svg); }
.menu-item-995  { --i: url(/user/documents/upload/product.svg); }
.menu-item-1805 { --i: url(/user/documents/upload/pumpkin.svg); }
.menu-item-1937 { --i: url(/user/documents/upload/tag_discount_icon_tight.svg); }
#nav-manufacturers { --i: url(/user/documents/upload/brand.svg); }

/* Zvýrazněné položky s vlastním pozadím */
#navigation li.menu-item-1805 > a { background-color: #D07028; color: #fff !important; }
#navigation li.menu-item-1937 > a { background-color: #2B2B2B; color: #fff !important; }

/* ---------- Mobilní menu ---------- */
@media (max-width: 991px) {

  /* odkaz jako flex, aby ikona seděla vedle textu */
  #navigation .navigation-in > ul > li:is(.menu-item-1468, .menu-item-1870, .menu-item-1888, .menu-item-1564, .menu-item-995, .menu-item-1805, .menu-item-1937, #nav-manufacturers) > a {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  /* na bílém pozadí mobilního menu tmavé ikony
     (položky 1805 a 1937 mají barevné pozadí, takže zůstávají bílé) */
  #navigation :is(.menu-item-1468, .menu-item-1870, .menu-item-1888, .menu-item-1564, .menu-item-995, #nav-manufacturers) > a::before {
    background-color: #333;
  }
}
