/* 密码框「小眼睛」样式（2026-09-22）
   目标：不改变原有输入框外观（桌面与手机都不挤字），手机端点击热区 ≥44px。
   配合 /static/js/pw-toggle.js 使用（由 base.html 全局引入）。 */
.pw-toggle-group {
  flex-wrap: nowrap;            /* 图标按钮永远跟在输入框右边，不换行 */
}
.pw-toggle-group > .pw-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;              /* 桌面端热区 */
  padding: 0 .5rem;
  color: #6c757d;
  background-color: #fff;
  border-color: #ced4da;
}
.pw-toggle-group > .pw-toggle-btn:hover,
.pw-toggle-group > .pw-toggle-btn:focus {
  color: #16499c;
  background-color: #f8f9fa;
}
.pw-toggle-group > .pw-toggle-btn:focus-visible {
  outline: 2px solid #16499c;
  outline-offset: 1px;
}
.pw-toggle-group > .pw-toggle-btn i {
  font-size: 1rem;
  line-height: 1;
}
/* 密码框本身：文字与右侧按钮之间留出内边距，不贴边、不被遮挡 */
.pw-toggle-group > input[type='password'],
.pw-toggle-group > input[type='text'] {
  padding-right: .75rem;
}
/* 手机端：热区放大到 ≥44px，方便手指点（不影响桌面上输入框的高度） */
@media (max-width: 640px) {
  .pw-toggle-group > .pw-toggle-btn {
    min-width: 46px;
    min-height: 44px;
  }
}
