{{template "base/header" .}}
<!-- 头像直连 R2：crossorigin 让 favicon 也以 CORS 模式请求，确保浏览器缓存的响应都带 ACAO；
     ?v=2 击穿历史上被「无 ACAO 响应」污染的缓存条目 -->
<link rel="shortcut icon"
      href="{{.PageUser.Avatar}}?v=2" crossorigin="anonymous"/>
<link rel="apple-touch-icon"
      href="{{.PageUser.Avatar}}?v=2" crossorigin="anonymous"/>
<link rel="icon" sizes="192x192"
      href="{{.PageUser.Avatar}}?v=2" crossorigin="anonymous">

<style>
  .password-card {
      max-width: 450px;
      margin: 0 auto;
      margin-top: 50px;
  }
  .password-icon {
      text-align: center;
      font-size: 3em;
      color: #faa05a;
      margin-bottom: 15px;
  }
  .password-desc {
      text-align: center;
      color: #666;
      margin-bottom: 25px;
  }
</style>

<div class="uk-container uk-container-xsmall">
  <div class="uk-card uk-card-default uk-card-body password-card uk-box-shadow-medium">
    <div class="password-icon">
      <span uk-icon="icon: lock; ratio: 3"></span>
    </div>
    <h3 class="uk-text-center uk-margin-small-top">{{ .PageUser.Name }}{{t .LangCode "site.logoSuffix"}}</h3>
    <p class="password-desc">{{t .LangCode "password.desc"}}</p>

    {{template "base/alert" .}}
    
    <form method="post" action="/_/{{.PageUser.Domain}}/password" class="uk-form-stacked">
      {{ .CSRFTokenHTML }}
      <input type="hidden" name="next" value="{{.Next}}">
      <div class="uk-margin">
        <div class="uk-inline uk-width-1-1">
          <span class="uk-form-icon uk-form-icon" uk-icon="icon: lock"></span>
          <input name="password" class="uk-input uk-form-large" type="password" placeholder="{{t .LangCode "password.input"}}" autofocus>
        </div>
      </div>
      <div class="uk-margin">
        <button type="submit" class="uk-button uk-button-primary uk-width-1-1 uk-button-large">
          <span uk-icon="icon: sign-in"></span> {{t .LangCode "password.enter"}}
        </button>
      </div>
    </form>

    <div class="uk-text-center uk-margin-small-top">
      <a href="/" class="uk-text-muted uk-text-small">← {{t .LangCode "common.backHome"}}</a>
    </div>
  </div>
</div>

{{template "base/footer" .}}