/* Continuitylab Resilience Portal — Frontend-CI.
   Markenfarben wie Landingpage: Dunkel #0E1C2E, Grün #16C79A.
   Fonts: Manrope (Text) + Space Grotesk (Überschriften), lokal eingebunden. */

/* ---------- Fonts (variable, lokal) ---------- */
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('fonts/manrope-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('fonts/manrope-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('fonts/spacegrotesk-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('fonts/spacegrotesk-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- Basis ---------- */
.clrp-portal {
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif !important;
	color: #1b2733;
	max-width: 100%;
	overflow-x: hidden; /* fängt Rundungs-Überstände auf Mobile ab */
}
/* Verhindert horizontalen Overflow: 100%-breite Felder/Buttons inkl. Padding+Border
   müssen in ihren Container passen (sonst „rutscht es rechts raus" auf Mobile). */
.clrp-portal,
.clrp-portal *,
.clrp-portal *::before,
.clrp-portal *::after {
	box-sizing: border-box;
}
.clrp-portal h1,
.clrp-portal h2,
.clrp-portal h3 {
	font-family: 'Space Grotesk', 'Manrope', Arial, sans-serif !important;
	color: #0E1C2E !important;
	letter-spacing: -0.01em;
}
.clrp-portal a {
	color: #0a8f6f;
}
.clrp-portal a:hover {
	color: #16C79A;
}

/* Primäre Pill-Aktion (z. B. „Assessment öffnen") */
.clrp-portal a[style*="border-radius:999px"] {
	background: #0E1C2E !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(14, 28, 46, 0.18);
}
.clrp-portal a[style*="border-radius:999px"]:hover {
	background: #16C79A !important;
}

/* WP-Buttons innerhalb des Frontends */
.clrp-portal .button-primary,
.clrp-portal #wp-submit {
	background: #0E1C2E !important;
	border-color: #0E1C2E !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 10px 22px !important;
	height: auto !important;
	font-weight: 700 !important;
}
.clrp-portal .button-primary:hover,
.clrp-portal #wp-submit:hover {
	background: #16C79A !important;
	border-color: #16C79A !important;
}

/* Tabellenkopf dezent markieren */
.clrp-portal thead th {
	color: #0E1C2E !important;
}

/* ---------- Login ---------- */
.clrp-login {
	max-width: 440px;
	margin: 0 auto;
	padding: 0 16px; /* Seitenabstand auf schmalen Screens, damit die Karte nicht am Rand klebt */
}
.clrp-login-card {
	max-width: 100%;
}
.clrp-login-card {
	border: 1px solid #e2e5e0;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 14px 40px rgba(14, 28, 46, 0.08);
	overflow: hidden;
}
.clrp-login-head {
	background: #0E1C2E;
	color: #fff;
	padding: 22px 24px;
}
.clrp-login-head .clrp-kicker {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #9fb3c8;
}
.clrp-login-head h2 {
	color: #fff !important;
	margin: 4px 0 0;
	font-size: 22px;
}
.clrp-login-body {
	padding: 22px 24px;
}
.clrp-portal #loginform p {
	margin: 0 0 14px;
}
.clrp-portal #loginform label {
	display: block;
	font-size: 13px;
	color: #667065;
	margin-bottom: 4px;
	font-weight: 600;
}
.clrp-portal #loginform input[type="text"],
.clrp-portal #loginform input[type="password"] {
	width: 100%;
	padding: 11px 12px;
	border: 1px solid #d9ded6;
	border-radius: 10px;
	font: inherit;
	background: #fff;
}
.clrp-portal #loginform .login-remember label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 500;
	color: #475148;
}
.clrp-portal #loginform .login-remember input {
	width: auto;
}
.clrp-portal #wp-submit {
	width: 100%;
}