body {
    background-attachment: fixed;
    background-color: var(--telekom-color-background-canvas);
    background-image: url(/image/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: var(--telekom-color-text-and-icon-standard);
    display: flex;
    flex-direction: column;
    margin: 0;
    min-height: 100vh;
}

.login-box {
    background-color: var(--telekom-color-background-canvas);
    border-radius: 16px;
    padding: 32px;
}

.input-border {
  border: var(--telekom-spacing-composition-space-01) solid var(--telekom-color-ui-border-standard)
hsla(0, 0%, 0%, 0.44);
}

.login-box h1 {
    font: var(--telekom-text-style-heading-4);
    margin: 0;
}

.login-box__text-field {
    margin-top: 24px;
    position: relative;
}

.switch__label-text {
    font: var(--font-label);
    margin-inline-start: var(--spacing-x-label);
    color: var(--color-label);
}

.email-display {
    /* display: none; */
    align-items: center;
    font-weight: normal;
    color: #000000;
    font-size: 14px;
    gap: 8px;
    cursor: pointer;
    max-width: 250px;
}
.email-display::after {
    content: " ▼";
    font-size: 12px;
    color: #000000;
    margin-left: 3px;
    flex-shrink: 0;
}

@media screen and (max-width: 639px) {
    body {
        background-image: none;
    }
}

@media screen and (max-width: 639px) {
    .login-box {
        border-radius: 0;
        margin: 16px auto;
        padding: 16px;
        min-width: 320px;
        max-width: 448px;
    }
}