/**
 * 通用表单输入框样式
 * 适用于登录、注册、找回密码等需要黑色背景输入框的页面
 *
 * 用法：在需要黑色背景的 <input> 上添加 class="pd-input"
 */
.pd-input {
    /* 黑色背景，输入前后保持不变 */
    background-color: #000 !important;
    color: #dde3e7 !important;

    /* 边框与聚焦状态 */
    border-color: rgba(133, 147, 153, 0.3) !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-radius: 0.5rem !important;

    /* 占位符颜色 */
    caret-color: #00d1ff;
}

.pd-input::placeholder {
    color: #859399 !important;
    opacity: 1;
}

.pd-input:hover {
    border-color: rgba(0, 209, 255, 0.5) !important;
}

.pd-input:focus {
    border-color: #00d1ff !important;
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(0, 209, 255, 0.3) !important;
}

/* 覆盖浏览器自动填充后的默认背景色（黄色/白色） */
.pd-input:-webkit-autofill,
.pd-input:-webkit-autofill:hover,
.pd-input:-webkit-autofill:focus,
.pd-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #000 inset !important;
    -webkit-text-fill-color: #dde3e7 !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Firefox 自动填充覆盖 */
.pd-input:autofill {
    background-color: #000 !important;
    color: #dde3e7 !important;
}