/* Back-link above a detail page <h1>: arrow, uppercase link, rule beneath.
   Ported unchanged from the former components/_shared/all-events-backlink.css
   (class `.event-all-events`), which the event detail and the procurement
   detail shared. It is now one component, so the stylesheet travels with it
   and SDC attaches it automatically. */

.listing-backlink {
  padding: 0rem 0 1rem 0;
  margin-bottom: 1rem;
  border-bottom: 1px solid #4b4b4b;
  font-weight: 700;

  a {
    text-decoration: none;
    font-size: 0.875rem;
    text-transform: uppercase;
    color: #ffff;
  }

  /* Underline on focus as well as hover: the link is distinguished from its
  surroundings by weight and case, so keyboard users get the same affordance
  the mouse gets (WCAG 2.4.7 works alongside the theme's focus ring). */
  a:hover,
  a:focus-visible {
    color: #ffff;
    text-decoration: underline;
  }

  svg {
    position: relative;
    top: -3px;
    transform-origin: center;
    transform: scale(0.8);
  }
}

/* The 992px and 1024px steps overlap on purpose — this is the original
   cascade: from 992px up the block gains its bottom margin, and from 1024px up
   the vertical padding drops back to the mobile value while that margin stays. */
@media (min-width: 992px) {
  .listing-backlink {
    padding: 2rem 0 1rem 0;
    margin-bottom: 2rem;
  }
}

@media (min-width: 1024px) {
  .listing-backlink {
    padding: 0rem 0 1rem 0;
  }
}


/* The link ships white, for the details whose back-link sits on the dark band.
   These three carry it on the white content column from 992px up, where white
   on white is invisible (WCAG 1.4.3) — add a bundle here whenever its back-link
   lands on light ground. */
@media (min-width: 992px) {
.page-node-type--tender .listing-backlink,
.page-node-type--event .listing-backlink,
.page-node-type--job-opportunity .listing-backlink,
.page-node-type--teaching-module .listing-backlink {
    a {
        color: #262626;
    }
    svg path {
      stroke :#262626;
    }
}
}