/* VersaPlay v3.4.1 — controles de senha */

.vp-password-input-wrap {
    position: relative;
    width: 100%;
}

.vp-password-input-wrap > input {
    width: 100%;
    padding-right: 72px !important;
}

.vp-password-eye {
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
    min-width: 56px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid rgba(115, 210, 255, .24);
    border-radius: 8px;
    background: rgba(15, 35, 58, .96);
    color: #dcecf8;
    font: inherit;
    font-size: .76rem;
    font-weight: 750;
    cursor: pointer;
}

.vp-password-eye:hover,
.vp-password-eye:focus-visible {
    border-color: rgba(92, 220, 185, .60);
    outline: none;
}

.vp-password-tools {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: -1px 0 10px;
}

.vp-password-tool-btn {
    min-height: 34px;
    padding: 0 10px;
    border: 1px solid rgba(115, 210, 255, .22);
    border-radius: 8px;
    background: #15253a;
    color: #dcecf8;
    font: inherit;
    font-size: .78rem;
    font-weight: 750;
    cursor: pointer;
}

.vp-password-tool-btn:hover,
.vp-password-tool-btn:focus-visible {
    border-color: rgba(92, 220, 185, .58);
    outline: none;
}

.vp-password-status {
    flex: 1 1 180px;
    color: #8fb0c8;
    font-size: .74rem;
    line-height: 1.35;
}

.vp-password-hint {
    margin: -3px 0 11px;
    color: #8fa6bb;
    font-size: .75rem;
    line-height: 1.4;
}

@media (max-width: 480px) {
    .vp-password-tools {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .vp-password-tool-btn {
        width: 100%;
    }

    .vp-password-status {
        grid-column: 1 / -1;
    }
}
