/**
 * auth.css — Formulare des Mitgliederbereichs (Plugin ndb-core).
 *
 * ── Wer lädt diese Datei ────────────────────────────────────────────────────
 * Das Plugin, nicht das Theme: ndb_auth_register_styles() registriert sie
 * unter dem Handle `ndb-auth` (Abhängigkeit `ndb-components`, inc/ndb-core.php)
 * und reiht sie ein, sobald ein Auth-Shortcode rendert. Auf den vier Seiten
 * des Mitgliederbereichs zieht inc/ndb-auth.php das Einreihen in den <head>
 * vor. Fehlt die Datei, registriert das Plugin STILL nichts.
 *
 * ── Was hier steht ──────────────────────────────────────────────────────────
 * Der Honigtopf (Funktion), die D15-Felder aus Figma (Anmelden 126:6200,
 * Registrieren 137:6632) und der Reiter-Umschalter. Seit Paket L gelten die
 * Feldregeln auf ALLEN vier Seiten (`.nebi-auth-page`, gesetzt von
 * template-parts/auth-page.php) — Passwort und Profil haben keinen eigenen
 * Figma-Rahmen und übernehmen deshalb die Felder von Anmelden. Die Knöpfe
 * kommen aus buttons.css (`.btn--primary` = Figma Primary); hier steht nur der
 * Pfeil, den D15 am Absenden zeigt.
 */

/*
 * Honigtopf. Die EINZIGE Regel, die ihn versteckt: ohne sie sieht ein Mensch
 * das Feld „Dieses Feld bitte leer lassen" — und wer es ausfüllt, wird vom
 * Plugin als Bot behandelt (Registrierung scheinbar erfolgreich, kein Konto).
 * Nie display:none — manche Bots überspringen genau solche Felder. Das Markup
 * (`inert`, `aria-hidden`, tabindex -1) nimmt es zusätzlich aus Fokus und
 * Vorlesereihenfolge.
 */
.ndb-auth-hp {
	position: absolute;
	inset-inline-start: -9999px;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
}

/* ── D15-Felder: alle Seiten des Mitgliederbereichs ──────────────────────
 * Bis Paket L hingen diese Regeln an `.nebi-auth-page--split` — Passwort und
 * Profil zeigten deshalb Basisfelder und den lila Basisknopf. Erweitert wurde
 * der Selektor, nicht kopiert.
 */
.nebi-auth-page .ndb-auth,
.nebi-auth-page .ndb-auth__form {
	inline-size: 100%;
}

.nebi-auth-page .ndb-auth__form {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
}

.nebi-auth-page .ndb-auth__field {
	display: flex;
	flex-direction: column;
	gap: 16px;
	inline-size: 100%;
	margin: 0;
}

.nebi-auth-page .ndb-auth__label {
	display: block;
	font-size: 18px;
	font-weight: 600;
	line-height: 24px;
}

.nebi-auth-page .ndb-auth__input {
	min-block-size: 56px;
	padding: 15px 20px;
	border: 1px solid var(--border-strong);
	border-radius: 0;
	background: var(--surface-base);
	color: var(--text-primary);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 18px;
	font-weight: 600;
	line-height: 24px;
}

.nebi-auth-page .ndb-auth__input::placeholder {
	color: var(--text-muted);
	opacity: 1;
}

.nebi-auth-page .ndb-auth__hint {
	margin: 0;
	color: var(--text-primary);
	font-size: 18px;
	line-height: 24px;
}

.nebi-auth-page .ndb-auth__field--check {
	display: block;
}

.nebi-auth-page .ndb-auth__check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 18px;
	line-height: 24px;
	cursor: pointer;
}

.nebi-auth-page .ndb-auth__check input[type="checkbox"] {
	appearance: none;
	flex: 0 0 24px;
	inline-size: 24px;
	block-size: 24px;
	margin: 0;
	border: 1px solid var(--border-strong);
	border-radius: 0;
	background: var(--surface-base);
}

.nebi-auth-page .ndb-auth__check input[type="checkbox"]:checked {
	background-color: var(--surface-base);
	background-image: url(../../figma/d15-check.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 20px;
}

.nebi-auth-page .ndb-auth__check input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--focus-ring);
	outline-offset: 2px;
}

.nebi-auth-page .ndb-auth__check a,
.nebi-auth-page .ndb-auth__alt a {
	color: var(--text-link);
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 600;
	text-decoration: none;
}

.nebi-auth-page .ndb-auth__check a:hover,
.nebi-auth-page .ndb-auth__alt a:hover {
	text-decoration: underline;
}

/* Absenden = `.btn--primary` (buttons.css). Hier nur der D15-Pfeil als
   Figma-End-Icon; currentcolor, damit er der Knopfschrift folgt. */
