input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear {
    display: none;
}

body {
    font-family: Segoe UI, Arial, sans-serif;
    background:#f4f4f4;
    padding:40px;
}

.container {
    max-width:700px;
    margin:auto;
    background:white;
    padding:30px;
    border-radius:12px;
    box-shadow:0 0 15px rgba(0,0,0,0.15);
}

h1 {
    color:#0078d4;
    margin-top:0;
}

.info {
    background:#fff7ed;
    border-left:5px solid #f97316;
    padding:12px;
    margin-bottom:20px;
    border-radius:6px;
}

.error {
    background:#fee2e2;
    border-left:5px solid #dc2626;
    padding:12px;
    margin-bottom:20px;
    border-radius:6px;
    color:#991b1b;
}

.success {
    background:#dcfce7;
    border-left:5px solid #16a34a;
    padding:12px;
    margin-bottom:20px;
    border-radius:6px;
    color:#166534;
}

.userbox {
    background:#eef6ff;
    border-left:5px solid #0078d4;
    padding:12px;
    margin-bottom:20px;
    border-radius:6px;
}

input {
    width:100%;
    padding:12px;
    margin-top:5px;
    margin-bottom:15px;
    border:1px solid #ccc;
    border-radius:6px;
    box-sizing:border-box;
    font-size:15px;
}

button,
.buttonlink {
    width:100%;
    padding:14px;
    background:#0078d4;
    color:white;
    border:none;
    border-radius:6px;
    font-size:16px;
    cursor:pointer;
    display:block;
    text-align:center;
    text-decoration:none;
    box-sizing:border-box;
}

button:hover,
.buttonlink:hover {
    background:#106ebe;
}

.buttonlink.secondary {
    background:#555;
    margin-top:10px;
}

.buttonlink.secondary:hover {
    background:#333;
}

button:disabled {
    background:#999;
    cursor:not-allowed;
}

.password-policy {
    margin-top:20px;
    background:#f8f8f8;
    padding:15px;
    border-radius:8px;
}

.rule {
    margin:8px 0;
    font-size:15px;
}

.valid {
    color:green;
}

.invalid {
    color:red;
}

.password-strength {
    margin-top:20px;
}

.strength-bar {
    height:15px;
    background:#ddd;
    border-radius:20px;
    overflow:hidden;
}

#strength-fill {
    width:0%;
    height:100%;
    transition:0.3s;
}

#strength-text {
    margin-top:10px;
    font-weight:bold;
}

.password-wrapper {
    position: relative;
}

.password-wrapper input {
    width: 100%;
    padding-right: 50px;
    box-sizing: border-box;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);

    border: none !important;
    background: transparent !important;

    width: auto !important;
    min-width: 0 !important;

    padding: 0 !important;
    margin: 0 !important;

    cursor: pointer;
    font-size: 18px;
}

footer {
    text-align: center;
    margin-top: 30px;
    padding-bottom: 20px;
    color: #7a7a7a;
    font-size: 13px;
    font-weight: 400;
}