/*
 * Neotron — front-end styles for plugin-owned screens.
 *
 * Only the forms and notices the plugin renders. Everything about the catalogue's
 * appearance belongs to the child theme; this file exists so the account screens are
 * presentable even if the theme is swapped.
 *
 * Colours are read from the theme's custom properties where they exist, with the printed
 * catalogue's palette as the fallback, so the plugin follows the theme rather than
 * fighting it.
 */

.neotron-register,
.neotron-review {
	--neotron-ground: var(--wp--preset--color--base, #FCFAF6);
	--neotron-ink: var(--wp--preset--color--contrast, #2C231A);
	--neotron-brass: var(--wp--preset--color--accent, #9A7B3F);
	--neotron-line: var(--wp--preset--color--line, #E3DACB);
	--neotron-surface: var(--wp--preset--color--surface, #F4EFE6);

	max-width: 44rem;
	margin-inline: auto;
	color: var(--neotron-ink);
}

/* ---------------------------------------------------------------- Fieldsets */

.neotron-fieldset {
	margin: 0 0 2.5rem;
	padding: 0;
	border: 0;
	border-top: 1px solid var(--neotron-line);
	padding-top: 1.75rem;
}

.neotron-fieldset__legend {
	padding: 0;
	font-family: var(--wp--preset--font-family--serif, Georgia, serif);
	font-size: 1.3rem;
	letter-spacing: 0.01em;
}

.neotron-fieldset__intro {
	margin: 0.35rem 0 1.5rem;
	color: color-mix(in srgb, var(--neotron-ink) 65%, transparent);
	font-size: 0.95rem;
}

/* ---------------------------------------------------------------- Fields */

.neotron-field {
	margin: 0 0 1.25rem;
}

.neotron-field label {
	display: block;
	margin-bottom: 0.4rem;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.neotron-field .required {
	color: var(--neotron-brass);
	text-decoration: none;
}

.neotron-input {
	width: 100%;
	padding: 0.7rem 0.85rem;
	border: 1px solid var(--neotron-line);
	border-radius: 0;
	background: #fff;
	color: inherit;
	font: inherit;
	transition: border-color 120ms ease, box-shadow 120ms ease;
}

.neotron-input:focus {
	border-color: var(--neotron-brass);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--neotron-brass) 18%, transparent);
	outline: none;
}

.neotron-field__hint {
	display: block;
	margin-top: 0.35rem;
	color: color-mix(in srgb, var(--neotron-ink) 60%, transparent);
	font-size: 0.85rem;
}

/* Postcode and city sit side by side from tablet up. Mobile-first, so this is the
   addition rather than the exception. */
@media (min-width: 40em) {
	.neotron-fieldset--delivery {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 1.25rem;
	}

	.neotron-fieldset--delivery > .neotron-fieldset__legend,
	.neotron-fieldset--delivery > .neotron-fieldset__intro,
	.neotron-fieldset--delivery > .neotron-field:not(.neotron-field--half) {
		grid-column: 1 / -1;
	}
}

/* ---------------------------------------------------------------- Actions */

.neotron-button {
	display: inline-block;
	padding: 0.85rem 1.9rem;
	border: 0;
	background: var(--neotron-ink);
	color: var(--neotron-ground);
	font: inherit;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 120ms ease;
}

.neotron-button:hover,
.neotron-button:focus {
	background: var(--neotron-brass);
	color: var(--neotron-ground);
}

.neotron-form__actions {
	margin: 2rem 0 1rem;
}

.neotron-form__note,
.neotron-form__alt {
	color: color-mix(in srgb, var(--neotron-ink) 65%, transparent);
	font-size: 0.9rem;
}

.neotron-form__privacy {
	padding: 1rem 1.15rem;
	background: var(--neotron-surface);
	font-size: 0.88rem;
}

/* ---------------------------------------------------------------- Notices */

.neotron-notice {
	margin: 0 0 2rem;
	padding: 1rem 1.25rem;
	border-left: 3px solid var(--neotron-brass);
	background: var(--neotron-surface);
	font-size: 0.95rem;
}

.neotron-notice--success {
	border-left-color: #1e6b2b;
}

/* ---------------------------------------------------------------- Review screen */

.neotron-review__lead {
	font-family: var(--wp--preset--font-family--serif, Georgia, serif);
	font-size: 1.45rem;
	line-height: 1.4;
}

.neotron-review__reason {
	margin: 2rem 0;
	padding: 1.25rem 1.5rem;
	border-left: 3px solid var(--neotron-brass);
	background: var(--neotron-surface);
}

.neotron-review__reason h2 {
	margin-top: 0;
	font-size: 1rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.neotron-review__links {
	margin: 0 0 2.5rem;
	padding: 0;
	list-style: none;
}

.neotron-review__links li + li {
	margin-top: 0.4rem;
}

.neotron-review__signout {
	padding-top: 1.5rem;
	border-top: 1px solid var(--neotron-line);
	font-size: 0.9rem;
}

/* ---------------------------------------------------------------- Honeypot */

.neotron-honeypot {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}