/* fedihub.de – Startseite und /login (per nginx sub_filter eingebunden, Frio bleibt unverändert)
 * Farben angelehnt an dresden.network: Nachtblau + Laternengold
 */
.fh-home {
	--fh-night: #0b1a33;
	--fh-night-2: #13294b;
	--fh-night-3: #1d3a63;
	--fh-gold: #f5b942;
	--fh-gold-dark: #c98d1c;
	--fh-ink: #1b2433;
	--fh-muted: #4a5568;
	--fh-paper: #ffffff;
	--fh-soft: #f4f6fa;
	margin: 0 0 24px;
	color: var(--fh-ink);
	font-size: 15px;
	line-height: 1.6;
}

.fh-home h1, .fh-home h2 {
	font-weight: 700;
	letter-spacing: -0.01em;
}

/* Kopfbereich: Nachthimmel mit Lichtschein von unten */
.fh-hero {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	padding: 48px 40px;
	color: #eef2f8;
	background:
		radial-gradient(ellipse 70% 45% at 50% 115%, rgba(245, 185, 66, 0.35), rgba(245, 185, 66, 0) 70%),
		radial-gradient(1.5px 1.5px at 12% 22%, #ffffff 60%, transparent 61%),
		radial-gradient(1px 1px at 28% 12%, #ffffff 60%, transparent 61%),
		radial-gradient(1.5px 1.5px at 63% 18%, #ffffff 60%, transparent 61%),
		radial-gradient(1px 1px at 81% 30%, #ffffff 60%, transparent 61%),
		radial-gradient(1px 1px at 92% 10%, #ffffff 60%, transparent 61%),
		radial-gradient(1px 1px at 45% 35%, rgba(255, 255, 255, 0.7) 60%, transparent 61%),
		linear-gradient(165deg, var(--fh-night) 0%, var(--fh-night-2) 55%, var(--fh-night-3) 100%);
	box-shadow: 0 10px 30px rgba(11, 26, 51, 0.25);
}

.fh-hero-inner {
	position: relative;
	display: flex;
	gap: 32px;
	align-items: flex-start;
}

.fh-logo {
	flex: 0 0 auto;
	filter: drop-shadow(0 0 18px rgba(245, 185, 66, 0.35));
}

.fh-hero h1 {
	margin: 0 0 6px;
	font-size: 44px;
	color: #ffffff;
}

.fh-claim {
	margin: 0 0 14px;
	font-size: 20px;
	color: var(--fh-gold);
	font-weight: 600;
}

.fh-sub {
	margin: 0 0 24px;
	max-width: 640px;
	color: #d5ddea;
}

.fh-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.fh-btn {
	display: inline-block;
	padding: 10px 22px;
	border-radius: 999px;
	font-weight: 700;
	text-decoration: none !important;
	transition: transform 0.15s ease, background-color 0.15s ease;
}

.fh-btn:hover,
.fh-btn:focus {
	transform: translateY(-1px);
}

.fh-btn-gold {
	background: var(--fh-gold);
	color: var(--fh-night) !important;
}

.fh-btn-gold:hover,
.fh-btn-gold:focus {
	background: #ffcb5c;
}

.fh-btn-line {
	border: 2px solid rgba(255, 255, 255, 0.7);
	color: #ffffff !important;
}

.fh-btn-line:hover,
.fh-btn-line:focus {
	background: rgba(255, 255, 255, 0.12);
}

/* Funktionen */
.fh-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	margin: 20px 0;
}

.fh-card {
	background: var(--fh-paper);
	border-radius: 12px;
	border-top: 4px solid var(--fh-gold);
	padding: 18px 18px 14px;
	box-shadow: 0 2px 10px rgba(11, 26, 51, 0.08);
}

.fh-card h2 {
	margin: 0 0 8px;
	font-size: 17px;
	color: var(--fh-night-2);
}

.fh-card p {
	margin: 0;
	color: var(--fh-muted);
	font-size: 14px;
}

/* Regeln und Infos */
.fh-info {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

.fh-panel {
	background: var(--fh-paper);
	border-radius: 12px;
	padding: 22px 24px;
	box-shadow: 0 2px 10px rgba(11, 26, 51, 0.08);
}

.fh-panel h2 {
	margin: 0 0 10px;
	font-size: 20px;
	color: var(--fh-night-2);
}

.fh-panel h2 + p {
	margin-top: 0;
}

.fh-about h2:not(:first-child) {
	margin-top: 22px;
}

.fh-rules ol {
	margin: 0;
	padding-left: 22px;
}

.fh-rules li {
	margin: 4px 0;
}

.fh-rules li::marker {
	color: var(--fh-gold-dark);
	font-weight: 700;
}

.fh-home a {
	color: var(--fh-night-3);
}

.fh-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin: 18px 0 0;
	padding-top: 14px;
	border-top: 1px solid #e3e8f0;
}

.fh-links a {
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid var(--fh-gold);
}

/* ---------- Seitenhintergrund: Blauton statt Frio-Foto/Verlauf ---------- */
body.mod-home.is-not-singleuser,
body.mod-login,
body.mod-register,
body.mod-friendica,
body.mod-tos {
	background: #6f8bb0 !important;
	background-image: none !important;
}

.mod-home.is-not-singleuser div.login-form,
.mod-home.is-not-singleuser .login-content-wrapper,
.mod-home.is-not-singleuser #content,
.mod-home.is-not-singleuser main .container {
	background-color: transparent !important;
}

/* ---------- Alle Seiten (auch angemeldet): Ergänzung zum Frio-Schema „Custom“ ---------- */
nav.navbar.navbar-fixed-top {
	border-bottom: 3px solid #f5b942;
}

.btn.btn-primary {
	font-weight: 600;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus {
	background: #1d3a63;
	color: #ffcb5c;
}

/* ---------- Frio-Vorgaben für Startseite und /login neutralisieren ---------- */
body.mod-home.is-not-singleuser nav.navbar,
body.mod-login nav.navbar,
body.mod-register nav.navbar,
body.mod-friendica nav.navbar,
body.mod-tos nav.navbar {
	background-color: #0b1a33 !important;
	border-bottom: 3px solid #f5b942;
}

body.mod-home.is-not-singleuser .login-form,
body.mod-login #content .login-form,
body.mod-login .login-content-wrapper {
	background-color: transparent !important;
	padding: 0 !important;
}

body.mod-home.is-not-singleuser .login-form::before,
body.mod-home.is-not-singleuser .login-form::after,
body.mod-login #content #login-form::before,
body.mod-login #content #login-form::after {
	display: none !important;
}

body.mod-home.is-not-singleuser .login-content,
body.mod-login .login-content {
	color: #1b2433;
}

body.mod-login .login-content-wrapper {
	max-width: 440px;
	margin: 0 auto 40px !important;
	--fh-night: #0b1a33;
	--fh-night-2: #13294b;
	--fh-night-3: #1d3a63;
	--fh-gold: #f5b942;
	--fh-ink: #1b2433;
}

body.mod-login .login-content-wrapper #login-form label {
	color: #1b2433;
}

/* ---------- Anmeldefenster (rechte Spalte von Frio) ---------- */
.mod-home .login-form,
.mod-login .login-content-wrapper {
	position: sticky;
	top: 70px;
	--fh-night: #0b1a33;
	--fh-night-2: #13294b;
	--fh-night-3: #1d3a63;
	--fh-gold: #f5b942;
	--fh-ink: #1b2433;
}

.mod-home .login-form #login-form,
.mod-login .login-content-wrapper #login-form {
	background: #ffffff;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(11, 26, 51, 0.18);
	scroll-margin-top: 80px;
	color: var(--fh-ink);
}

.mod-home .login-form #login-group,
.mod-login .login-content-wrapper #login-group {
	padding: 0 24px 22px;
}

.mod-home .login-form #login-head,
.mod-login .login-content-wrapper #login-head {
	margin: 0 -24px 22px;
	padding: 22px 24px 18px;
	background: linear-gradient(165deg, var(--fh-night) 0%, var(--fh-night-2) 60%, var(--fh-night-3) 100%);
	border-bottom: 3px solid var(--fh-gold);
}

