/**
 * Front-end base styles for annotated text (Rough Notation draws the SVG on top).
 * Loaded site-wide alongside assets/js/annotations.js.
 *
 * @package arpl-fse
 */

[data-annotate] {
	position: relative;
}

/* Circles/boxes wrap a whole phrase — keep them on one line so the drawn shape
   stays a clean loop. Underline/highlight/strike may wrap freely (multiline). */
[data-annotate="circle"],
[data-annotate="box"] {
	white-space: nowrap;
}

/* Opt-in hover-underline links (add the `arpl-hover-underline` class to a block).
   The hand-drawn underline is the only underline, so suppress the CSS one. */
.arpl-hover-underline a {
	text-decoration: none;
	cursor: pointer;
}