@import './../../styles/variables/index.scss';

.code {
  max-width: 853px;
  margin: 0 auto 80px auto;
  padding: 0 43px;

  .container {
    width: 100%;
    max-width: 683px;
    white-space: pre-wrap;
    > div {
      position: relative;
      border-radius: 10px;
    }

    > pre {
      white-space: pre-wrap;
    }

    .copyCodeText {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;

      .h5 {
        color: $medium-blue;
      }

      a {
        cursor: pointer;

        > svg {
          margin-left: 4px;
        }
      }
    }

    .btnShowCode {
      position: absolute;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      color: $medium-blue;
      background: transparent;
      border: none;
      cursor: pointer;
    }

    .gradient {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 171px;
      background: linear-gradient(
        180deg,
        rgba(177, 210, 243, 0) 0%,
        #b1d2f3 100%
      );
    }
  }
}