.mod-home .login-form #login-head h1,
.mod-login .login-content-wrapper #login-head h1 {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	color: #ffffff;
}

.mod-home .login-form .form-control,
.mod-login .login-content-wrapper .form-control {
	height: 44px;
	border-radius: 8px;
	border: 1px solid #cfd7e3;
	background: #f8fafc;
	color: var(--fh-ink);
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mod-home .login-form .form-control::placeholder,
.mod-login .login-content-wrapper .form-control::placeholder {
	color: #7a8699;
}

.mod-home .login-form .form-control:focus,
.mod-login .login-content-wrapper .form-control:focus {
	border-color: var(--fh-gold);
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(245, 185, 66, 0.3);
	outline: none;
}

.mod-home .login-form #login-lost-password-link,
.mod-login .login-content-wrapper #login-lost-password-link {
	margin: -4px 0 12px;
	text-align: right;
	font-size: 13px;
}

.mod-home .login-form #login-lost-password-link a,
.mod-login .login-content-wrapper #login-lost-password-link a {
	color: var(--fh-night-3);
}

.mod-home .login-form #login_openid,
.mod-login .login-content-wrapper #login_openid {
	font-size: 13px;
	color: #5a6578;
}

.mod-home .login-form #openid-header,
.mod-login .login-content-wrapper #openid-header {
	margin: 4px 0 6px;
}

