*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#f4f6f8;color:#111}
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.auth__card{width:100%;max-width:420px;background:#fff;border:1px solid #e6e8eb;border-radius:14px;padding:22px;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.auth__brand{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.auth__logo{width:44px;height:44px;border-radius:10px;object-fit:cover;border:1px solid #eee}
.auth__brandname{font-weight:700;line-height:1.1}
.auth__brandmuted{font-size:13px;color:#666}
.auth__title{margin:10px 0 14px;font-size:22px}
.alert{background:#fff3cd;border:1px solid #ffe69c;color:#664d03;padding:10px 12px;border-radius:10px;margin:0 0 12px}
.auth__form{display:grid;gap:10px}
.auth__label{font-size:13px;color:#333}
.auth__input{width:100%;padding:11px 12px;border:1px solid #d9dde3;border-radius:10px;outline:none}
.auth__input:focus{border-color:#7aa7ff;box-shadow:0 0 0 3px rgba(122,167,255,.25)}
.auth__pw{position:relative;display:flex;align-items:center}
.auth__input--pw{padding-right:44px}
.pw-toggle{position:absolute;right:6px;border:0;background:transparent;padding:8px;border-radius:10px;cursor:pointer;color:#444}
.pw-toggle:hover{background:#f2f4f7}
.pw-toggle svg{fill:currentColor}
.auth__btn{margin-top:6px;padding:11px 12px;border:0;border-radius:10px;background:#0d6efd;color:#fff;font-weight:700;cursor:pointer}
.auth__btn:hover{filter:brightness(.95)}
.auth__footer{margin-top:10px;font-size:13px;color:#555}
.auth__footer a{color:#0d6efd;text-decoration:none}
.auth__footer a:hover{text-decoration:underline}
.auth__password{
  position: relative;
  display: flex;
  align-items: center;
}

.auth__password .auth__input{
  width: 100%;
  padding-right: 44px; /* ruang buat icon */
}

.auth__toggle{
  position: absolute;
  right: 10px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 6px;
  line-height: 0;
  opacity: .75;
}

.auth__toggle:hover{ opacity: 1; }
.auth__toggle svg{ display: block; fill: currentColor; }
