How to use nested SliverList in Flutter

Question

I have two dependent lists e.g ListView.builder inside ListView.builder where I set the inner's shrinkWrap to true which is not recommended way but it works and now I want to convert that code to equivalent using Slivers

 ListView.builder(
          itemCount: offers.length,
          itemBuilder: (context, toIndex) => ListView.builder(
            itemCount: offers[toIndex].offers.length,
            shrinkWrap: true,
            itemBuilder: (context, index) {
              return GestureDetector(
                onTap: () {
                  Navigator.of(context).push(
                    MaterialPageRoute(
                      builder: (context) => const SupermarketPage(),
                    ),
                  );
                },
                child: Padding(
                  padding: const EdgeInsets.only(right: 10),
                  child: Card(
                    margin: const EdgeInsets.all(8.0),
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Column(
                        children: [
                          Row(
                            children: [
                              SizedBox(
                                height: 30,
                                width: 30,
                                child: CachedNetworkImage(
                                  imageUrl: offers[toIndex].logo,
                                  height: 30,
                                  width: 30,
                                ),
                              ),
                              const SizedBox(width: 5),
                              Text(offers[toIndex].supermarketName!),
                            ],
                          ),
                          const SizedBox(height: 5),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              SizedBox(
                                width: MediaQuery.of(context).size.width / 2,
                                child: Text(
                                    offers[toIndex].offers[index].description),
                              ),
                              CachedNetworkImage(
                                imageUrl: offers[toIndex].offers[index].url,
                                height: 30,
                                width: 30,
                              ),
                            ],
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              );
            },
          ),
        )

What I tried

Scaffold(
      appBar: AppBar(
        title: const Text('Offers'),
      ),
      body: state.when(
        loading: () => const Center(child: CircularProgressIndicator()),
        loaded: (offers) => CustomScrollView(
          slivers: [
            SliverList(
              delegate: SliverChildBuilderDelegate(
                (BuildContext context, int outerIndex) => SliverList(
                  delegate: SliverChildBuilderDelegate(
                    (BuildContext context, int innerIndex) => GestureDetector(
                      onTap: () {
                        Navigator.of(context).push(
                          MaterialPageRoute(
                            builder: (context) => const SupermarketPage(),
                          ),
                        );
                      },
                      child: Padding(
                        padding: const EdgeInsets.only(right: 10),
                        child: Card(
                          margin: const EdgeInsets.all(8.0),
                          child: Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: Column(
                              children: [
                                Row(
                                  children: [
                                    SizedBox(
                                      height: 30,
                                      width: 30,
                                      child: CachedNetworkImage(
                                        imageUrl: offers[outerIndex].logo,
                                        height: 30,
                                        width: 30,
                                      ),
                                    ),
                                    const SizedBox(width: 5),
                                    Text(offers[outerIndex].supermarketName!),
                                  ],
                                ),
                                const SizedBox(height: 5),
                                Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  children: [
                                    SizedBox(
                                      width:
                                          MediaQuery.of(context).size.width / 2,
                                      child: Text(offers[outerIndex]
                                          .offers[innerIndex]
                                          .description),
                                    ),
                                    CachedNetworkImage(
                                      imageUrl: offers[outerIndex]
                                          .offers[innerIndex]
                                          .url,
                                      height: 30,
                                      width: 30,
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ),
                    childCount: offers[outerIndex].offers.length,
                  ),
                ),
                childCount: offers.length,
              ),
            )
          ],
        ),
      ),
    );

but it causes the following error:

A RenderRepaintBoundary expected a child of type RenderBox but received a child of type RenderSliverList.

There are similar questions but don't have solutions I want: 1 and 2