@import url("https://fonts.googleapis.com/css2?family=Electrolize&display=swap");

.card-modal-root {
  --theme-font: "Electrolize", sans-serif;
  .ant-drawer-content-wrapper {
    box-shadow: none;
  }
  .card-modal-drawer {
    width: 90%;
    left: 10%;
    --height: 640px;
    top: calc((100% - var(--height)) / 2);
    height: var(--height);
    position: relative;
    border-radius: 6px;
    background: #242424;
    .ant-drawer-header {
      padding: 10px 0;
      button {
        margin-right: 0;
      }
      .ant-drawer-header-title {
        flex-direction: row-reverse;
        padding-left: 24px;
      }
    }
  }
  .card-modal-container {
    position: relative;
    height: 100%;
  }
}
.card-modal-name {
  font-weight: bold;
  font-size: 1.2rem;
}

.atkLine {
  .title,
  .number {
    font-family: var(--theme-font);
  }
  .number {
    font-size: 30px;
    line-height: 36px;
  }
}

.attline {
  display: flex;
  flex-wrap: wrap;
  row-gap: 10px;
}

.card-modal-info {
  justify-content: space-between;
  position: relative;
  height: 204px; // TODO - fix this
}
