/* Recorte de imagem (avatar/banner) antes do upload — arrastar para
   posicionar, slider para zoom, confirmar para gravar já recortada. */

#ksp-cropper-overlay {
	display: none;
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.75);
	z-index: 10000;
	align-items: center;
	justify-content: center;
	padding: 16px;
	box-sizing: border-box;
}
#ksp-cropper-overlay.show {
	display: flex;
}
.ksp-cropper-box {
	width: 100%;
	max-width: 480px;
	background: var(--ksp-bg-elevated, #fff);
	border-radius: 16px;
	padding: 18px;
	box-sizing: border-box;
}
.ksp-cropper-box h3 {
	margin: 0 0 12px;
	font-size: 0.95rem;
	color: var(--ksp-text);
}
.ksp-cropper-viewport {
	position: relative;
	width: 100%;
	overflow: hidden;
	background: #111;
	border-radius: 10px;
	cursor: grab;
	touch-action: none;
	user-select: none;
}
.ksp-cropper-viewport.dragging {
	cursor: grabbing;
}
.ksp-cropper-viewport--avatar {
	aspect-ratio: 1 / 1;
	max-width: 280px;
	margin: 0 auto;
	border-radius: 50%;
}
.ksp-cropper-viewport--banner {
	aspect-ratio: 3 / 1;
}
.ksp-cropper-img {
	position: absolute;
	top: 0;
	left: 0;
	transform-origin: top left;
	pointer-events: none;
	max-width: none;
}
.ksp-cropper-zoom {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	font-size: 0.8rem;
	color: var(--ksp-text);
}
.ksp-cropper-zoom input[type="range"] {
	flex: 1;
}
.ksp-cropper-actions {
	display: flex;
	gap: 10px;
	margin-top: 16px;
}
.ksp-cropper-actions button {
	flex: 1;
	padding: 10px;
	border-radius: 10px;
	border: none;
	font-weight: 700;
	font-size: 0.85rem;
	cursor: pointer;
}
.ksp-cropper-actions .ksp-cropper-cancel {
	background: rgba(127, 127, 127, 0.2);
	color: var(--ksp-text);
}
.ksp-cropper-actions .ksp-cropper-confirm {
	background: var(--wp--preset--color--accent-1, #3D9BE9);
	color: #fff;
}

.ksp-crop-preview {
	display: block;
	margin-top: 8px;
	border-radius: 8px;
	max-width: 160px;
	max-height: 90px;
}
.ksp-crop-preview--avatar {
	max-width: 80px;
	max-height: 80px;
	border-radius: 50%;
}