.api {

  h2 {
    margin-top: 4rem;
  }

  h3 {
    margin-top: 2rem;
  }

  hr {
    border: 1px solid #ccc;
  }

  .api-ref {
    
    h3 {

      &:target {
        background-color: #ffff9a;
      }

      code {
        padding: 0.1rem 0.3rem;
        background-color: #ddd;
        font-weight: 700;
      }

      .obsolete {
        padding: 0.1rem 0.3rem;
        background-color: #ff8484;
        font-weight: 500;
      }

      .internal {
        padding: 0.1rem 0.3rem;
        background-color: #cdd0ff;
        font-weight: 500;
      }

      a {
        font-weight: 500;
      }
    }

    p {
      
      &.obsolete {
        font-weight: 700;

        span {
          display: inline-block;
          margin-right: 0.5rem;
          width: 1.4rem;
          aspect-ratio: 1/1;
          border-radius: 50%;
          text-align: center;
          padding: 0.1rem;
          background-color: #ff8484;
          user-select: none;
        }
      }
      
      &.note {
        font-weight: 700;

        span {
          display: inline-block;
          margin-right: 0.5rem;
          width: 1.4rem;
          aspect-ratio: 1/1;
          border-radius: 50%;
          text-align: center;
          padding: 0.1rem;
          background-color: #ffff8e;
          user-select: none;
        }
      }
    }

    pre {
      padding: 0.5rem 0.7rem;
      padding-bottom: 0.6rem;
      background-color: #eee;
      overflow-x: auto;
    }

    ul {
      padding-left: 2ch;

      li {
        
      }
    }
  }

  .toc {

    table {
      width: 100%;
      border: 1px solid #aaa;
      border-collapse: collapse;

      tbody {

        tr {

          td {
            border: 1px solid #bbb;
            padding: 0.2rem 0.3rem;
            vertical-align: top;

            &:first-child {
              width: 40%;
            }

            &:last-child {
              width: 60%;
            }

            .obsolete {
              padding: 0.05rem 0.15rem;
              background-color: #ff8484;
              font-weight: 500;
            }

            .internal {
              padding: 0.05rem 0.15rem;
              background-color: #cdd0ff;
              font-weight: 500;
            }
          }
        }
      }
    }
  }
}