/* styles/password-toggle.css */
.password-toggle-wrapper{ position:relative; display:block; width:100%; }
.password-toggle-btn{ position:absolute; right:10px; top:50%; transform:translateY(-50%); border:none; background:transparent; padding:6px; margin:0; cursor:pointer; color:#666; display:flex; align-items:center; justify-content:center; }
.password-toggle-btn:active, .password-toggle-btn:focus{ outline:none; }
.password-toggle-btn svg{ display:block; }
input.password-with-toggle{ padding-right:44px; }

/* Ensure the button doesn't interfere with form layout */
.password-toggle-wrapper { box-sizing: border-box; }
.password-toggle-btn { background: transparent; line-height: 0; }

/* Override global mobile button rules so the eye icon doesn't expand to full width */
.password-toggle-btn{
	width: auto;
	min-width: 0;
	z-index: 2;
}

@media (max-width: 600px) {
	/* Keep the toggle small and ensure input has enough right padding */
	.password-toggle-btn { right: 8px; padding:8px; }
	input.password-with-toggle { padding-right: 52px; }
}
