can't set cookie in custom local domain

I setting cookie using FastApi

response.set_cookie(key="rf_t", value=access_token, httponly=False, expires=120)

And its works perfect on "localhost:<any_port>" local domain

but I need subdomains and cross subdomain cookies so I found out you can change hosts file at \Windows\System32\Drivers\etc\hosts

and created couple of domains with subdomains like so:

127.0.0.1 main.shop.localhost
127.0.0.1 admin.shop.localhost
127.0.0.1 store.shop.localhost

127.0.0.1 shop.localhost

and cookie doesn't set for all of them, JSON responses come from server, but cookie doesn't set, it only sets when I'm using basic localhost domain

im using vue 3 vite on front, and setting dev domain and port in vite.config.js like so

server: {
    port: 5000,
    host: "shop.localhost"
  },

I guess it has something to do with chrome policy, because its not https, but is there any way I can use local subdomains, and be able to set cross cookies (or any cookies) for them?

Thanks you a lot my fellow developers!

Solution

Setting api server host to the same local domain (api.shop.localhost) as front (app.shop.localhost), made it work! shout-out to @Chris

For further details, please have a look at the following answers: