.record-win {
  outline: 4px solid @commonBgColor;
  border-radius: 4px;
  overflow: hidden;
  width: calc(~"100vw - 16px");
  height: calc(~"100vh - 16px");
  margin: 8px;
  box-sizing: content-box;
  -webkit-app-region: drag;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 8px rgba(#999, 1);

  .header {
    background-color: @commonBgColor;
    height: 24px;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px 4px 8px;
    .title {
      font-size: 14px;
      line-height: 24px;
    }
    .close-btn {
      -webkit-app-region: no-drag;
      cursor: pointer;
      fill: @commonIconColor;
      &:hover {
        fill: @commonIconHoverColor;
      }
    }
  }
  .content {
    flex: 1;
    // pointer-events: none;
    -webkit-app-region: no-drag;
    border: rgba(#999, 0.2) solid 1px;
  }
  .footer {
    // -webkit-app-region: no-drag;
    background-color: @commonBgColor;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 4px 8px 0 8px;
    display: flex;
    justify-content: space-between;
    -webkit-app-region: no-drag;
    .left {
    }
    .right {
      display: flex;
      align-items: center;
      .record-select {
        display: flex;
        align-items: center;
        margin-right: 16px;
        .label {
          margin-right: 8px;
        }
        &:last-of-type {
          margin-right: 0;
        }
      }
    }
  }
  .not-drag {
    -webkit-app-region: no-drag;
  }
  .record-btn {
    font-size: 32px;
    cursor: pointer;
  }
}

:global {
  .record-select-popup {
    .rc-virtual-list-holder {
      max-height: 100px !important;
    }
  }
}
