/* IT Pro Connect — Form Styles */

.itpc-form-card,
.itpc-newsletter-card {
	border: 1px solid var(--surface-variant-outline);
	border-radius: var(--radius-8);
	background: var(--surface);
	margin-top: 1.5rem;
	overflow: hidden;
}

.itpc-form-header {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.625rem 1rem;
	font-size: var(--label-1);
	font-weight: var(--weight-semiBold);
	color: var(--on-surface);
	background: var(--surface-variant);
	border-bottom: 1px solid var(--surface-variant-outline);
}

.itpc-form-header .material-symbols-rounded {
	font-size: 1.125rem;
	color: var(--on-surface-2);
}

.itpc-form-body {
	padding: 1.25rem 1rem;
}

/* Fields */

.itpc-field {
	margin-bottom: 1rem;
}

.itpc-field label {
	display: block;
	font-size: var(--label-1);
	font-weight: var(--weight-semiBold);
	color: var(--on-background);
	margin-bottom: 0.25rem;
}

.itpc-input,
.itpc-textarea {
	width: 100%;
	padding: 0.5rem 0.75rem;
	font-size: var(--label-1);
	font-family: var(--font-body);
	color: var(--on-background);
	background: var(--color-canvas-default);
	border: 1px solid var(--surface-variant-outline);
	border-radius: var(--radius);
	transition: border-color var(--transition-short), box-shadow var(--transition-short);
	outline: none;
	box-sizing: border-box;
}

.itpc-input:focus,
.itpc-textarea:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--color-accent-muted);
}

.itpc-textarea {
	min-height: 120px;
	resize: vertical;
}

/* Checkbox */

.itpc-checkbox-field label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: var(--weight-regular);
	cursor: pointer;
}

.itpc-checkbox {
	accent-color: var(--primary);
}

/* Submit button */

.itpc-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.625rem 1.5rem;
	font-size: var(--label-1);
	font-weight: var(--weight-semiBold);
	font-family: var(--font-body);
	color: var(--white);
	background: var(--primary);
	border: none;
	border-radius: var(--radius);
	cursor: pointer;
	transition: background var(--transition-short);
}

.itpc-submit:hover {
	background: var(--primary-hover);
}

.itpc-submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* Spinner */

.itpc-spinner {
	display: none;
	width: 1rem;
	height: 1rem;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: var(--white);
	border-radius: 50%;
	animation: itpc-spin 0.6s linear infinite;
}

.itpc-submit.is-loading .itpc-spinner {
	display: inline-block;
}

.itpc-submit.is-loading .itpc-submit-text {
	opacity: 0.7;
}

@keyframes itpc-spin {
	to { transform: rotate(360deg); }
}

/* Status message */

.itpc-form-status {
	margin-top: 1rem;
	padding: 0;
	font-size: var(--label-1);
	border-radius: var(--radius);
	transition: opacity var(--transition-short);
}

.itpc-form-status:empty {
	display: none;
}

.itpc-form-status.is-success {
	padding: 0.75rem 1rem;
	color: var(--color-success-fg);
	border: 1px solid var(--color-success-fg);
}

.itpc-form-status.is-error {
	padding: 0.75rem 1rem;
	color: var(--error);
	border: 1px solid var(--error);
}

/* Newsletter inline */

.itpc-newsletter-desc {
	color: var(--on-surface-2);
	font-size: var(--label-1);
	margin: 0 0 0.75rem;
}

.itpc-newsletter-inline {
	display: flex;
	gap: 0.5rem;
}

.itpc-newsletter-inline .itpc-input {
	flex: 1;
	min-width: 0;
}

/* Honeypot */

.itpc-honeypot {
	position: absolute;
	left: -9999px;
	top: -9999px;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

/* Confirmation page card */

.itpc-confirm-card {
	max-width: 480px;
	margin: 0 auto;
	padding: 2rem;
	border: 1px solid var(--surface-variant-outline);
	border-radius: var(--radius-8);
	background: var(--surface);
}

/* Responsive */

@media (max-width: 480px) {
	.itpc-newsletter-inline {
		flex-direction: column;
	}
}