Unable to change colors or customize internal modal them

[Calico Nino]

Hi,

I am trying to customize the modal with a color palette, but it doesn't seem that I am able to change the inner container background color, the current default in dark theme is dark grey. Anything I'm missing?

Currently, I am simply using the overrides, but also modalContentClassName, modalChildrenClassName & modalContainerClassName don't seem to do the trick.

overrides: {
    "connect-modal": {
      bg: { light: Colors.Purple300, dark: Colors.Purple300 },
      focusedBg: { light: Colors.Purple300, dark: Colors.Purple300 },
    },
    button: {
      bg: { light: Colors.Purple200, dark: Colors.Purple200 },
    },
    "connect-modal-wallet-button": {
      bg: { light: Colors.Purple400, dark: Colors.Purple400 },
    },
    "connect-modal-wallet-button-sublogo": {
      bg: { light: Colors.Purple400, dark: Colors.Purple400 },
    },
    "connect-modal-head-title": {
      bg: { light: Colors.Purple300, dark: Colors.Purple300 },
    },
    "connect-modal-wallet-button-label": {
      bg: { light: Colors.Purple300, dark: Colors.Purple300 },
    },
    "connect-modal-install-button": {
      bg: { light: Colors.Purple200, dark: Colors.Purple200 },
    },
  },
  defaultTheme: "dark",

Screencast.from.2023-12-15.03.20.06.PM.webm

[Calico Nino]

If anyone is facing this issue, you can add css styles to the existing styles classes

._1n3anio5 {
  background-color: transparent !important;
}

.nr9ap31 {
  z-index: 1000 !important;
}