/**
 * Amazon purchase links and the affiliate disclosure.
 *
 * A separate sheet rather than an addition to the eight prebuilt
 * footnotes-*.min.css variants: those are minified with no source in the
 * repository, so editing them means editing minified CSS by hand, eight times.
 * This is enqueued only when the feature is active.
 *
 * The chip's glyph is Bootstrap Icons' bi-amazon, which the active theme
 * provides — BootHack enqueues the font on the front end. This plugin does not
 * ship its own copy: a webfont is ~100KB for one glyph, and a second copy of
 * Bootstrap Icons on a page that already has it is worse than the dependency.
 *
 * The consequence is worth knowing. On a theme without that font the chip
 * renders as an empty pill, because the label beside the glyph is hidden for
 * sighted readers by design. The link still works, still announces itself
 * correctly, and still carries its text on hover through title — but it has no
 * picture. Filter footnotes_amazon_link_label if a text chip suits the theme
 * better; the label is rendered, not discarded.
 */

/*
 * The purchase link, as a chip.
 *
 * Every declaration here is ordinary, unmarked CSS, and stays that way.
 *
 * 3.18.0 shipped this with !important on most of it, and the glyph colour set
 * through -webkit-text-fill-color, to survive a theme that reset links inside
 * .footnote_referrer and forced the tooltip's text colour — both marked, at a
 * specificity a plugin cannot predict. That was the plugin answering in kind.
 * BootHack 5.5.1 exempts .footnotes-amazon-link from those locks, so the
 * argument is settled at the source and none of it is needed.
 *
 * What carries the weight now is the :link/:visited pair. A chip is always an
 * anchor with an href, so one of them always matches, and the matching
 * selector's specificity is what the cascade uses — (0,2,1), which clears the
 * ordinary prose link rules (.prose a and friends, at (0,1,1)) on specificity
 * rather than on load order.
 *
 * A theme — or a site's own Additional CSS — that locks footnote links with
 * !important will win against this, and should. The fix belongs there, as an
 * exemption for .footnotes-amazon-link, not in an escalation here.
 *
 * On timmassey.local one such rule survives in Additional CSS:
 *
 *   .footnote_referrer a { font-weight: normal !important; border: none
 *   !important; }
 *
 * so the chip inside a tooltip renders unbordered and at normal weight. That
 * has been true since the chip shipped — neither property was ever marked here
 * — and it is the site owner's rule to relax, not this plugin's to shout down.
 */
a.footnotes-amazon-link,
a.footnotes-amazon-link:link,
a.footnotes-amazon-link:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-left: 0.4em;
	padding: 0.15em 0.5em;
	border: 1px solid #fcd200;
	border-radius: 999px;
	background-color: #ffd814;
	box-shadow: 0 1px 2px rgba( 15, 17, 17, 0.15 );
	color: #0f1111;
	font-size: 0.82em;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	vertical-align: baseline;
}

/*
 * The label, kept and hidden rather than removed.
 *
 * It is the link's accessible name. A link containing only an icon font glyph
 * has none — the glyph is a private-use codepoint, so a screen reader either
 * says nothing or reads the URL aloud. Hiding it this way rather than with
 * display: none is the point: display: none removes it from the accessibility
 * tree along with the pixels.
 *
 * The icon itself is aria-hidden, so the name is announced once.
 */
.footnotes-amazon-link__label {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	border: 0;
	clip-path: inset( 50% );
	white-space: nowrap;
}

/*
 * The glyph. Sized in its own em so it does not inherit the chip's font-size
 * twice, and nudged off the baseline the icon font sets for a cap-height
 * glyph, which otherwise sits low inside a pill.
 */
a.footnotes-amazon-link .bi-amazon {
	display: block;
	font-size: 1.15em;
	line-height: 1;
}

/*
 * Hover, and the underline it has to refuse.
 *
 * The reference container's own stylesheet carries
 *
 *   .footnote_plugin_text a:hover { text-decoration: underline }
 *
 * at (0,2,1) — the same weight as a.footnotes-amazon-link:hover, and it is
 * enqueued after this sheet, so the tie went to the underline. A chip is a
 * button shape; an underline running through it reads as a mistake. Tooltips
 * were already correct only because they have no .footnote_plugin_text
 * ancestor, which is exactly the kind of accident worth not relying on.
 *
 * Chaining :link takes these to (0,3,1) and settles it on specificity. Same
 * device as the base rule, and for the same reason: a chip is always an anchor
 * with an href, so :link always matches.
 */
a.footnotes-amazon-link:link:hover,
a.footnotes-amazon-link:link:focus,
a.footnotes-amazon-link:visited:hover,
a.footnotes-amazon-link:visited:focus {
	border-color: #f2c200;
	background-color: #f7ca00;
	color: #0f1111;
	text-decoration: none;
}

a.footnotes-amazon-link:focus-visible {
	outline: 2px solid #0f1111;
	outline-offset: 2px;
}

/*
 * The disclosure, as a callout at the top of the reference container.
 *
 * The Associates terms want it with the links rather than buried, and the
 * container is where the links are. Muted on purpose: it is a required
 * statement, not a second call to action competing with the chips below it.
 */
.footnotes_reference_container_notices {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 0.75em;
}

.footnotes-amazon-disclosure {
	margin: 0;
	padding: 0.6em 0.9em;
	border-left: 3px solid #ff9900;
	border-radius: 3px;
	background-color: rgba( 255, 153, 0, 0.08 );
	font-size: 0.82em;
	font-style: normal;
	line-height: 1.5;

	/* The container is a table; a notice above it should not inherit the
	   centring some themes apply to cells. */
	text-align: left;
}
