/* Case Converter — furniture beyond the shared .ftb-tool block in core.css. */

.ftb-tool-case-converter textarea{min-height:220px;font-family:var(--ftb-font);
	font-size:var(--ftb-text-base);line-height:1.6}
.ftb-tool-case-converter [data-ftb="output"]{background:var(--ftb-surface)}
/* Reserve the pane height so results never shift the page (§10 CLS). */
.ftb-tool-case-converter .ftb-tool-grid{min-height:300px}

.ftb-tool-case-converter .ftb-cc-picker{display:grid;gap:var(--ftb-space-4);
	margin-bottom:var(--ftb-space-5)}
@media (min-width:768px){
	.ftb-tool-case-converter .ftb-cc-picker{grid-template-columns:1fr 1fr;
		gap:var(--ftb-space-6)}
}

.ftb-tool-case-converter .ftb-cc-grouplab{display:block;
	font-size:var(--ftb-text-xs);font-weight:var(--ftb-fw-bold);
	text-transform:uppercase;letter-spacing:.06em;
	color:var(--ftb-text-muted);margin-bottom:var(--ftb-space-2)}

.ftb-tool-case-converter .ftb-cc-buttons{display:flex;flex-wrap:wrap;
	gap:var(--ftb-space-2)}

.ftb-tool-case-converter .ftb-cc-case{
	/* Touch target ≥24px is the WCAG 2.2 floor; 40px is the comfortable one. */
	min-height:40px;padding:var(--ftb-space-2) var(--ftb-space-4);
	font-size:var(--ftb-text-sm);font-weight:var(--ftb-fw-semi);
	font-family:inherit;line-height:1.2;
	color:var(--ftb-text);background:var(--ftb-bg);
	border:1px solid var(--ftb-border-strong);border-radius:var(--ftb-radius);
	cursor:pointer}
.ftb-tool-case-converter .ftb-cc-case--mono{font-family:var(--ftb-mono);
	font-size:var(--ftb-text-xs)}
.ftb-tool-case-converter .ftb-cc-case:hover{background:var(--ftb-surface);
	border-color:var(--ftb-primary)}
.ftb-tool-case-converter .ftb-cc-case:focus-visible{outline:2px solid var(--ftb-primary);
	outline-offset:2px}
/* The selected case is marked by fill AND by aria-pressed, not colour alone. */
.ftb-tool-case-converter .ftb-cc-case[aria-pressed="true"]{
	background:var(--ftb-primary);color:var(--ftb-on-primary);
	border-color:var(--ftb-primary)}

@media (prefers-reduced-motion:no-preference){
	.ftb-tool-case-converter .ftb-cc-case{transition:background-color .12s ease,
		border-color .12s ease}
}