/////////////////////////////
// THEME / ELEMENTS / ANCHORS
/////////////////////////////


@use "../variables/" as var;
@use "../mixins/" as mixins;


// Finds anchor tags with hrefs that begin with `//`, `http://` or `https://`, do not contain `unl.edu`, and do not contain images or SVGs. Do not show when printed; URL is shown instead.
@media not print {

  .unl a[href^='//']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after,
  .unl a[href^='http://']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after,
  .unl a[href^='https://']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after,
  .unl a[target="_blank"]:not(:has(img)):not(:has(svg))::after {
    background-color: currentColor;
    content: '';
    display: inline-block;
    @include mixins.h-3;
    margin-left: #{var.$ms-8}em;
    margin-right: #{var.$ms-16}em;
    mask-position: 50% 50%;
    mask-repeat: no-repeat;
    mask-size: contain;
    position: relative;
    @include mixins.w-3;
  }


  // External links (not unl.edu)
  .unl a[href^='//']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after,
  .unl a[href^='http://']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after,
  .unl a[href^='https://']:not([href*='unl.edu']):not(:has(img)):not(:has(svg))::after {
    mask-image: url('@images/external-link.svg?no-inline'); // Use SVG as a mask to show the background-color
  }


  // target="_blank"
  .unl a[target="_blank"]:not(:has(img)):not(:has(svg))::after {
    mask-image: url('@images/target-blank.svg?no-inline'); // Use SVG as a mask to show the background-color
  }

}
