/*
 * Custom styles for the [scr_inscription] public registration form,
 * layered on top of the vendored Bootstrap 5 stylesheet.
 */

.scr-reg-form-wrapper {
	max-width: 980px;
	margin: 0 auto;
}

/* Required-field marker appended to labels/legends (see
 * SCR_Reg_Form_Fields::required_mark()). */
.scr-reg-required {
	color: #dc3545;
	margin-left: 0.15em;
	font-weight: 700;
}

/* Honeypot: off-screen for real visitors, still a normal DOM field for
 * simple bots that fill in every input they find without checking layout. */
.scr-reg-honeypot {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

.scr-reg-dropzone {
	border: 2px dashed #adb5bd;
	border-radius: 0.375rem;
	padding: 1.5rem;
	text-align: center;
	cursor: pointer;
}

.scr-reg-dropzone-active {
	border-color: #0d6efd;
	background-color: rgba(13, 110, 253, 0.05);
}

.scr-reg-photo-preview {
	max-width: 100%;
	max-height: 280px;
	border-radius: 0.375rem;
}

.scr-reg-day-card {
	border: 1px solid #dee2e6;
	border-radius: 0.375rem;
	padding: 0.75rem;
}

.scr-reg-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.scr-reg-slot-counter {
	font-weight: 600;
	margin-bottom: 0.75rem;
}

.scr-reg-subcategory-options {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.scr-reg-subcategory-option {
	flex: 1 1 200px;
}

.scr-reg-subcategory-card {
	display: block;
	height: 100%;
	border: 2px solid #dee2e6;
	border-radius: 0.375rem;
	padding: 0.75rem;
	cursor: pointer;
}

.scr-reg-subcategory-input:checked + .scr-reg-subcategory-card {
	border-color: #0d6efd;
	background-color: rgba(13, 110, 253, 0.05);
}

.scr-reg-subcategory-input:focus-visible + .scr-reg-subcategory-card {
	outline: 2px solid #0d6efd;
}

/* Payment step (plan.md §5.4): the registration code highlighted. Its colour
   and border-color are set inline from the configured accent colour. */
.scr-reg-payment-code-value {
	display: inline-block;
	margin-top: 0.25rem;
	padding: 0.5rem 1.5rem;
	border: 2px solid #0d6efd;
	border-radius: 0.5rem;
	font-size: 2rem;
	font-weight: 700;
	letter-spacing: 0.25rem;
	line-height: 1.2;
}

/* "Copy the registration code" button on the payment step. */
.scr-reg-copy-code {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.scr-reg-copy-code .scr-reg-copy-icon {
	display: inline-flex;
}

.scr-reg-copy-code.scr-reg-copied {
	color: #198754;
	border-color: #198754;
}

/* First step: the lone "already a member?" question. While nothing else is on
 * screen yet (scr-reg-adherent-centered, added server-side and removed by
 * public-form.js once the rest of the form is revealed), centre it so a single
 * left-aligned question does not look stranded. */
.scr-reg-adherent-centered {
	text-align: center;
	padding: 1.5rem 0;
}

.scr-reg-adherent-centered .scr-reg-adherent-choices {
	justify-content: center;
}