/*
 * css/einstieg.css - gemeinsame Hintergruende der Einstiegsseite (index.php)
 * und der Anmeldeseiten (02.10.2026): intern = BeWo-Rot, Partnerportal =
 * BeWo-Gruen (Farben aus dem Logo, Rot #E3051A / Gruen #80BD4C), dahinter
 * eine stilisierte, datenfreie Nachbildung der jeweiligen Oberflaeche
 * (Markup: tc_einstieg_kulisse() in includes/tc_einstieg.php).
 */
:root {
  --lp-rot: #E3051A; --lp-rot-dunkel: #9E0412; --lp-rot-tief: #6E020C;
  --lp-gruen: #80BD4C; --lp-gruen-dunkel: #3F7A22; --lp-gruen-hell: #EEF7E6; --lp-gruen-rand: #C5E2AC;
}
.lp-hg { position: relative; overflow: hidden; isolation: isolate; }
/* 02.10.2026: auf Wunsch blasser - gedaempftes Rot statt voller Logofarbe (weisse Schrift bleibt gut lesbar). */
.lp-hg--intern { background: radial-gradient(120% 90% at 20% 10%, #E07C84 0%, #C4505B 50%, #9C3A44 100%); }
.lp-hg--partner { background: radial-gradient(120% 90% at 80% 10%, #FFFFFF 0%, var(--lp-gruen-hell) 55%, #D6ECC2 100%); }
/* Anmeldeseiten: Hintergrund als feste Vollflaeche hinter der Anmeldekarte */
.lp-hg--vollbild { position: fixed; inset: 0; z-index: 0; }
.tc-auth-body--intern { background: #9C3A44; }
.tc-auth-body--partner { background: var(--lp-gruen-hell); }
.tc-auth-body--intern .tc-auth-card, .tc-auth-body--partner .tc-auth-card { position: relative; z-index: 1; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.tc-auth-body--intern .tc-auth-card { border-color: rgba(255,255,255,.6); border-top: 5px solid var(--lp-rot); }
.tc-auth-body--partner .tc-auth-card { border-color: var(--lp-gruen-rand); border-top: 5px solid var(--lp-gruen); box-shadow: 0 24px 60px rgba(63,122,34,.22); }

.lp-kulisse { position: absolute; inset: 0; z-index: -1; pointer-events: none; filter: blur(1.5px); transition: transform .6s cubic-bezier(.2,.8,.2,1), opacity .4s ease; }
.lp-hg--intern .lp-kulisse { opacity: .16; }
.lp-hg--partner .lp-kulisse { opacity: .42; }
.lp-mock-kopf { position: absolute; left: 6%; right: 6%; top: 7%; height: 44px; border-radius: 10px; }
.lp-mock-nav { position: absolute; left: 6%; right: 6%; top: calc(7% + 58px); display: flex; gap: 10px; }
.lp-mock-nav span { flex: 0 0 auto; width: 92px; height: 26px; border-radius: 8px; }
.lp-mock-zeilen { position: absolute; left: 6%; right: 30%; top: 30%; display: flex; flex-direction: column; gap: 12px; }
.lp-mock-zeilen span { height: 34px; border-radius: 8px; }
.lp-mock-leiste { position: absolute; right: 6%; top: 30%; width: 20%; display: flex; flex-direction: column; gap: 12px; }
.lp-mock-leiste span { height: 70px; border-radius: 10px; }
.lp-mock-kacheln { position: absolute; left: 6%; right: 6%; top: 28%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lp-mock-kacheln span { height: 86px; border-radius: 12px; }
.lp-mock-tabelle { position: absolute; left: 6%; right: 6%; top: calc(28% + 214px); display: flex; flex-direction: column; gap: 10px; }
.lp-mock-tabelle span { height: 26px; border-radius: 6px; }
.lp-hg--intern .lp-mock-kopf, .lp-hg--intern .lp-mock-nav span, .lp-hg--intern .lp-mock-zeilen span, .lp-hg--intern .lp-mock-leiste span { background: #fff; }
.lp-hg--intern .lp-mock-zeilen span { border-left: 8px solid var(--lp-rot-tief); }
.lp-hg--intern .lp-mock-zeilen span:nth-child(2n) { border-left-color: #F2B705; }
.lp-hg--intern .lp-mock-zeilen span:nth-child(3n) { border-left-color: var(--lp-gruen); }
.lp-hg--partner .lp-mock-kopf { background: #fff; box-shadow: 0 2px 10px rgba(63,122,34,.15); }
.lp-hg--partner .lp-mock-nav span { background: transparent; border-bottom: 4px solid var(--lp-gruen); border-radius: 0; width: 70px; }
.lp-hg--partner .lp-mock-kacheln span, .lp-hg--partner .lp-mock-tabelle span { background: #fff; border: 1px solid var(--lp-gruen-rand); }
.lp-hg--partner .lp-mock-kacheln span::before { content: ""; display: block; width: 34px; height: 34px; margin: 14px; border-radius: 9px; background: var(--lp-gruen-hell); }
@media (prefers-reduced-motion: reduce) { .lp-kulisse { transition: none; } }

/* Anmeldeknopf und Links in der Bereichsfarbe (Gruen dunkel fuer ausreichenden Kontrast) */
.tc-auth-body--intern .tc-auth-button { background-color: var(--lp-rot); border-color: var(--lp-rot); color: #fff; }
.tc-auth-body--intern .tc-auth-button:hover, .tc-auth-body--intern .tc-auth-button:focus-visible { background-color: var(--lp-rot-dunkel); border-color: var(--lp-rot-dunkel); }
.tc-auth-body--intern .tc-auth-links a { color: var(--lp-rot-dunkel); }
.tc-auth-body--partner .tc-auth-button { background-color: var(--lp-gruen-dunkel); border-color: var(--lp-gruen-dunkel); color: #fff; }
.tc-auth-body--partner .tc-auth-button:hover, .tc-auth-body--partner .tc-auth-button:focus-visible { background-color: #2F5E18; border-color: #2F5E18; }
.tc-auth-body--partner .tc-auth-links a { color: var(--lp-gruen-dunkel); }