/* Jootjes Suite — engraving frontend. Lightweight, theme-agnostic. */

.jootjes-engraving {
	--jts-ink: #0C0824;
	--jts-paper: #FAFAFA;
	--jts-accent: #888DFC;
	--jts-line: rgba(12, 8, 36, 0.15);
	margin: 1.25rem 0;
	padding: 1rem;
	border: 1px solid var(--jts-line);
	border-radius: 6px;
	background: var(--jts-paper);
	color: var(--jts-ink);
}

.jootjes-engraving__toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 600;
	cursor: pointer;
}

.jootjes-engraving__panel {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--jts-line);
}

.jootjes-engraving__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin: 0 0 1rem 0;
}

.jootjes-engraving__field input[type='text'] {
	padding: 0.55rem 0.7rem;
	border: 1px solid var(--jts-line);
	border-radius: 4px;
	font: inherit;
}

.jootjes-engraving__fonts {
	border: 0;
	margin: 0;
	padding: 0;
}

.jootjes-engraving__fonts legend {
	font-weight: 600;
	margin-bottom: 0.5rem;
}

.jootjes-engraving__font-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 0.65rem;
}

.jootjes-engraving__font-card {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	padding: 0.6rem;
	border: 1px solid var(--jts-line);
	border-radius: 6px;
	cursor: pointer;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	align-items: center;
	text-align: center;
}

.jootjes-engraving__font-card:hover {
	border-color: var(--jts-accent);
}

.jootjes-engraving__font-card input[type='radio'] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.jootjes-engraving__font-card.is-selected,
.jootjes-engraving__font-card:has(input[type='radio']:checked) {
	border-color: var(--jts-accent);
	box-shadow: 0 0 0 2px rgba(136, 141, 252, 0.35);
}

.jootjes-engraving__font-preview img {
	max-width: 100%;
	height: auto;
	display: block;
}

.jootjes-engraving__font-name {
	font-size: 0.85rem;
	color: rgba(12, 8, 36, 0.7);
}

.jootjes-engraving__error {
	margin-top: 0.75rem;
	color: #b00020;
	font-weight: 600;
}

.jootjes-engraving__notice {
	margin: 0.5rem 0 0 0;
	color: rgba(12, 8, 36, 0.7);
}

.jootjes-engraving-tag {
	font-style: italic;
	font-size: 0.9em;
	color: rgba(12, 8, 36, 0.7);
}

/* Live preview removed (feature reverted). */