.container { @mixin dark { box-shadow: 0 2px 4px var(--mantine-color-dark-6), 0 4px 24px var(--mantine-color-dark-6); } @mixin light { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 4px 24px rgba(0, 0, 0, 0.16); } padding: rem(25); } .icon { width: rem(18px); height: rem(18px); } .light { display: block; } .dark { display: none; } :global([data-mantine-color-scheme='dark']) .light { display: none; } :global([data-mantine-color-scheme='dark']) .dark { display: block; }