/* Inline Related Posts Start */
.mp-inline-related-posts {
  background-color: var(--ilp-accent-bg-light, #e0e0e0);
  padding: var(--ilp-card-padding, 0.75rem 0.75rem);
  border-radius: var(--ilp-card-radius, 1rem);
  margin-block: var(--ilp-card-margin, 2rem);
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  transition: 300ms;
  & .mp-irp-inner {
    display: flex;
    gap: 1rem;
    align-items: center;
    & .mp-irp-image-wrapper {
      line-height: 0;
      & img {
        max-width: 10rem;
        min-height: 100%;
        object-fit: cover;
        border-radius: var(--ilp-image-radius, 0.5rem);
      }
    }
    & .mp-irp-title {
      margin: 0;
      font-size: 1.25rem;
      font-style: normal;
      font-weight: 600;
      line-height: 1.6875rem;
      color: var(--ilp-accent-dark, #1e1e1e);
      &.mp-irp-title--has-icon {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.5rem;
      }
      & .mp-irp-title-icon {
        flex-shrink: 0;
      }
      & a {
        color: var(--ilp-accent-dark, #1e1e1e);
        text-decoration: underline;
      }
    }
    & .mp-irp-meta {
      font-size: 1.25rem;
      color: var(--ilp-accent-light, #e0e0e0);
    }
  }
  & .mp-irp-icon-wrapper {
    position: relative;
    line-height: 0;
    & .mp-irp-icon path {
      stroke: var(--ilp-accent-dark, #1e1e1e);
    }
    &::before {
      content: '';
      width: 2px;
      height: 2.75rem;
      position: absolute;
      top: -0.5rem;
      left: -1rem;
      background-color: var(--ilp-accent-dark, #1e1e1e);
      border-radius: 5rem;
    }
  }

  &:hover {
    background-color: var(--ilp-accent-bg-dark, #1e1e1e);
    & .mp-irp-inner {
      & .mp-irp-image-wrapper {
      }
      & .mp-irp-title {
        color: var(--ilp-accent-light, #fff);
        & a {
          color: var(--ilp-accent-light, #fff);
        }
      }
      & .mp-irp-meta {
        font-size: 1.25rem;
        color: var(--ilp-accent-light, #fff);
      }
    }
    & .mp-irp-icon-wrapper {
      & .mp-irp-icon path {
        stroke: var(--ilp-accent-light, #fff);
      }
      &::before {
        background-color: var(--ilp-accent-light, #fff);
      }
    }
  }
}
@media (max-width: 1024px) {
  .mp-inline-related-posts {
    padding: 1.5rem;
    & .mp-irp-inner {
      & .mp-irp-image-wrapper,
      .mp-irp-meta {
        display: none;
      }
    }
  }
}
/* Inline Related Posts End */
