/* ============================================================================
   braille-converter.css
   ============================================================================
   Loaded by:  unicode-tools/text-to-braille.php
               unicode-tools/braille-to-text.php
   Purpose:    Renders Braille text large enough to read, since standard Braille
               glyphs are small in most system fonts. Both tools reuse the same
               classes: .brl-output on the Braille output field of the forward
               converter, .brl-text on the Braille input field of the reverse
               converter. The dot-number modes reuse them too. Also adds a violet
               wavy-underline variant for the Braille to Text tool.
   Load order: Loaded AFTER tool-input.css; selectors are namespaced .brl-*.
   ============================================================================ */

textarea.brl-output,
textarea.brl-text {
	font-size: 1.5rem;
	line-height: 2;
	letter-spacing: .08em;
	word-break: break-word;
}

/* The Braille fields use a large font so the cells are legible; the English
   placeholder hint should not inherit that size. */
textarea.brl-text::placeholder {
	font-size: 1rem;
	letter-spacing: normal;
}

/* Overrides the blue default in templatemo.css for the reverse tool. */
.underline-wavy.brl-wavy {
	text-decoration: underline wavy #6f42c1;
}

.brl-legend {
	display: inline-block;
	margin: 6px 0;
	padding: 10px 16px;
	border: 1px solid #dbe3ec;
	border-radius: 8px;
	background-color: #f4f7fb;
	font-family: Consolas, Menlo, monospace;
	font-size: 1rem;
	line-height: 1.6;
	color: #2a4266;
	white-space: pre;
}

/* Braille cell shown inside the reference tables */
.brl-cell {
	font-size: 1.35rem;
	line-height: 1.2;
	white-space: nowrap;
}