/* Cerium Forms — frontend base. Structure only; looks come from the Style tab or your Custom CSS. */

.cerium-form { margin: 0 0 1.5em; }

.cerium-form .cf-col { min-width: 0; }

/* Field widths — twelve tracks per column. */
.cerium-form .cf-field { grid-column: span 12; min-width: 0; }
.cerium-form .cf-span-3 { grid-column: span 3; }
.cerium-form .cf-span-4 { grid-column: span 4; }
.cerium-form .cf-span-6 { grid-column: span 6; }
.cerium-form .cf-span-8 { grid-column: span 8; }
.cerium-form .cf-span-12 { grid-column: span 12; }

.cerium-form .cf-field { margin: 0; }

.cerium-form .cf-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.cerium-form .cf-req { color: #b32d2e; }

.cerium-form .cf-error {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: #b32d2e;
}

.cerium-form .cf-has-error .cf-input { border-color: #b32d2e; }

.cerium-form .cf-message {
	display: none;
	padding: 12px 14px;
	margin-bottom: 14px;
	border-left: 4px solid;
	border-radius: 3px;
}

.cerium-form .cf-message.is-visible { display: block; }
.cerium-form .cf-message-success { background: #edf7ed; border-color: #46834a; }
.cerium-form .cf-message-error { background: #fdecec; border-color: #b32d2e; }

.cerium-form .cf-actions { margin-top: 6px; }

.cerium-form .cf-spinner {
	display: none;
	width: 16px;
	height: 16px;
	margin-left: 10px;
	vertical-align: middle;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: cf-spin .7s linear infinite;
}

.cerium-form.is-sending .cf-spinner { display: inline-block; }
.cerium-form.is-sending .cf-submit { opacity: .7; pointer-events: none; }

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

@media (prefers-reduced-motion: reduce) {
	.cerium-form .cf-spinner { animation-duration: 3s; }
}

.cerium-form .cf-spacer { min-height: 1px; }

/* My Account list */

.cf-account-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 16px;
}

.cf-account-table th,
.cf-account-table td {
	padding: 10px 12px;
	border-bottom: 1px solid #e3e3e3;
	text-align: left;
	vertical-align: top;
}

.cf-account-table thead th { font-weight: 600; }

.cf-account-detail th { width: 32%; }

.cf-account-pager { display: flex; gap: 8px; }
.cf-account-pager .cf-page.is-current { font-weight: 700; }

.cf-account-date { opacity: .7; margin-top: -8px; }

.cf-notice { padding: 12px 14px; background: #f4f4f4; border-left: 4px solid #999; }
.cf-notice-error { background: #fdecec; border-color: #b32d2e; }

/* PDF links */

.cerium-form .cf-pdf-link { display: inline-block; margin-left: 6px; }

.cf-account-pdf { margin-left: 10px; }

.cf-account-pdf-button {
	display: inline-block;
	margin-left: 0;
	padding: 8px 16px;
	border: 1px solid currentColor;
	border-radius: 3px;
	text-decoration: none;
}

/* Name field */

.cerium-form .cf-name-part { display: block; }
.cerium-form .cf-name-part .cf-input { width: 100%; }
.cerium-form .cf-sub-label { display: block; }

/* Submissions cards */

.cf-account-cards { margin-bottom: 20px; }

.cf-card {
	display: block;
	text-decoration: none;
	color: inherit;
	min-width: 0;
}

.cf-card-form {
	display: block;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 2px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cf-card-date {
	display: block;
	font-size: 13px;
	opacity: .7;
	margin-bottom: 8px;
}

.cf-card-thumb {
	display: block;
	border: 1px solid #e0e0e0;
	border-radius: 3px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .07);
	transition: box-shadow .15s ease, transform .15s ease;
}

.cf-card-thumb img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1.414;
	object-fit: cover;
	object-position: top center;
}

.cf-card:hover .cf-card-thumb,
.cf-card:focus-visible .cf-card-thumb {
	box-shadow: 0 4px 14px rgba(0, 0, 0, .14);
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.cf-card-thumb { transition: none; }
	.cf-card:hover .cf-card-thumb { transform: none; }
}