@mixin nestable-theme($theme) {
    $primary: map-get($theme, primary);
    $accent: map-get($theme, accent);
    $warn: map-get($theme, warn);
    $foreground: map-get($theme, foreground);
    $background: map-get($theme, background);

    ngx-nestable {
        ul {
            .dd-placeholder {
                background: mat-color($primary, 200);
            }

            li {
                .nestable-expand-button {
                    color: mat-color($foreground, 'text');
                }

                .nestable-item-container {
                    background: mat-color($background, card);
                    color: mat-color($foreground, 'text');
                }

                .nestable-item-container:hover {
                    background: mat-color($background, 'hover');
                    color: mat-color($foreground, 'text');
                }
            }
        }
    }
    .dd-dragel {
        background-color: rgba(mat-color($primary, 100), 0.5);
        border: 2px dashed mat-color($primary, 500);

        .ngx-nestable-hidden, button {
            visibility: hidden;
        }

        .ngx-nestable-none {
            display: none;
        }
    }
}