.mod-home .login-form #div_id_remember label,
.mod-login .login-content-wrapper #div_id_remember label {
	color: var(--fh-ink);
}

.mod-home .login-form #login-submit-button,
.mod-login .login-content-wrapper #login-submit-button {
	display: block;
	width: 100%;
	margin-top: 14px;
	padding: 11px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--fh-gold);
	color: var(--fh-night);
	font-weight: 700;
	font-size: 16px;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

.mod-home .login-form #login-submit-button:hover,
.mod-login .login-content-wrapper #login-submit-button:hover,
.mod-home .login-form #login-submit-button:focus,
.mod-login .login-content-wrapper #login-submit-button:focus {
	background: #ffcb5c;
	transform: translateY(-1px);
}

.mod-home .login-form hr,
.mod-login .login-content-wrapper hr {
	display: none;
}

.mod-home .login-form #login-extra-links,
.mod-login .login-content-wrapper #login-extra-links {
	margin-top: 16px;
	padding: 18px 24px;
	background: #ffffff;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(11, 26, 51, 0.08);
	text-align: center;
}

.mod-home .login-form #new-here,
.mod-login .login-content-wrapper #new-here {
	margin: 0 0 10px;
	font-weight: 600;
	color: var(--fh-ink);
}

.mod-home .login-form #register-link,
.mod-login .login-content-wrapper #register-link {
	display: block;
	width: 100%;
	padding: 10px 16px;
	border: 2px solid var(--fh-night-3);
	border-radius: 999px;
	background: transparent;
	color: var(--fh-night-3);
	font-weight: 700;
	font-size: 16px;
	min-width: 0;
	margin-bottom: 0;
}

.mod-home .login-form #register-link:hover,
.mod-login .login-content-wrapper #register-link:hover,
.mod-home .login-form #register-link:focus,
.mod-login .login-content-wrapper #register-link:focus {
	background: var(--fh-night-3);
	color: #ffffff;
}

/* ---------- Registrierung (/register) ---------- */
body.mod-register .register-content-wrapper {
	--fh-night: #0b1a33;
	--fh-night-2: #13294b;
	--fh-night-3: #1d3a63;
	--fh-gold: #f5b942;
	--fh-ink: #1b2433;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 20px 0 40px;
}

body.mod-register .register-content-wrapper .generic-page-wrapper {
	background: #ffffff !important;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(11, 26, 51, 0.18);
	padding: 0 28px 24px !important;
	color: var(--fh-ink);
	font-size: 15px;
}

body.mod-register #register-form > h3.heading {
	margin: 0 -28px 24px;
	padding: 22px 28px 18px;
	background: linear-gradient(165deg, var(--fh-night) 0%, var(--fh-night-2) 60%, var(--fh-night-3) 100%);
	border-bottom: 3px solid var(--fh-gold);
	color: #ffffff;
	font-size: 24px;
	font-weight: 700;
}

body.mod-register #register-form h3:not(.heading),
body.mod-register #register-form h4,
body.mod-register #register-form h5 {
	color: var(--fh-night-2);
	font-weight: 700;
}

body.mod-register #register-form h3:not(.heading) {
	margin: 28px 0 8px;
	padding-top: 18px;
	border-top: 1px solid #e3e8f0;
	font-size: 18px;
}

