/* ==========================================================================
   Enformity Anmeldung / Registrierung (login/index.php)
   Aufbau wie app.belegbuddy.com, Farben/Hintergrund wie bisher (gruene Ringe, #1AB394)
   ========================================================================== */
:root {
	--enf-green: #1AB394;
	--enf-green-deep: #008b80;
	--enf-green-dark: #0b6b61;
	--enf-ink: #1f2937;
	--enf-muted: #6b7280;
	--enf-line: #e3e8ee;
	--enf-field: #f4f7f7;
	--enf-radius: 18px;
}

body.enf-auth {
	margin: 0; min-height: 100vh;
	font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color: var(--enf-ink);
	/* konzentrische Ringe mit Zentrum oben rechts, dunkelster Ring innen -> nach aussen heller */
	background:
		radial-gradient(circle at 72% -8%,
			#008b80  0 12%,
			#0d8a76  12% 26%,
			#149b84  26% 40%,
			#1AB394  40% 56%,
			#23c2a3  56% 74%,
			#31c9a9  74% 92%,
			#3fd0b3  92%);
	background-color: #1AB394;
	background-attachment: fixed; background-repeat: no-repeat; background-size: cover;
	display: flex; flex-direction: column;
	-webkit-font-smoothing: antialiased;
}

/* Kopfzeile */
.enf-top { display: flex; align-items: center; justify-content: space-between; max-width: 1180px; width: 100%; margin: 0 auto; padding: 24px 28px 0; }
/* Schriftzug wie auf der Landingpage (enformity.com/site/site.css .brand): Arial fett */
.enf-brand { color: #fff !important; font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 24px; letter-spacing: 0; text-decoration: none !important; }
.enf-brand u { text-underline-offset: 4px; }
.enf-top-right { display: flex; align-items: center; gap: 22px; }
.enf-top-link { color: rgba(255, 255, 255, .85); font-size: 14px; }
.enf-top-link a { font-weight: 400; }

/* Sprachumschalter DE | EN */
.enf-lang { display: flex; align-items: center; gap: 6px; }
.enf-lang a { font-size: 13px; padding: 2px; }
body.enf-auth .enf-lang a.active { color: #fff; font-weight: 700; }
.enf-lang span { color: #fff; opacity: .5; font-size: 13px; }

/* Inhalt: Text links, Box rechts */
.enf-main { flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 72px; padding: 40px 28px 30px; }

.enf-intro { flex: 0 1 470px; color: #fff; }
.enf-intro .enf-kicker { font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; opacity: .85; margin-bottom: 14px; }
.enf-intro h1 { color: #fff; font-weight: 300; font-size: 48px; line-height: 1.08; margin: 0 0 18px; letter-spacing: .3px; }
.enf-intro h1 b { font-weight: 700; }
.enf-intro p { font-size: 16.5px; line-height: 1.6; margin: 0; opacity: .93; color: #fff; }
.enf-points { list-style: none; padding: 0; margin: 24px 0 30px; font-size: 15px; }
.enf-points li { display: flex; align-items: center; gap: 12px; margin: 9px 0; }
.enf-points i { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; background: rgba(255, 255, 255, .2); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; }
.enf-ghost { display: inline-block; color: #fff !important; font-size: 14px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; border: 2px solid rgba(255, 255, 255, .9); border-radius: 2rem; padding: 12px 28px; transition: .2s; text-decoration: none !important; }
.enf-ghost:hover { background: #fff; color: var(--enf-green-deep) !important; }

/* weisse Box */
.enf-card {
	flex: 0 0 460px; background: #fff; border-radius: var(--enf-radius); overflow: hidden;
	box-shadow: 0 40px 80px -24px rgba(0, 50, 45, .55), 0 2px 8px rgba(0, 50, 45, .12);
}
.enf-card--wide { flex-basis: 560px; }
.enf-form { padding: 42px 46px; }
.enf-badge { width: 52px; height: 52px; border-radius: 14px; background: rgba(26, 179, 148, .12); color: var(--enf-green-deep); display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 18px; }
.enf-form h2 { font-size: 28px; font-weight: 700; color: var(--enf-ink); margin: 0 0 6px; }
.enf-form .enf-sub { color: var(--enf-muted); font-size: 15px; line-height: 1.55; margin: 0 0 26px; }

/* Meldungen */
.enf-alert { display: flex; gap: 12px; align-items: flex-start; border-radius: 10px; font-size: 14px; line-height: 1.5; padding: 12px 14px; margin-bottom: 20px; border: 1px solid transparent; }
.enf-alert > i { font-size: 17px; margin-top: 1px; }
.enf-alert a { font-weight: 700; color: inherit; text-decoration: underline; }
.enf-alert form { margin-top: 10px; }
.enf-alert--info    { background: #eef7fd; border-color: #cfe6f8; color: #135a8a; }
.enf-alert--success { background: #e9f8f3; border-color: #bfe9da; color: #0b6b55; }
.enf-alert--warning { background: #fff7e8; border-color: #f6dfae; color: #8a5a00; }
.enf-alert--danger  { background: #fdeeee; border-color: #f5cccc; color: #9b1c1c; }
.enf-alert .enf-btn--small { display: inline-flex; height: auto; width: auto; padding: 7px 14px; font-size: 12.5px; background: #fff; border: 1.5px solid currentColor; color: inherit !important; border-radius: 8px; }

/* Felder */
.enf-form .form-group { margin-bottom: 18px; }
.enf-form .form-label { font-size: 13px; font-weight: 700; color: var(--enf-ink); margin-bottom: 7px; }
.enf-field { position: relative; }
.enf-field > .enf-ico { position: absolute; left: 16px; top: 25px; transform: translateY(-50%); color: #9aa6ad; font-size: 15px; pointer-events: none; z-index: 3; }
.enf-form .form-control {
	height: 50px; border-radius: 10px !important; border: 1.5px solid transparent; background: var(--enf-field);
	font-size: 15px; color: var(--enf-ink); padding: 0 16px; box-shadow: none; transition: border-color .15s, background .15s, box-shadow .15s;
}
.enf-field > .enf-ico ~ .form-control { padding-left: 44px; }
.enf-form select.form-control { padding-right: 32px; }
.enf-form .form-control::placeholder { color: #9aa6ad; }
.enf-form .form-control:focus { background: #fff; border-color: var(--enf-green); box-shadow: 0 0 0 4px rgba(26, 179, 148, .14); }
.enf-form .was-validated .form-control:invalid { border-color: #e5484d; background-image: none; }
.enf-form .was-validated .form-control:valid { border-color: transparent; background-image: none; }
.enf-form input.enf-code { letter-spacing: 8px; font-size: 22px; font-weight: 700; text-align: center; padding-left: 16px !important; }
.enf-pw-toggle { position: absolute; right: 8px; top: 25px; transform: translateY(-50%); z-index: 3; border: 0; background: none; color: var(--enf-green-deep); font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; padding: 8px 10px; cursor: pointer; border-radius: 8px; }
.enf-pw-toggle:hover { background: rgba(26, 179, 148, .1); }
.enf-field > .enf-pw-toggle ~ .form-control { padding-right: 104px; }
.enf-form .help-block { font-size: 12.5px; color: var(--enf-muted); margin-top: 6px; }
.enf-form .invalid-feedback { font-size: 12.5px; }
.enf-form #id_strip .badge { font-size: 11px; padding: 5px 9px; border-radius: 6px; }

/* Checkboxen in Markenfarbe */
.enf-form .custom-control-label { font-size: 14px; color: #4b5563; line-height: 1.5; }
.enf-form .custom-control-label a, .enf-row a, .enf-foot-note a { color: var(--enf-green-deep); font-weight: 700; }
.enf-form .custom-control-input:checked ~ .custom-control-label::before { background-color: var(--enf-green); border-color: var(--enf-green); }
.enf-form .custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 3px rgba(26, 179, 148, .2); }

.enf-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 4px 0 22px; font-size: 14px; }

/* Buttons */
.enf-btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 52px; border-radius: 10px; font-size: 15px; font-weight: 700; letter-spacing: .4px; border: 2px solid transparent; cursor: pointer; transition: .2s; text-decoration: none !important; }
.enf-btn--primary { background: var(--enf-green); color: #fff !important; }
.enf-btn--primary:hover { background: var(--enf-green-deep); }
.enf-btn--primary[disabled] { opacity: .7; cursor: wait; }
.enf-btn--outline { background: #fff; color: var(--enf-ink) !important; border-color: var(--enf-line); }
.enf-btn--outline:hover { border-color: var(--enf-green); color: var(--enf-green-dark) !important; }
.enf-btn img { width: 20px; height: 20px; }
.enf-btn--apple svg { width: 17px; height: 20px; margin-top: -3px; color: #000; }
.enf-btn + .enf-btn { margin-top: 10px; }
.enf-or { display: flex; align-items: center; gap: 14px; color: #9aa6ad; font-size: 12.5px; margin: 20px 0; text-transform: uppercase; letter-spacing: 1px; }
.enf-or::before, .enf-or::after { content: ""; flex: 1; height: 1px; background: var(--enf-line); }
.enf-foot-note { text-align: center; margin-top: 24px; font-size: 14px; color: var(--enf-muted); }

/* Bestaetigungsansicht (E-Mail verschickt) */
.enf-steps { list-style: none; padding: 0; margin: 0 0 24px; counter-reset: s; }
.enf-steps li { position: relative; padding-left: 38px; margin: 0 0 12px; font-size: 14.5px; color: #4b5563; line-height: 1.5; counter-increment: s; }
.enf-steps li::before { content: counter(s); position: absolute; left: 0; top: -1px; width: 26px; height: 26px; border-radius: 50%; background: rgba(26, 179, 148, .12); color: var(--enf-green-deep); font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; }

.enf-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; max-width: 1180px; width: 100%; margin: 0 auto; padding: 10px 28px 22px; font-size: 13px; color: rgba(255, 255, 255, .85); }
/* Alle Text-Links ausserhalb der Box einheitlich: normal, 85 % Weiss, Hover weiss + unterstrichen.
   !important noetig: app.bundle.css unterstreicht Links mit target per "a[target]:not(.btn) { text-decoration: underline !important }" */
body.enf-auth .enf-top-link a, body.enf-auth .enf-lang a, body.enf-auth .enf-footer a { color: rgba(255, 255, 255, .85); font-weight: 400; text-decoration: none !important; transition: color .15s; }
body.enf-auth .enf-top-link a:hover, body.enf-auth .enf-lang a:hover, body.enf-auth .enf-footer a:hover { color: #fff; text-decoration: underline !important; text-underline-offset: 3px; }
.enf-legal { display: flex; flex-wrap: wrap; gap: 6px 20px; }
@media (max-width: 860px) {
	.enf-footer { flex-direction: column; justify-content: center; text-align: center; padding: 10px 16px 22px; }
	.enf-legal { justify-content: center; }
}

.enf-mobile-only { display: none; }

@media (max-width: 1060px) {
	.enf-intro h1 { font-size: 38px; }
	.enf-main { gap: 48px; }
}
@media (max-width: 860px) {
	.enf-top { padding: 18px 16px 0; }
	.enf-main { flex-direction: column; justify-content: flex-start; gap: 0; padding: 22px 16px 20px; }
	.enf-intro, .enf-top-link { display: none; }
	.enf-mobile-only { display: block; }
	.enf-card, .enf-card--wide { flex-basis: auto; width: 100%; max-width: 520px; }
	.enf-form { padding: 30px 24px 32px; }
}