/*
 * Link behaviour (request 798691-R5): one icon after the link text says what happens when it is activated.
 * Which icon, target and hidden text a link gets comes from link-rules.json (see the Link behaviour page).
 * Markup: <a href target? rel?>Text<span class="link-meta">PDF · 2 MB</span>
 *         <span class="visually-hidden"> (PDF, 2 MB)</span><span class="link-icon" style="--icon:url(…)" aria-hidden="true"></span></a>
 * Copied by scripts/build-theme-library.py to the theme library and to edu_one/css.
 */
.link-icon {
  display: inline-block;
  flex: none;
  width: 1em;
  height: 1em;
  margin-inline-start: .3em;
  vertical-align: -.125em;
  background: currentColor; /* follows the link text: green or body colour, never orange */
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}
.link-meta {
  display: inline-block; /* keeps it out of the link underline */
  margin-inline-start: .5em;
  color: inherit; /* the link's own colour: readable wherever the link text is, on light or dark */
  font-size: .8125em;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Site setting "Button route icons" (798691-R34): show (default) / hide, one setting for the whole site, written as
 * data-button-icons="hide" on <html> (Drupal theme setting; a build flag for the static sites). Hide removes the
 * decorative page and file icons on buttons (.btn) only: link-rules.json icons.page and icons.file (arrow-right,
 * file-text since R39), plus download.svg for older markup (798691-R40; test-link-rules.py checks the parity). The ↗ new-tab icon always stays (R20: it is the
 * only visible warning before a new tab opens), and so do the hidden text and the link behaviour. */
:root[data-button-icons="hide"] .btn .link-icon:is([style*="/arrow-right.svg"], [style*="/file-text.svg"], [style*="/download.svg"]) {
  display: none;
}

/* File type after the name (798691-R39): PDF / Word / Excel links show their type icon right after the name, glued
   to its last word so it never wraps alone. On a C10 row with one button the icon follows the row title (brand green,
   ~20px, 6px gap) and the button says just "Download". */
.link-nowrap { white-space: nowrap; }
.link-icon.file-type-mark {
  width: 1.2em;
  height: 1.2em;
  margin-inline-start: 6px;
  vertical-align: -.25em;
  background: var(--edu-action-primary, #006437);
}
/* Inside a button (C10 rows with 2+ files, 798691-R39b): the same green type icon at 20px after the button label. */
.btn .link-icon.file-type-mark {
  width: 20px;
  height: 20px;
  margin-inline-start: 6px;
  vertical-align: middle;
}
.btn:has(> .file-type-mark) { column-gap: 0; } /* the icon's own 6px, not the button's flex gap as well */
/* A link whose name is one long token (a URL) may break it anywhere, so the glued type icon never pushes the line
   past its column (798691-R39c); ordinary words are unaffected (anywhere only breaks a word that cannot fit). */
a:has(> .link-nowrap) { overflow-wrap: anywhere; }