/* ================================
   Update Password (scoped)
   Greift nur auf der Seite, die das
   Formular mit id="kc-passwd-update-form" rendert.
   ================================ */

/* Design-Variablen analog zu login-reset-password.css */
:root {
    --ghm-accent: #ff8200;
    /* Orange Button-Farbe */
    --ghm-text: #1f1f1f;
    /* Primärtext */
    --ghm-muted: #4b5563;
    /* Sekundärtext */
    --ghm-surface: #f5f5f5;
    /* Karten-Hintergrund */
    --ghm-border: #e5e7eb;
    /* Feldrahmen */
    --ghm-focus: rgba(255, 130, 0, .35);
    /* Focus Glow */
    --ghm-radius: 8px;
    /* Eckenradius der Karte */
    --ghm-primary-hover-color: #e37100;
    --ghm-secondary-hover-color: #1b4b8e;
}

/* Karte / Container */
#kc-passwd-update-form {
    max-width: 560px;
    margin: 24px auto;
    background: var(--ghm-surface);
    padding: 28px 28px 24px;
    border-radius: var(--ghm-radius);
    box-shadow:
        0 8px 20px rgba(0, 0, 0, .06),
        0 2px 6px rgba(0, 0, 0, .04);
    box-sizing: border-box;
}

/* Headline (falls im Formular gerendert) */
#kc-passwd-update-form h1,
#kc-passwd-update-form h2,
#kc-passwd-update-form .form-title {
    margin: 0 0 18px 0;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--ghm-text);
    text-align: center;
}

/* Form-Gruppen */
#kc-passwd-update-form .form-group,
#kc-passwd-update-form .kcFormGroup,
#kc-passwd-update-form .pf-c-form__group {
    margin-bottom: 16px;
}

/* Labels */
#kc-passwd-update-form label,
#kc-passwd-update-form .pf-c-form__label,
#kc-passwd-update-form .pf-c-form__label-text {
    display: block;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ghm-muted);
    margin-bottom: 6px;
}

/* Inputs (Neues Passwort + Bestätigung) */
#kc-passwd-update-form input[type="password"],
#kc-passwd-update-form input[type="text"],
#kc-passwd-update-form input[type="email"] {
    width: 100%;
    height: 40px;
    padding: 8px 12px;
    border: 1px solid var(--ghm-border);
    border-radius: 10px;
    /* wie im reset css */
    background: #fff;
    color: var(--ghm-text);
    outline: none;
    box-sizing: border-box;
    transition: border-color .15s ease, box-shadow .15s ease;
}

#kc-passwd-update-form input:focus {
    border-color: var(--ghm-accent);
    /* box-shadow: 0 0 0 4px var(--ghm-focus);  optional wie im reset css auskommentiert */
}

/* Passwort-Hinweise / Help-Texts / Fehler */
#kc-passwd-update-form .kc-feedback-text,
#kc-passwd-update-form .pf-c-form__helper-text,
#kc-passwd-update-form .instruction,
#kc-passwd-update-form .password-hint,
#kc-passwd-update-form .password-guideline {
    font-size: 13px;
    color: var(--ghm-muted);
    margin-top: 6px;
}

#kc-passwd-update-form .error,
#kc-passwd-update-form .pf-m-error,
#kc-passwd-update-form .alert-error {
    color: #b42318;
}

/* (Optional) Stärke-Anzeige falls vorhanden */
#kc-passwd-update-form .password-strength,
#kc-passwd-update-form .kc-password-strength,
#kc-passwd-update-form .pw-strength {
    margin-top: 8px;
    font-size: 12px;
    color: var(--ghm-muted);
}

/* Aktionen: Submit-Button + Zurück-Link */
#kc-passwd-update-form .form-actions,
#kc-passwd-update-form .pf-c-form__actions,
#kc-passwd-update-form .login-actions {
    margin-top: 18px;
}

/* Primary Submit-Button (Neues Passwort setzen) */
#kc-passwd-update-form button[type="submit"],
#kc-passwd-update-form input[type="submit"],
#kc-passwd-update-form .pf-c-button.pf-m-primary {
    display: flex;
    /* exakte Zentrierung wie gewünscht */
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 44px;
    border: none;
    border-radius: 4px;
    /* wie im reset css */
    background: var(--ghm-accent);
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    cursor: pointer;
    transition: transform .03s ease, filter .15s ease;
}

#kc-passwd-update-form button[type="submit"]:hover,
#kc-passwd-update-form input[type="submit"]:hover,
#kc-passwd-update-form .pf-c-button.pf-m-primary:hover {
    background-color: var(--ghm-primary-hover-color) !important;
}

#kc-passwd-update-form button[type="submit"]:active,
#kc-passwd-update-form input[type="submit"]:active,
#kc-passwd-update-form .pf-c-button.pf-m-primary:active {
    transform: translateY(1px);
}

/* Sekundäre Links (z. B. "Zurück zur Anmeldung") */
#kc-passwd-update-form .back-to-login,
#kc-passwd-update-form a[href*="login-actions/authenticate"],
#kc-passwd-update-form .pf-c-button.pf-m-link,
#kc-passwd-update-form .kc-form-options a {
    display: inline-block;
    margin-top: 10px;
    font-size: 13px;
    text-decoration: none;
    color: var(--ghm-muted);
    transition: color .2s ease;
}

#kc-passwd-update-form .back-to-login:hover,
#kc-passwd-update-form a[href*="login-actions/authenticate"]:hover,
#kc-passwd-update-form .pf-c-button.pf-m-link:hover,
#kc-passwd-update-form .kc-form-options a:hover {
    color: var(--ghm-accent);
    /* gleiche Hover-Farbe wie beim Reset */
    text-decoration: underline;
}

/* optische Luft unten wie im Login-Screen */
#kc-passwd-update-form::after {
    content: "";
    display: block;
    height: 6px;
}

/* Optional: Logo-Zeile */
#kc-passwd-update-form .brand-row {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-bottom: 12px;
}

#kc-passwd-update-form .brand-row img {
    max-height: 28px;
}