// login.jsx — вход для незалогиненного. Единственный способ — Hakku ID (auth.hakku.ai):
// почта + код на стороне hakku, возврат сюда уже с сессией. Доступ дальше решает
// таблица участников. Публичные материалы базы открыты и без входа.

function Login({ nav }) {
  const kb = useKB();
  const qs = new URLSearchParams(location.search);
  const ssoErr = qs.get('sso_error');
  const open = ((kb && kb.items) || []).filter(i => !i.locked).slice(0, 4);
  return (
    <div className="os-login cm-login">
      <div className="os-login-card">
        <CoBrand size={26}/>
        <div style={{ marginTop: 14 }}>
          <div className="os-eyebrow" style={{ marginBottom: 12 }}>Сообщество хакку · закрытая часть</div>
          <h1 className="os-h1" style={{ fontSize:'clamp(28px, 8vw, 38px)', marginBottom: 14, overflowWrap:'break-word' }}>Вход в сообщество хакку.</h1>
          <p className="os-sub" style={{ maxWidth: 420 }}>
            База знаний основателей и участников, подборки инструментов, кейсы и расписание эфиров.
            Доступ — по подписке Enthusiast или PRO.
          </p>
        </div>
        <div style={{ marginTop: 22 }}>
          <LoginButton className="os-btn block" style={{ height: 52 }} label="Войти через Hakku ID →"/>
          <div style={{ fontSize: 13, color:'var(--ink-55)', lineHeight: 1.55, marginTop: 10 }}>
            Один аккаунт для сообщества и коворка. Понадобится только почта — пришлём код.
            Входите с той почтой, которую указали при оплате.
          </div>
          {ssoErr && <div className="os-login-err show" role="alert" style={{ marginTop: 12 }}>Не получилось войти через Hakku ID — попробуйте ещё раз.</div>}
        </div>

        <div style={{ marginTop: 26, paddingTop: 20, borderTop:'1px solid var(--ink-12)' }}>
          <div className="os-eyebrow" style={{ marginBottom: 10 }}>Открыто без входа</div>
          <div className="cm-login-list">
            {open.map(it => (
              <a key={it.slug} href={`/os/?view=kb&m=${it.slug}`} onClick={(e)=>{ e.preventDefault(); nav('kb', { m: it.slug }); }}>
                <span>{it.title}</span>{Icons.chev()}
              </a>
            ))}
          </div>
          <a className="cm-more" href="/os/?view=kb" onClick={(e)=>{ e.preventDefault(); nav('kb'); }}
             style={{ display:'inline-block', marginTop: 12 }}>Вся база знаний →</a>
        </div>

        <div style={{ marginTop: 22, fontSize: 13, color:'var(--ink-55)', lineHeight: 1.55 }}>
          Ещё не в сообществе? <a className="os-wiki-link" href={CFG().pricing_url} target="_blank" rel="noopener noreferrer">Тарифы</a>{' '}
          или <a className="os-wiki-link" href={CFG().quiz_url} target="_blank" rel="noopener noreferrer">тест «Каких ИИ-навыков не хватает»</a> — подскажет тариф.
        </div>
        <div style={{ marginTop: 18, fontSize: 12, color:'var(--ink-40)' }}>хакку · сообщество практиков ИИ · 2026</div>
      </div>
    </div>
  );
}
window.Login = Login;