﻿.cm-input {
	position: relative;
	display: flex;
	align-items: center;
}

	.cm-input > label {
		position: absolute;
		background-color: white;
		color: var(--neutral-20);
		font-style: italic;
		left: 0.75rem;
		padding: 0 0.25rem;
		transition: all 0.1s ease;
		height: 1rem;
		line-height: 1rem;
		pointer-events: none;
	}

	.cm-input > input {
		width: 100%;
	}

		.cm-input > input:not(:placeholder-shown),
		.cm-input > input:is(:focus) {
		}

			.cm-input > input:not(:placeholder-shown) + label,
			.cm-input > input:is(:focus) + label {
				transform: translateY(calc(((-1 * 1rem) - 50%) - 3px));
				font-size: 0.75rem;
				font-style: normal;
			}

		.cm-input > input::placeholder {
			color: transparent;
		}
