.size-chart-button.link {
  padding: 0;
  border: 0;
  background: none;
  text-decoration: underline;
  text-underline-offset: 0.3rem;
  text-transform: uppercase;
  font-size: 1.4rem;
  cursor: pointer;
}

.size-chart-modal {
  .modal__header {
    padding: 1.6rem 2.8rem;
    border-bottom: 1px solid rgb(var(--color-horizontal-rule));

    h1 {
      margin-bottom: 0;
    }
  }

  .modal__content {
    width: clamp(350px, 100%, 500px);
    max-width: calc(100% - 3rem);
    border: none;

    @media screen and (min-width: 1200px) {
      max-height: 85vh;
    }
  }

  .size-chart-content {
    padding: 2.8rem;

    th {
      background-color: rgb(var(--color-foreground));
    }

    .table {
      display: table;
      border-spacing: 0px;
      width: 100%;
      margin-bottom: 1.6rem;

      th,
      td {
        padding: 1.2rem;
        vertical-align: top;
        border-top: 0;
        border-left: 0;
      }
    }

  }

  .sizechart {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .modal__toggle {
    top: 1.4rem;
    right: 1.4rem;
  }
}
