/* Стили для компонентов работы с паролями */

/* Кнопки генерации и копирования пароля */
.btn[data-password-generate],
.btn[data-password-copy],
.btn[data-password-toggle] {
    position: relative;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

/* Иконки внутри кнопок не должны блокировать события */
.btn[data-password-generate] i,
.btn[data-password-copy] i,
.btn[data-password-toggle] i {
    pointer-events: none;
    display: inline-block;
    vertical-align: middle;
}

/* Убираем outline и box-shadow при фокусе для кнопок */
.btn[data-password-generate]:focus,
.btn[data-password-copy]:focus,
.btn[data-password-toggle]:focus {
    outline: none;
    box-shadow: none;
}

/* Анимация при наведении - только изменение фона, бордер остается */
.btn[data-password-generate]:hover,
.btn[data-password-copy]:hover,
.btn[data-password-toggle]:hover {
    transition: background-color 0.2s ease;
    border: 1px solid #ced4da !important;
    border-color: #ced4da !important;
    background-color: #e9ecef !important;
    color: #495057 !important;
}

/* Стили для блоков требований пароля */
.password-requirements {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-radius: 0.25rem;
    border: 1px solid #e9ecef;
}

.password-requirement {
    display: flex;
    align-items: center;
    margin-bottom: 0.25rem;
    font-size: 0.875rem;
}

.password-requirement:last-child {
    margin-bottom: 0;
}

.password-requirement i {
    margin-right: 0.5rem;
    width: 1rem;
    text-align: center;
}

/* Стили для сообщений подтверждения пароля */
.password-confirm-message {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #dc3545;
}

.password-confirm-message.show {
    display: block;
}

/* Стили для полей с валидацией */
.form-control.is-valid {
    border-color: #28a745;
}

.form-control.is-invalid {
    border-color: #dc3545;
}

/* Анимация для кнопок копирования */
.btn[data-password-copy].btn-success {
    animation: copySuccess 0.3s ease;
}

@keyframes copySuccess {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

/* Стили для input-group с кнопками паролей */
.input-group .btn[data-password-generate],
.input-group .btn[data-password-copy],
.input-group .btn[data-password-toggle] {
    border: 1px solid #ced4da;
}

/* Убираем border-radius у кнопок паролей в input-group */
.input-group .btn[data-password-generate]:not(:first-child):not(:last-child),
.input-group .btn[data-password-copy]:not(:first-child):not(:last-child),
.input-group .btn[data-password-toggle]:not(:first-child):not(:last-child) {
    border-radius: 0;
}

.input-group .btn[data-password-generate]:first-child:not(:only-child),
.input-group .btn[data-password-copy]:first-child:not(:only-child),
.input-group .btn[data-password-toggle]:first-child:not(:only-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group .btn[data-password-generate]:last-child:not(:only-child),
.input-group .btn[data-password-copy]:last-child:not(:only-child),
.input-group .btn[data-password-toggle]:last-child:not(:only-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}