/**
 * @file
 * Footer regions.
 */

@import "../base/media-queries.pcss.css";

.site-footer {
  position: relative; /* stack above left social bar */
  color: var(--color--gray-65);
  background: linear-gradient(180deg, var(--color--gray-5) 0%, var(--color--gray-10) 100%);

  & .menu {
    margin-inline-start: 0;
    list-style: none;

    & ul {
      margin-inline-start: var(--sp);
    }

    & li {
      margin-block-end: var(--sp0-5);
    }
  }

  & a {
    color: inherit;

    &:hover {
      text-decoration: none;
    }
  }
}

@media (--nav) {
  body:not(.is-always-mobile-nav) .site-footer {
    border-inline-start: solid var(--content-left) var(--color--black);
  }
}
