@import "../../style/CommonStyle.module.less";
@import "../../style/utils.module.less";

.container {
  position: absolute;
  .flex(@direction: column, @alignCenter: flex-start);
  gap: 12px;
  .size(@w: 312px, @h: 132px);
  padding: 18px;
  border-radius: 10px;
  background-image: linear-gradient(to top, #1a1a1a 93%, #8e8e8e);
  .font(@fontFamily: @baseFontBold, @fontSize: 36px);
  color: @COLOR_WHITE;
  box-shadow: 5px 8.7px 15px 0 rgba(6, 0, 1, 0.5);

  &::after {
    .position(@position: absolute, @top: 0, @right: 0);
    .size(@w: 100%, @h: 100%);
    display: block;
    box-sizing: border-box;
    border-radius: 10px;
    border: 2px solid rgba(255, 255, 255, 0.7);
    content: "";
  }

  > img {
    .size(@w: 126px, @h: 42px);
  }

  div {
    .flex(@justifyCenter: flex-start);
    gap: 4px;
    letter-spacing: -0.9px;
    img {
      .size(@w: 42px, @h: 42px);
    }
  }
}
