/* Form Field Styles */

/* Soften placeholders */
::placeholder {
    color: var(--a-border) !important; /* text-gray-300 */
    opacity: 0.7 !important;
    font-weight: 300 !important;
}

/* Make focused placeholders even lighter */
input:focus::placeholder,
textarea:focus::placeholder {
    color: var(--a-border) !important; /* text-gray-200 */
    opacity: 0.5 !important;
    transition: all 0.3s ease;
}

/* Improve form field focus states — uses theme CSS vars */
input:focus,
textarea:focus,
select:focus {
    box-shadow: 0 0 0 1px var(--primary-color, rgb(var(--a-primary))) !important;
    border-color: var(--primary-color, rgb(var(--a-primary))) !important;
    outline: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

/* Improve form field hover states */
input:hover:not(:focus),
textarea:hover:not(:focus),
select:hover:not(:focus) {
    border-color: color-mix(in srgb, var(--primary-color, rgb(var(--a-primary))) 40%, var(--a-border)) !important;
    transition: border-color 0.15s ease;
}

/* Enhanced button hover effect */
.btn-auth:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(79, 70, 229, 0.3) !important;
    transition: all 0.3s ease !important;
}

/* Social login button enhancement */
.social-login-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s ease !important;
}

/* Password toggle button styles */
.password-toggle-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    transition: all 0.2s ease;
    z-index: 10;
}

.password-toggle-btn:hover {
    background-color: rgba(0, 0, 0, 0.05);
    transform: scale(1.1);
}

.password-toggle-btn:active {
    transform: scale(0.95);
}

.password-toggle-btn i {
    font-size: 16px;
    transition: all 0.2s ease;
}

/* Ensure the password input has proper padding for the button */
.form-input-animated input[type="password"] {
    padding-right: 3rem !important;
}