$default-variables: (
  'Container____bg-color': var(--color--invert),
  'Container____border': none,
  'Container--editing____border': none,
  'Container--editable____border': none,
  'Container--editable--hover____border': none,
  'Container____outline-color': transparent,
  'Container____outline-width': 2px,
  'Container--uneditable____shadow': var(--shadow--s),
  'Container--editable____shadow': var(--shadow--m),
  'Container--editable--hover____shadow': var(--shadow--l),
  'Container--editing____shadow': var(--shadow--xl),
  'Container____radius': var(--radius--med)
);

@mixin generate-container-theme-variables($theme-variables: ()) {
  $variables: map-merge($default-variables, $theme-variables);

  @each $name, $value in $variables {
    --#{$name}: #{$value};
  }
}