@import '../../style/themes/default.less';

@component-prefix-cls: ~'@{qn-prefix}-button';

.@{component-prefix-cls} {
  &-group {
    display: inline-flex;
    flex-direction: column;
    padding: 12px 20px;
    white-space: nowrap;

    ::selection {
      background-color: none;
    }

    &-overlay {
      display: none;
      flex-grow: 0;
    }

    &-open {
      position: relative;
    }

    &-open &-overlay {
      position: absolute;
      top: 0;
      right: 0;
      z-index: @zindex-popover;
      display: block;
      min-width: 100%;
      padding: 12px 20px;
      background-color: @popover-bg;
      border-radius: @border-radius-base;
      box-shadow: @box-shadow-base;

      .@{ant-prefix}-space {
        justify-content: flex-end;
        width: 100%;
      }
    }

    &-open &-overlay &-inner {
      .@{ant-prefix}-space {
        justify-content: flex-start;
      }
    }

    .@{ant-prefix}-badge {
      cursor: pointer;

      &-count {
        height: 16px;
        padding: 0 6px;
        color: @text-color-secondary;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        background-color: #f5f5f5;
        border-radius: 12px;
      }
    }

    &-icon {
      display: inline-block;
      width: 14px;
      height: 14px;
      background: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.342 10.16l-3.146-3.147A5.205 5.205 0 0 0 10.5 5.25 5.256 5.256 0 0 0 5.25 0C4.53 0 3.827.145 3.166.432l-.313.135s.002 0 0 .001a.267.267 0 0 0-.08.433c0 .001-.002.002-.001.004l2.94 2.94-1.769 1.767-2.88-2.88c-.005 0-.01 0-.015-.006a.312.312 0 0 0-.515.114c-.001.004-.003.002-.005.002l-.097.225A5.214 5.214 0 0 0 0 5.25a5.256 5.256 0 0 0 5.25 5.25c.606 0 1.197-.103 1.764-.305l3.146 3.146c.425.425.99.659 1.591.659s1.167-.234 1.592-.66a2.253 2.253 0 0 0 0-3.18zm-.706 2.474c-.237.236-.55.366-.884.366a1.24 1.24 0 0 1-.885-.366L7.25 9.016l-.312.134a4.22 4.22 0 0 1-1.687.35 4.255 4.255 0 0 1-4.14-5.209l2.643 2.644c.111.089.263.09.376.006l2.78-2.78v-.003a.31.31 0 0 0 .02-.412L4.29 1.109a4.255 4.255 0 0 1 5.21 4.14c0 .585-.118 1.152-.35 1.687l-.135.312 3.62 3.618c.486.488.486 1.28 0 1.768z' fill='%23323233' fill-rule='nonzero'/%3E%3C/svg%3E")
        no-repeat center/14px;
    }
  }
}