:root {
    --accent-color: rgb(38.9540540541, 209.5459459459, 98.0567567568); /* from OMEGA: --color-highlight-darker */
    --accent-background-secondary: #b0ffc5;
    --background-primary: #ffffff;
    --background-secondary: #f8f9fa;
    --text-primary: #222222;
    --text-secondary: #000000;
    --color-omega-dark-new-bg: oklch(28.44% 0.0158 264.28);
}

#dashboard-header {
    background: linear-gradient(to bottom, var(--color-omega-dark-new-bg), rgb(0, 0, 0));
    --text-primary: white;

    .logo {
        height: 2rem;
    }

    w-theme {
        display: none;
    }

    .dropdown-menu {
        --text-primary: #222222;
    }

    /* prevent default logo from showing up for a few ms */
    img[src="WebInterface/images/logo.png"] {
        display: none;
    }

    .header-container .hamburger-menu-btn:hover .text-primaryMain {
        color: #222222;
    }

    #header-content {
        padding-right: 18rem;
        background: url('/WebInterface/images/adidas-batch-logo.png') right 13.5rem center / 2.5rem no-repeat,
                    url('/WebInterface/images/adidas-originals-logo.png') right 10rem center / 2.5rem no-repeat,
                    linear-gradient(white, white) right 8.7rem center / 1px 2rem no-repeat,
                    url('/WebInterface/images/Nureg_Logo_negativ_RZ.png') right / 7.5rem no-repeat
    }
}

.login-page .auth-section .auth-form-section {
    background-color: transparent !important;
}

.auth-section,
.reset-section {
    --accent-color: #8ffaaf;

    background-image: url('/WebInterface/images/OMEGA-background.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    #page-columns {
        flex-direction: column;
    }

    .header-container {
        position: unset !important;
        height: min(4rem, 5vw);
        margin: 2.5rem;
        display: flex;
        justify-content: space-between;
        gap: 1rem;

        .customer-logos {
            display: flex;
            gap: 1rem;

            img {
                height: 100%;
            }
        }

        .nureg-logo {
            height: 80%;
        }
    }

    w-theme {
        display: none;
    }

    .logo {
        max-width: min(80vw, 70rem);
        margin-block: max(calc(25vh - 15rem), 0rem);
    }

    .forgot-password-title,
    .reset-password-label {
        color: white;
    }

    .auth-form-section,
    .reset-form-section {
        background-color: unset;

        div:has(+ #resetForm) {
            background-color: rgba(0, 0, 0, 0.6);
            margin-bottom: 0 !important;
            border-top-left-radius: 0.5rem;
            border-top-right-radius: 0.5rem;
            padding-top: 1rem;
        }

        #resetForm {
            border-bottom-left-radius: 0.5rem;
            border-bottom-right-radius: 0.5rem;
        }

        #loginForm {
            border-radius: 0.5rem;
        }

        #loginForm,
        #resetForm {
            padding: 1rem;
            background-color: rgba(0, 0, 0, 0.6);

            .primary-button.is-bordered {
                color: white;
            }
        }
    }

    input:placeholder-shown {
        opacity: 1 !important;
    }

    label {
        color: white;
        font-size: .875rem;
    }

    /* hide right area with image */
    .auth-banner-container,
    .reset-banner-container {
        display: none !important;
    }

    /* make loading indicator cover the whole screen instead of login form plus some area above */
    .loader-section-container {
        position: unset;
    }

    .loader-section {
        opacity: 0.5;
    }
}

body #customFooterLoginPageContainer:not(.increase-specificity) {
    position: fixed !important;
    bottom: 0 !important;
}

#acceptCookieNotification:not(.remove) + #customFooterLoginPageContainer:not(.increase-specificity) {
    bottom: 70px !important;
}

#disclaimer-dialog {
    max-width: min(30rem, 80vw);
    box-shadow: 0 0 2rem rgba(0, 0, 0, 0.5);

    h1 {
        font-weight: bold;
        margin-bottom: 0.5rem;
    }

    .disclaimer-dialog__buttons {
        margin-top: 1rem;
        display: flex;
        justify-content: center;
        gap: 1rem;

        button {
            min-width: 5rem;
        }
    }
}

.external-omega-footer {
    position: absolute;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.4);
    padding: 0.125rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;

    a {
        color: white;

        &:hover {
            text-decoration: underline;
        }
    }

    .external-omega-footer__divider {
        width: 1px;
        height: 1rem;
        background: rgb(204, 204, 204);
    }
}