// Copyright (C) 2022 The Trustees of Indiana University
// SPDX-License-Identifier: BSD-3-Clause

@use '../core' as *;

.#{$prefix}-link-hub {
  list-style: none;
  padding: 0;
  display: grid;
  grid-gap: 0 $spacing-md * 2;
  grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));

  &__item {
    border-top: 1px solid $color-black-100;
    margin: 0;
  }

  &__link {
    display: block;
    text-decoration: none;
    padding-top: $spacing-sm;
    padding-right: $spacing-xl;
    padding-bottom: $spacing-sm;
    position: relative;
  }

  &__link::after {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%2394D2E7" viewBox="0 0 16 16"><path d="M1 7h10.844L7.737 2.146 9.263.854 15.31 8l-6.047 7.146-1.526-1.292L11.844 9H1V7Z"></path></svg>');
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    width: $spacing-sm;
    height: $spacing-sm;
    position: absolute;
    top: $spacing-sm * 1.25;
    right: $spacing-sm;
  }

  &__text,
  &__description {
    display: block;
  }

  &__link:hover &__text {
    text-decoration: underline;
  }

  &__text {
    font-weight: $font-weight-regular;
    font-size: $ts-20;
    line-height: 1.25;
  }

  &__description {
    font-size: $ts-14;
    color: $color-black-400;
    margin-top: $spacing-xs;
  }

  &--stacked {
    display: block;
  }
}