/**
 * 가입 완료 (PRD §3.5.4)
 */
import { useNavigate } from 'react-router-dom';
import styled from 'styled-components';

const Page = styled.div`
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 24px;
  text-align: center;
`;

const Icon = styled.div`
  font-size: 64px;
  margin-bottom: 20px;
`;

const Title = styled.h1`
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 12px;
`;

const Sub = styled.p`
  color: var(--pcnt-text-sub);
  margin-bottom: 32px;
`;

export default function SignUpComplete() {
  const nav = useNavigate();
  return (
    <Page>
      <Icon>✅</Icon>
      <Title>가입이 완료되었습니다</Title>
      <Sub>pCNT를 시작하려면 추가 정보를 입력해 주세요.</Sub>
      <button className="btn-primary" onClick={() => nav('/signin')}>
        로그인 후 시작하기
      </button>
    </Page>
  );
}