body.mod-register #register-form label {
	color: var(--fh-ink);
	font-weight: 600;
}

body.mod-register #register-form .form-control {
	height: 44px;
	border-radius: 8px;
	border: 1px solid #cfd7e3;
	background: #f8fafc;
	color: var(--fh-ink);
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.mod-register #register-form textarea.form-control {
	height: auto;
	min-height: 96px;
}

body.mod-register #register-form .form-control:focus {
	border-color: var(--fh-gold);
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(245, 185, 66, 0.3);
	outline: none;
}

body.mod-register #register-form .help-block {
	color: #5a6578;
	font-size: 13px;
}

body.mod-register #register-form a {
	color: var(--fh-night-3);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid var(--fh-gold);
}

body.mod-register #register-form input[type="radio"] {
	accent-color: var(--fh-night-3);
}

body.mod-register #register-submit-wrapper {
	float: none !important;
	margin-top: 20px;
}

body.mod-register #register-submit-button {
	display: block;
	width: 100%;
	padding: 11px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--fh-gold);
	color: var(--fh-night);
	font-weight: 700;
	font-size: 17px;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

body.mod-register #register-submit-button:hover,
body.mod-register #register-submit-button:focus {
	background: #ffcb5c;
	transform: translateY(-1px);
}

body.mod-register #import-profile {
	font-size: 14px;
}

/* ---------- Infoseiten /friendica und /tos ---------- */
body.mod-friendica .friendica-content-wrapper,
body.mod-tos .tos-content-wrapper {
	--fh-night: #0b1a33;
	--fh-night-2: #13294b;
	--fh-night-3: #1d3a63;
	--fh-gold: #f5b942;
	--fh-ink: #1b2433;
	background: #ffffff !important;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(11, 26, 51, 0.18);
	padding: 0 28px 24px !important;
	margin: 20px 0 40px;
	color: var(--fh-ink);
	font-size: 15px;
	line-height: 1.6;
}

body.mod-friendica #friendica > h1,
body.mod-tos .tos-content-wrapper > h1 {
	margin: 0 -28px 22px;
	padding: 22px 28px 18px;
	background: linear-gradient(165deg, var(--fh-night) 0%, var(--fh-night-2) 60%, var(--fh-night-3) 100%);
	border-bottom: 3px solid var(--fh-gold);
	color: #ffffff;
	font-size: 26px;
	font-weight: 700;
}

body.mod-friendica .friendica-content-wrapper h2,
body.mod-friendica .friendica-content-wrapper h3,
body.mod-tos .tos-content-wrapper h2,
body.mod-tos .tos-content-wrapper h3,
body.mod-tos .tos-content-wrapper h4 {
	color: var(--fh-night-2);
	font-weight: 700;
}

body.mod-friendica .friendica-content-wrapper h3,
body.mod-tos .tos-content-wrapper h3 {
	margin: 26px 0 10px;
	padding-top: 16px;
	border-top: 1px solid #e3e8f0;
	font-size: 19px;
}

body.mod-tos .tos-content-wrapper > h1 + h3 {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

body.mod-friendica .friendica-content-wrapper a,
body.mod-tos .tos-content-wrapper a {
	color: var(--fh-night-3);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid var(--fh-gold);
}

body.mod-friendica #friendica > div {
	margin: 0 0 18px !important;
	padding: 10px 14px;
	background: #f4f6fa;
	border-left: 4px solid var(--fh-gold);
	border-radius: 6px;
}

body.mod-tos .tos-content-wrapper li::marker {
	color: #c98d1c;
}

/* Tablet */
@media (max-width: 991px) {
.mod-home .login-form,
.mod-login .login-content-wrapper {
		position: static;
		margin-top: 8px;
	}
}

/* Handy */
@media (max-width: 560px) {
	.fh-hero {
		padding: 28px 20px;
		border-radius: 10px;
	}
	.fh-hero-inner {
		flex-direction: column;
		gap: 16px;
	}
	.fh-logo svg {
		width: 64px;
		height: 64px;
	}
	.fh-hero h1 {
		font-size: 34px;
	}
	.fh-claim {
		font-size: 17px;
	}
	.fh-cards {
		grid-template-columns: 1fr;
	}
	.fh-panel {
		padding: 18px;
	}
}