/* =========================================
   Field Hint
========================================= */

.gold-auth-hint {
    margin-bottom: 7px;

    color: #8c8981;

    font-size: 11px;
    font-weight: 400;
}

/* =========================================
   Password Reveal
========================================= */

.gold-auth-reveal {
    width: 40px;
    height: 48px;

    flex: 0 0 40px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    color: #aaa69e;
    background: transparent;

    border: 0;
    outline: 0;

    cursor: pointer;

    transition: color 0.2s ease;
}

.gold-auth-reveal:hover,
.gold-auth-reveal:focus,
.gold-auth-reveal:active {
    color: color-mix(in srgb, var(--primary-color) 70%, #111);

    background: transparent;

    border: 0;
    outline: 0;
}

.gold-auth-reveal i {
    font-size: 18px;

    line-height: 1;
}

.gold-auth-reveal.is-visible {
    color: color-mix(in srgb, var(--primary-color) 70%, #111);
}

/* The reveal button replaces the input's own trailing padding. */
.gold-login-control:has(.gold-auth-reveal) .gold-login-input {
    padding-left: 0;
}