.wpcm-mobile-submit {
	background: #f8fafc;
	color: #111827;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	margin: 0 auto;
	max-width: 680px;
	min-height: 100vh;
	padding: 18px 14px 32px;
}

.wpcm-mobile-submit *,
.wpcm-mobile-submit *::before,
.wpcm-mobile-submit *::after {
	box-sizing: border-box;
}

.wpcm-mobile-submit [hidden] {
	display: none !important;
}

.wpcm-mobile-submit__header {
	padding: 10px 2px 16px;
}

.wpcm-mobile-submit__eyebrow {
	color: #0f766e;
	font-size: 13px;
	font-weight: 700;
	margin: 0 0 4px;
	text-transform: uppercase;
}

.wpcm-mobile-submit h1,
.wpcm-mobile-submit h2 {
	color: #111827;
	letter-spacing: 0;
	margin: 0;
}

.wpcm-mobile-submit h1 {
	font-size: 30px;
	line-height: 1.1;
}

.wpcm-mobile-submit h2 {
	font-size: 19px;
	line-height: 1.25;
	margin-bottom: 14px;
}

.wpcm-mobile-submit__panel {
	background: #ffffff;
	border: 1px solid #d7dee8;
	border-radius: 8px;
	box-shadow: 0 10px 30px rgba(17, 24, 39, 0.08);
	padding: 16px;
}

.wpcm-mobile-submit__notice {
	background: #eef6ff;
	border-left: 4px solid #2563eb;
	border-radius: 6px;
	color: #1e3a8a;
	display: none;
	font-size: 14px;
	margin: 0 0 14px;
	padding: 10px 12px;
}

.wpcm-mobile-submit__notice.is-visible {
	display: block;
}

.wpcm-mobile-submit__notice.is-error {
	background: #fef2f2;
	border-left-color: #dc2626;
	color: #991b1b;
}

.wpcm-mobile-submit__notice.is-success {
	background: #ecfdf5;
	border-left-color: #059669;
	color: #065f46;
}

.wpcm-mobile-submit__progress {
	align-items: center;
	background: #e2e8f0;
	border-radius: 999px;
	display: flex;
	gap: 10px;
	margin: 0 0 16px;
	overflow: hidden;
	padding-right: 10px;
}

.wpcm-mobile-submit__progress-bar {
	background: #0f766e;
	height: 12px;
	min-width: 0;
	transition: width 150ms ease;
	width: 0;
}

.wpcm-mobile-submit__progress span {
	color: #334155;
	font-size: 12px;
	font-weight: 800;
	min-width: 36px;
	text-align: right;
}

.wpcm-mobile-submit__section {
	margin-bottom: 14px;
}

.wpcm-mobile-submit label {
	color: #334155;
	display: block;
	font-size: 13px;
	font-weight: 700;
	margin: 14px 0 6px;
}

.wpcm-mobile-submit input,
.wpcm-mobile-submit select,
.wpcm-mobile-submit textarea {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 7px;
	color: #111827;
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}

.wpcm-mobile-submit textarea {
	min-height: 96px;
	resize: vertical;
}

.wpcm-mobile-submit input.is-invalid,
.wpcm-mobile-submit select.is-invalid,
.wpcm-mobile-submit textarea.is-invalid {
	border-color: #dc2626;
	box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.12);
}

.wpcm-mobile-submit__scanner {
	aspect-ratio: 4 / 3;
	background: #0f172a;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
}

.wpcm-mobile-submit__scanner video {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.wpcm-mobile-submit__scan-line {
	border: 2px solid rgba(20, 184, 166, 0.92);
	border-radius: 8px;
	height: 32%;
	left: 8%;
	position: absolute;
	right: 8%;
	top: 34%;
}

.wpcm-mobile-submit__scanner.is-scanning .wpcm-mobile-submit__scan-line {
	animation: wpcm-mobile-scan-pulse 1.2s ease-in-out infinite;
}

.wpcm-mobile-submit__scanner.is-rejected .wpcm-mobile-submit__scan-line {
	border-color: #f59e0b;
	box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.22);
}

.wpcm-mobile-submit__scanner.is-accepted .wpcm-mobile-submit__scan-line {
	border-color: #10b981;
	box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.25);
}

