@overlay-backdrop-color: hsla( @ui-hue, @ui-saturation, 6%, .6);

atom-panel.modal {
  color: @base-fg;
  padding: @component-padding;
  background-color: transparent;
  padding: @component-padding;

  atom-text-editor.mini {
    margin-bottom: @component-padding;
  }

  .select-list ol.list-group,
  &.select-list ol.list-group {
    border: 1px solid @overlay-border-color;
    background-color: @level-2-bg;

    li {
      border-bottom: 1px solid @level-3-bg;

      .status.icon {
        float: right;
        margin-right: @component-icon-padding;
        margin-left: @component-icon-padding;
        &:before {
          margin-right: 0;
        }
      }
    }
  }

  > * {
    position: relative;
  }

  // Container
  &:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background-color: @overlay-background-color;
    border: 1px solid @stroke;
    border-top: 1px solid @stroke;
    border-radius: 0 0 @component-border-radius @component-border-radius;
    box-shadow: @shadow;
  }
  // Backdrop
  &:after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background: @overlay-backdrop-color;
  }
}
