Inverted corners

:root {
                        --inverted-corners-background: #52525b;
                        --inverted-corners-size: 2rem;
                    }

                    .inverted-corners {
                        background-color: var(--inverted-corners-background);

                        /* Used to position the corner */
                        position: relative;
                    }

                    .inverted-corners::before {
                        content: '';

                        /* Absolute position */
                        bottom: calc(-2 * var(--inverted-corners-size));
                        left: 0;
                        position: absolute;

                        /* Size */
                        height: calc(2 * var(--inverted-corners-size));
                        width: var(--inverted-corners-size);

                        /* Border */
                        background-color: transparent;
                        border-top-left-radius: var(--inverted-corners-size);
                        box-shadow: var(--inverted-corners-background) 0px calc(-1 * var(--inverted-corners-size)) 0px
                            0px;
                    }