.root
  padding 15px
  color $ui-text-color
.group
  margin-bottom 45px
.group-header
  font-size 24px
  color $ui-text-color
  padding 5px
  border-bottom $default-border
  margin-bottom 15px

.group-header2
  font-size 18px
  color $ui-text-color
  padding 5px
  margin-bottom 15px

.group-section
  margin-bottom 15px
  display flex
  line-height 30px
.group-section-label
  width 150px
  text-align right
  margin-right 10px
  font-size 14px
.group-section-control
  flex 1
.group-section-control-input
  height 30px
  vertical-align middle
  width 150px
  font-size 12px
  border solid 1px $border-color
  border-radius 2px
  padding 0 5px
  &:disabled
    background-color $ui-input--disabled-backgroundColor

.group-checkBoxSection
  margin-bottom 15px
  display flex
  line-height 30px
  padding-left 15px

.group-control
  border-top $default-border
  padding-top 10px
  box-sizing border-box
  height 40px
  text-align right
  :global
    .alert
      font-size 12px
      line-height 30px
      padding 0 5px
      float right
.group-control-leftButton
  float left
  colorDefaultButton()
  border $default-border
  border-radius 2px
  height 30px
  padding 0 15px
  margin-right 5px
.group-control-rightButton
  float right
  colorPrimaryButton()
  border none
  border-radius 2px
  height 30px
  padding 0 15px
  margin-right 5px
.group-hint
  border $ui-border
  padding 10px 15px
  margin 15px 0
  border-radius 5px
  background-color $ui-backgroundColor
  color $ui-inactive-text-color
  ul
    list-style inherit
    padding-left 1em
    line-height 1.2
  p
    line-height 1.2

colorDarkControl()
  border-color $ui-dark-borderColor
  background-color $ui-dark-backgroundColor
  color $ui-dark-text-color
body[data-theme="dark"]
  .root
    color $ui-dark-text-color

  .group-header
    color $ui-dark-text-color
    border-color $ui-dark-borderColor

  .group-header2
    color $ui-dark-text-color

  .group-section-control-input
    border-color $ui-dark-borderColor

  .group-control
    border-color $ui-dark-borderColor
  .group-control-leftButton
    colorDarkDefaultButton()
    border-color $ui-dark-borderColor
  .group-control-rightButton
    colorDarkPrimaryButton()
  .group-hint
    colorDarkControl()
  .group-section-control
    select, .group-section-control-input
      colorDarkControl()