Why Main content and overflow menu button not clickable/scrollable?

Hi all, this is my last recourse by posting here since I really could not find a solution to my problem. My issue is that if there is a scrollable lazyVStack in the main content area, or if i cick on the overflow menu button, nothing happens.

the button to show the side menu view works ok though. as is clicking on the rows of the LazyVStack.

The cause of the ZStack top most but I am not sure what the problem is because the issue only occurs if it is in dark mode.

And, the issue only happens if i am in dark mode. Just weird.

This is the code

var body: some View {
    NavigationView {
      ZStack(alignment: .leading) {
        VStack(spacing: 0) {
          HStack {
            Button(action: {
              withAnimation(.default) {
                show.toggle()
              }
            }) {
              Image(systemName: "line.3.horizontal")
            }
            Spacer()
            Text("Home")
            Spacer()
            OverflowMenu()
          }
          .padding()
          .foregroundColor(.primary)
          .overlay(Rectangle().stroke(Color.primary.opacity(0.1), lineWidth: 1).shadow(radius: 3).edgesIgnoringSafeArea(.top))
           
          MainContent(navigationManager: navigationManager)
            .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        HStack {
          SideMenuView(dark: $dark, show: $show, navigationManager: navigationManager)
            .preferredColorScheme(dark ? .dark : .light)
            .offset(x: self.show ? 0 : -UIScreen.main.bounds.width / 1.2)
          Spacer(minLength: 0)
          Rectangle().stroke(.clear).frame(width: show ? UIScreen.main.bounds.width - (UIScreen.main.bounds.width / 1.2) : 0)
            .contentShape(Rectangle())
            .onTapGesture {
              if (show) {
                withAnimation(.default) {
                  show.toggle()
                }
              }
            }
        }
        .background(Color.primary.opacity(self.show ? (self.dark ? 0.05 : 0.2) : 0).edgesIgnoringSafeArea(.all))
      }
      .navigationBarHidden(true)
    }
    .navigationViewStyle(.stack)
  }

OverflowMenuView

struct OverflowMenu: View {
   
  @State var isClickedSettings = false
  @State var isClickedAbout = false
  @State var isClickedFaq = false
  @State var isClickedRemoveAds = false
   
  var body: some View {
    VStack {
      NavigationLink(destination: SettingView(), isActive: $isClickedSettings) {
        EmptyView()
      }
      .hidden()
       
      NavigationLink(destination: SettingView(), isActive: $isClickedAbout) {
        EmptyView()
      }
      .hidden()
       
      NavigationLink(destination: SettingView(), isActive: $isClickedFaq) {
        EmptyView()
      }
      .hidden()
       
      NavigationLink(destination: SettingView(), isActive: $isClickedRemoveAds) {
        EmptyView()
      }
      .hidden()
       
      Menu {
        Button {
          isClickedSettings = true
        }
        label: {
          Label {
            Text(StringTool.localize("settings"))
          }
          icon: {
            Awesome.Solid.cog.image
              .foregroundColor(UIColor(named: "MenuSetting")!)
          }
        }
         
        Button {
          isClickedAbout = true
        }
        label: {
          Label {
            Text(StringTool.localize("about"))
          }
          icon: {
            Awesome.Solid.infoCircle.image
              .foregroundColor(UIColor(named: "MenuAbout")!)
          }
        }
         
        Button {
          isClickedFaq = true
        }
        label: {
          Label{
            Text(StringTool.localize("faq"))
          }
          icon: {
            Awesome.Solid.bookOpen.image
              .foregroundColor(UIColor(named: "MenuFaq")!)
          }
        }
         
        Button {
          isClickedRemoveAds = true
        }
        label: {
          Label{
            Text(StringTool.localize("remove_ads"))
          }
          icon: {
            Awesome.Solid.unlockAlt.image
              .foregroundColor(UIColor(named: "MenuRemoveAds")!)
          }
        }
      } label: {
        Image(systemName: "ellipsis.circle")
      }
    }
  }
}

Any Idea?

I wish to understand more from the cause of this. The problem is because of .edgesIgnoringSafeArea(.all) under HStack. Once I removed this, it worked ok.

But my curiosity still wonders why it works if in light mode but in dark mode the issue persists.

Why Main content and overflow menu button not clickable/scrollable?
 
 
Q