.wpcm-mobile-submit__scanner.is-text-mode .wpcm-mobile-submit__scan-line {
	border-style: dashed;
	height: 18%;
	left: 5%;
	right: 5%;
	top: 41%;
}

.wpcm-mobile-submit__scan-status {
	background: rgba(15, 23, 42, 0.88);
	border-radius: 999px;
	bottom: 12px;
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	left: 12px;
	padding: 6px 10px;
	position: absolute;
}

.wpcm-mobile-submit__debug {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 7px;
	margin-top: 14px;
	padding: 12px;
}

.wpcm-mobile-submit__debug h3 {
	color: #111827;
	font-size: 14px;
	letter-spacing: 0;
	margin: 0 0 10px;
}

.wpcm-mobile-submit__debug dl {
	display: grid;
	gap: 8px;
	margin: 0;
}

.wpcm-mobile-submit__debug dl div {
	display: grid;
	gap: 8px;
	grid-template-columns: 94px minmax(0, 1fr);
}

.wpcm-mobile-submit__debug dt {
	color: #475569;
	font-size: 12px;
	font-weight: 700;
}

.wpcm-mobile-submit__debug dd {
	color: #111827;
	font-size: 12px;
	margin: 0;
	overflow-wrap: anywhere;
}

@keyframes wpcm-mobile-scan-pulse {
	0%,
	100% {
		opacity: 0.65;
	}

	50% {
		opacity: 1;
	}
}

.wpcm-mobile-submit__actions,
.wpcm-mobile-submit__vin-row,
.wpcm-mobile-submit__finish-actions {
	display: flex;
	gap: 10px;
}

.wpcm-mobile-submit__actions {
	flex-wrap: wrap;
	margin-top: 12px;
}

.wpcm-mobile-submit__actions .wpcm-mobile-submit__button {
	flex: 1 1 calc(50% - 5px);
}

.wpcm-mobile-submit__actions [data-wpcm-stop-scan] {
	flex-basis: 100%;
}

.wpcm-mobile-submit__capture-text,
.wpcm-mobile-submit__photo-scan {
	margin-top: 10px;
	width: 100%;
}

.wpcm-mobile-submit input.wpcm-mobile-submit__hidden-input {
	display: none;
}

.wpcm-mobile-submit__vin-row input {
	flex: 1;
	min-width: 0;
	text-transform: uppercase;
}

.wpcm-mobile-submit__button {
	align-items: center;
	background: #ffffff;
	border: 1px solid #94a3b8;
	border-radius: 7px;
	color: #111827;
	cursor: pointer;
	display: inline-flex;
	font-size: 15px;
	font-weight: 800;
	justify-content: center;
	min-height: 44px;
	padding: 10px 14px;
	text-decoration: none;
}

.wpcm-mobile-submit__button--primary {
	background: #0f766e;
	border-color: #0f766e;
	color: #ffffff;
}

.wpcm-mobile-submit__button[disabled] {
	cursor: wait;
	opacity: 0.65;
}

.wpcm-mobile-submit__grid {
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr;
}

.wpcm-mobile-submit__summary {
	background: #f1f5f9;
	border-radius: 7px;
	color: #334155;
	font-size: 14px;
	margin-bottom: 14px;
	padding: 12px;
}

.wpcm-mobile-submit__photos {
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(3, 1fr);
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
}

.wpcm-mobile-submit__photos li {
	aspect-ratio: 1;
	background: #e2e8f0;
	border-radius: 7px;
	overflow: hidden;
	position: relative;
}

.wpcm-mobile-submit__photos img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.wpcm-mobile-submit__photos button {
	align-items: center;
	background: rgba(17, 24, 39, 0.86);
	border: 0;
	border-radius: 999px;
	color: #ffffff;
	display: flex;
	font-size: 14px;
	font-weight: 800;
	height: 28px;
	justify-content: center;
	min-height: 0;
	padding: 0;
	position: absolute;
	right: 6px;
	top: 6px;
	width: 28px;
}

.wpcm-mobile-submit__finish-actions .wpcm-mobile-submit__button {
	flex: 1;
}

@media (min-width: 560px) {
	.wpcm-mobile-submit {
		padding-inline: 20px;
	}

	.wpcm-mobile-submit__grid {
		grid-template-columns: 1fr 1fr;
	}

}