.nebi-auth-page .ndb-auth__submit::after {
	flex: none;
	inline-size: var(--button-icon-size);
	block-size: var(--button-icon-size);
	background: currentcolor;
	content: "";
	-webkit-mask: url(../../icons/arrow-right.svg) center / contain no-repeat;
	mask: url(../../icons/arrow-right.svg) center / contain no-repeat;
}

/* Dachzeile, Titel und Einleitung: D15 (Split) und der Profilkopf. */
.nebi-auth-intro__overline {
	margin: 0 0 80px;
	color: var(--text-brand);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 23px;
	font-weight: 600;
	line-height: 32px;
	text-transform: uppercase;
}

.nebi-auth-intro__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 48px;
}

.nebi-auth-intro__title {
	margin: 0;
	font-size: 55px;
	font-weight: 300;
	line-height: 66px;
}

.nebi-auth-intro__lead {
	margin: 0;
	font-size: 18px;
	line-height: 24px;
}

/* ── Profil (ohne Figma-Rahmen) ────────────────────────────────────────────
 * Abgeleitet aus Anmelden und Kontakt: Kopf wie die D15-Einleitung, darunter
 * die Reiter wie „Anmelden | Registrieren", die Merkliste als Katalograster
 * (card.css), Aktivität als gerahmte Liste wie die Kontaktkarten.
 */
.nebi-auth-page--profile {
	background: var(--surface-base);
}

.nebi-member-head {
	padding-block: 120px 80px;
}

.nebi-member-head .nebi-auth-intro__content {
	gap: 24px;
}

.nebi-member-body {
	padding-block-end: 120px;
}

/* Redaktioneller Inhalt bleibt im begrenzten Fluss (page.php); Kopf und
   Profil nehmen die breite Spalte wie der Katalog — dieselbe Kante. */
.nebi-member-head > *,
.nebi-member-body > .ndb-profile {
	max-inline-size: var(--wide-width);
}

.nebi-auth-page .ndb-auth__form + .ndb-auth__alt {
	margin-block-start: 24px;
}

.ndb-profile__tabs {
	margin-block-end: 48px;
}

.ndb-profile__group + .ndb-profile__group,
.ndb-account-settings + .ndb-account-settings,
.ndb-account-settings + .ndb-account-danger {
	margin-block-start: 80px;
}

.ndb-profile__group-title,
.ndb-account-settings__title,
.ndb-account-danger__title,
.ndb-profile__empty-title {
	margin: 0 0 24px;
	font-size: 27px;
	font-weight: 400;
	line-height: 32px;
}

.ndb-account-settings,
.ndb-account-danger {
	max-inline-size: var(--reading-width);
}

.ndb-account-settings__hint,
.ndb-account-danger__text {
	margin: 0 0 40px;
	font-size: 18px;
	line-height: 24px;
}

.ndb-account-form,
.ndb-account-delete-form {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
}

/* Aktivität: gerahmte Liste wie die Kontaktkarten (contact.css) — ein Rand
   je geteilter Kante. */
.ndb-activity {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ndb-activity__item {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 24px;
	border: 1px solid var(--border-strong);
}

.ndb-activity__item + .ndb-activity__item {
	border-block-start: 0;
}

.ndb-activity__link {
	display: flex;
	flex: 1 1 320px;
	flex-direction: column;
	gap: 8px;
	color: var(--text-primary);
	text-decoration: none;
}

.ndb-activity__head {
	font-size: 18px;
	font-weight: 600;
	line-height: 24px;
}

.ndb-activity__on {
	font-weight: 400;
}

.ndb-activity__date {
	display: block;
	color: var(--text-muted);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 16px;
	font-weight: 600;
	line-height: 22px;
}

.ndb-activity__text {
	font-size: 18px;
	line-height: 24px;
}

.ndb-activity__link:hover .ndb-activity__text {
	text-decoration: underline;
}

/* Löschen/Anonymisieren = Figma Text Button (Size S), kein Absende-Primary. */
.ndb-activity .ndb-activity__delete {
	display: inline-flex;
	align-items: center;
	gap: var(--button-gap-sm);
	min-block-size: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--text-link);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--button-font-size-sm);
	font-weight: 600;
	line-height: var(--button-line-height-sm);
	text-decoration: underline;
	cursor: pointer;
}

.ndb-activity .ndb-activity__delete:hover {
	color: var(--text-link-hover);
}

.ndb-activity__empty,
.ndb-profile__empty-text,
.ndb-profile--guest p {
	margin: 0;
	font-size: 18px;
	line-height: 24px;
}

.ndb-profile__empty {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	padding: 24px;
	border: 1px solid var(--border-strong);
}

.ndb-profile__empty-title {
	margin: 0;
}

.ndb-profile--guest {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
}

/* Reiter: „Anmelden | Registrieren" (D15) und die Profil-Reiter teilen
   Leiste und Reiter. Die Lage der D15-Leiste über dem Split steht in
   auth-split.css; diese Datei lädt auf allen vier Seiten. */
