/* Cordyceps custom login background */
:root {
    --keycloak-bg-logo-url: none;
    --keycloak-logo-url: url('../img/logo.png');
    --keycloak-logo-height: 120px;
    --keycloak-logo-width: 120px;
}

/* Replace Keycloak text logo with mushroom icon */
#kc-header-wrapper .kc-logo-text {
    font-size: 0 !important;
}

#kc-header-wrapper {
    background-image: url('../img/logo.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    min-height: 120px;
}

.login-pf {
    background: url("../img/bg.png") no-repeat center center fixed !important;
    background-size: cover !important;
}

#keycloak-bg {
    background: transparent !important;
}

/* Hide the default PatternFly background image layer (if present) */
.pf-v5-c-background-image {
    display: none !important;
}

/* Position the login container to the right */
.pf-v5-c-login {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    min-height: 100vh;
    padding: 2rem 5vw 2rem 2rem;
}

.pf-v5-c-login__container {
    max-width: 600px;
    width: 100%;
    grid-template-columns: 24rem !important;
}

/* Semi-translucent login card */
.pf-v5-c-login__main {
    background-color: rgba(20, 20, 30, 0.6) !important;
    backdrop-filter: blur(14px);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #e8e8f0;
}

/* Lighter text throughout */
.pf-v5-c-login__main-body,
.pf-v5-c-login__main-header,
.pf-v5-c-login__main h1,
.pf-v5-c-login__main label,
.pf-v5-c-login__main .pf-v5-c-form__label-text {
    color: #e8e8f0 !important;
}

/* Earthy green accent to match the forest background */
.pf-v5-c-login__main-header {
    border-top-color: #3a9e6e !important;
}

.pf-v5-c-button.pf-m-primary {
    background-color: #3a9e6e !important;
    border-color: #3a9e6e !important;
}

.pf-v5-c-button.pf-m-primary:hover {
    background-color: #2e8259 !important;
    border-color: #2e8259 !important;
}

/* Mobile: center the login box */
@media (max-width: 768px) {
    .pf-v5-c-login {
        justify-content: center !important;
        padding: 2rem 1rem;
    }
}