/*==================================================================================*/
/* 6KA Softwareentwicklung und Digitalisierung                                      */
/* Login-Kompaktstylesheet fuer den GUI-Login                                       */
/* login_compact.css v1.0.0 - 18.04.2026                                            */
/*==================================================================================*/

/*==================================================================================*/
/* Globale Basisregeln fuer dieses Formular                                         */
/*==================================================================================*/
*, *::before, *::after                  {   box-sizing: border-box; }

html                                    {   min-height: 100vh;
                                            scroll-padding-top: 20em;
                                            font-size: 16px; }

body                                    {   display: flex;
                                            flex-direction: column;
                                            min-height: 100vh;
                                            background-color: #214778;
                                            color: #000000;
                                            margin: 0;
                                            padding: 0;
                                            font-family: 'Roboto', Arial, Helvetica, sans-serif;
                                            font-size: 1rem;
                                            font-weight: 400;
                                            line-height: 1.5; }

main                                    {   flex: 1; }

p                                       {   margin: 0;
                                            padding: 0; }

input, textarea, select                 {   appearance: none; }

a                                       {   text-decoration: none; }

/*==================================================================================*/
/* Login-Container                                                                  */
/*==================================================================================*/
.login_container                        {   max-width: 22rem;
                                            margin: 4rem auto;
                                            background: #ffffff;
                                            padding: 2.5rem 2rem 2rem 2rem;
                                            border: 1px solid #4b628e; }

.login_title                            {   font-size: 1.5rem;
                                            margin-bottom: 1.5rem;
                                            text-align: center;
                                            letter-spacing: 0.01em; }

.login_form label                       {   display: block;
                                            margin-bottom: 0.2rem;
                                            font-weight: 400;
                                            color: #214778; }

/*==================================================================================*/
/* Fehlermeldungsbereich                                                            */
/*==================================================================================*/
.login_error                            {   background: #ffe2e2;
                                            color: #a02c2c;
                                            text-align: center;
                                            padding: 0.8rem 1rem;
                                            margin-bottom: 1.1rem;
                                            border-left: 4px solid #a02c2c; }

.login_error_text                       {   display: block; }

.login_lock_timer                       {   display: none;
                                            margin-top: 0.45rem;
                                            padding-top: 0.45rem;
                                            border-top: 1px solid rgba(160, 44, 44, 0.25);
                                            font-weight: 700; }

.login_lock_timer.is-visible            {   display: block; }

.login_lock_label                       {   display: block;
                                            font-weight: 400;
                                            margin-bottom: 0.1rem; }

.login_lock_value                       {   display: inline-block;
                                            letter-spacing: 0.03em; }                                            

.login_error_noDisplay                  {   display: none; }

/*==================================================================================*/
/* Formularbereiche                                                                 */
/*==================================================================================*/
.loginCon,
.loginConR,
.loginConC                              {   width: 100%; }

.loginConR                              {   text-align: right;
                                            margin-top: -0.6rem; }

.loginConC                              {   text-align: center; }

/*==================================================================================*/
/* Eingabefelder                                                                     */
/*==================================================================================*/
input[type="text"],
input[type="password"]                  {   width: 100%;
                                            padding: 0.7rem;
                                            margin-bottom: 1rem;
                                            border: none;
                                            outline: none;
                                            border-bottom: 1px solid #6d80a3;
                                            font-size: 1rem;
                                            background: #dadee8;
                                            color: #1c304f; }

input[type="text"]:focus,
input[type="password"]:focus            {   border-bottom: 1.5px solid #7e9c1e;
                                            background: #eaf6d5;
                                            color: #214778; }

/*==================================================================================*/
/* Passwort-Anzeige-Link                                                            */
/*==================================================================================*/
.showpwlink                             {   font-size: 0.9rem;
                                            color: #214778;
                                            cursor: pointer;
                                            background: none;
                                            border: 1px #4b628e solid;
                                            border-radius: 4px;
                                            padding: 0.2rem 0.4rem 0.2rem 0.4rem;
                                            margin-top: 0.2em;
                                            display: inline-block; }

.showpwlink:hover                       {   text-decoration: underline;
                                            text-underline-offset: 0.3rem;
                                            border: 1px #7e9c1e solid; }

/*==================================================================================*/
/* Button                                                                           */
/*==================================================================================*/
button                                  {   width: 100%;
                                            padding: 0.9rem;
                                            background: #214778;
                                            color: #ffffff;
                                            border: none;
                                            border-radius: 0;
                                            font-size: 1.1rem;
                                            font-weight: 700;
                                            cursor: pointer;
                                            transition: all 0.2s;
                                            letter-spacing: 0.04em; }

button:hover                            {   background: #4b628e; }

/*==================================================================================*/
/* Logo                                                                             */
/*==================================================================================*/
.logo                                   {   max-width: 12rem;
                                            height: auto; }

/*==================================================================================*/
/* Kleine Viewports                                                                 */
/*==================================================================================*/
@media only screen and (max-width: 500px) {

    body                                {   background-color: #ffffff; }

    .login_container                    {   border: none; }
}