/**
  * Link component styles
 */

.block-links {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--spacing) * .75);
  padding: calc(var(--spacing) * 2.25);

  ul.link-list {
    list-style: none;
    margin: 0;
    padding: 0;

    li {
      padding: calc(var(--spacing) * 1.5) 0;

      &:not(:last-child) {
        border-bottom: 1px solid var(--white);
      }
    }

    a {
      transition: var(--transition);
      display: flex;
      color: var(--body-font-color) !important;
      text-decoration: none;

      &:hover,
      &:focus {
        transform: translate3d(10px, 0, 0);
        color: var(--body-font-color) !important;
      }
    }

    .icon {
      transition: var(--transition);
      display: flex;
      justify-content: center;
      flex-shrink: 0;
      align-items: center;
      margin-right: calc(var(--spacing) * .75);

      svg {
        width: 16px;

        * {
          transition: fill .25s ease;
          fill: var(--white)
        }
      }
    }
  }
}