.ndb-auth-tabs__list,
.nebi-auth-switcher,
.ndb-profile__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	padding-block-end: 40px;
	border-block-end: 1px solid var(--border-strong);
}

.ndb-auth-tabs__tab,
.nebi-auth-switcher a,
.ndb-profile__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-block-size: 40px;
	padding: 7px 12px;
	border: 1px solid transparent;
	background: transparent;
	color: var(--text-primary);
	font-family: var(--wp--preset--font-family--sans);
	font-size: 18px;
	font-weight: 600;
	line-height: 24px;
	text-decoration: none;
	cursor: pointer;
}

.ndb-auth-tabs__tab[aria-selected="true"],
.nebi-auth-switcher a.is-active,
.ndb-profile__tab[aria-selected="true"] {
	border-color: var(--wp--preset--color--brand-strong);
	color: var(--wp--preset--color--brand-strong);
	text-decoration: none;
}

.nebi-auth-page .ndb-auth__alt {
	margin: 0;
	font-size: 18px;
	line-height: 24px;
}

.nebi-auth-page .ndb-auth--login {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	align-items: center;
	gap: 40px;
}

.nebi-auth-page .ndb-auth--login .ndb-auth__form {
	display: contents;
}

.nebi-auth-page .ndb-auth--login .ndb-auth__field {
	grid-column: 1 / -1;
}

.nebi-auth-page .ndb-auth--login .ndb-auth__alt {
	grid-column: 2;
}

.nebi-auth-page .ndb-auth-notice {
	margin-block-end: 40px;
	padding: 20px;
	border: 1px solid var(--border-strong);
	background: var(--surface-base);
	font-size: 18px;
	line-height: 24px;
}

.nebi-auth-page .ndb-auth-notice--error {
	border-inline-start: 4px solid var(--state-error);
}

.nebi-auth-page .ndb-auth-notice--success {
	border-inline-start: 4px solid var(--state-success);
}

.nebi-auth-page .ndb-auth-errors {
	margin: 0;
	padding-inline-start: 24px;
}

.nebi-auth-page .ndb-auth--resend {
	margin-block: 0 40px;
	padding-block-end: 40px;
	border-block-end: 1px solid var(--border-strong);
}

.nebi-auth-page .ndb-auth__resend-title {
	margin-block: 0 24px;
	font-size: 27px;
	line-height: 32px;
}

.nebi-auth-page .ndb-auth--resend > .ndb-auth__hint {
	margin-block-end: 40px;
}

@media (width >= 1024px) {

	.nebi-auth-page--login .ndb-auth--login .ndb-auth__label:has(+ .ndb-auth__input[required])::after {
		content: " *";
		color: var(--fill-accent);
	}
}

@media (width < 1024px) {

	.nebi-auth-page .ndb-auth__hint,
	.nebi-auth-page .ndb-auth__check,
	.nebi-auth-page .ndb-auth__alt,
	.nebi-auth-page .ndb-auth-notice {
		font-size: 16px;
		line-height: 22px;
	}

	.nebi-auth-page .ndb-auth--login {
		grid-template-columns: minmax(0, 1fr);
	}

	.nebi-auth-page .ndb-auth--login .ndb-auth__submit,
	.nebi-auth-page .ndb-auth--login .ndb-auth__alt {
		grid-column: 1;
		justify-self: start;
	}

	.ndb-auth-tabs__list,
	.nebi-auth-switcher,
	.ndb-profile__tabs {
		padding-block-end: 24px;
	}

	.nebi-auth-intro__overline {
		margin-block-end: 48px;
		font-size: 18px;
		line-height: 24px;
	}

	.nebi-auth-intro__content {
		gap: 32px;
	}

	.nebi-auth-intro__title {
		font-size: 27px;
		line-height: 32px;
	}

	.nebi-auth-intro__lead,
	.ndb-account-settings__hint,
	.ndb-account-danger__text,
	.ndb-activity__head,
	.ndb-activity__text,
	.ndb-activity__empty,
	.ndb-profile__empty-text,
	.ndb-profile--guest p {
		font-size: 16px;
		line-height: 22px;
	}

	.nebi-member-head {
		padding-block: 80px 48px;
	}

	.nebi-member-body {
		padding-block-end: 100px;
	}

	.ndb-profile__group + .ndb-profile__group,
	.ndb-account-settings + .ndb-account-settings,
	.ndb-account-settings + .ndb-account-danger {
		margin-block-start: 48px;
	}

	.ndb-profile__group-title,
	.ndb-account-settings__title,
	.ndb-account-danger__title,
	.ndb-profile__empty-title {
		font-size: 22px;
		line-height: 26px;
	}

	.ndb-activity__item {
		padding: 16px;
	}
}