@import './theme/index.less';
@import './mixins/config.less';
@import './mixins/common.less';

@modal-prefix-name: ~'@{namespace}-modal';
@modal-header-prefix-name: ~'@{modal-prefix-name}@{element-separator}header';
@modal-header-img-prefix-name: ~'@{modal-prefix-name}@{element-separator}header@{element-separator}img';
@modal-content-prefix-name: ~'@{modal-prefix-name}@{element-separator}content';
@modal-footer-prefix-name: ~'@{modal-prefix-name}@{element-separator}footer';

.@{modal-prefix-name} {
  font-family: @font-medium;
  font-size: @font-size-base;
  line-height: @line-height-base;
  text-align: left;
  color: @color-text-dark;
  .@{modal-header-prefix-name} {
    padding-top: @padding-xs + 2px;
    .flex(center, center);
  }
  .@{modal-header-img-prefix-name} {
    margin-right: 10px;
  }
  .@{modal-footer-prefix-name} {
    .flex(flex-end, center);
  }
  .onestop-button {
    font-size: @font-size-base;
    font-family: @font-medium;
    font-weight: normal;
    padding: @modal-button-padding;
    line-height: 18px;
    min-width: 80px;
    &--default {
      background-color: @dialog-button-default-bg-color;
      &:hover {
        border-color: none;
      }
      &:active {
        background-color: #D8D8D8;
      }
    }
    &--primary {
      &:hover {
        background-color: @green-0;
        border-color: @white;
      }
    }
  }
}