<?php
$concordanciaEnviada = false;
$erroConcordancia = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST'
    && ($_POST['acao'] ?? '') === 'aceitar_termos') {

    if (($_POST['aceite_termos'] ?? '') === 'sim') {
        $concordanciaEnviada = true;
    } else {
        $erroConcordancia = 'Você precisa concordar com os termos para continuar.';
    }
}
?>
<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css"
        rel="stylesheet"
        integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB"
        crossorigin="anonymous">

    <link rel="stylesheet" href="../css/cadastro.css">

    <title>SENSI | Criar Conta</title>
</head>

<body>

    <div vw class="enabled">
        <div vw-access-button class="active"></div>

        <div vw-plugin-wrapper>
            <div class="vw-plugin-top-wrapper"></div>
        </div>
    </div>

    <script src="https://vlibras.gov.br/app/vlibras-plugin.js"></script>

    <script>
        new window.VLibras.Widget('https://vlibras.gov.br/app');
    </script>

    <main>

        <div class="container-cadastro">

            <img class="logo-altrepository"
                src="../images/logorepositorio.png"
                alt="Logo SESI SENAI">

            <div class="perfil-container">

                <img class="circulo-azul"
                    src="../images/circuloazulperfil.png"
                    alt="Imagem de perfil">

                <img class="icone-perfil"
                    src="../images/perfil.png"
                    alt="Ícone de perfil">

            </div>

            <form>

                <div class="nome_completo">
                    <label for="inputname" class="form-label">
                        Nome Completo
                    </label>

                    <input type="text"
                        class="form-control"
                        id="inputname">
                </div>

                <div class="email_academico">
                    <label for="inputemail" class="form-label">
                        E-mail acadêmico
                    </label>

                    <input type="email"
                        class="form-control"
                        id="inputemail">
                </div>

                <div class="criacao_senha">
                    <label for="inputpassword" class="form-label">
                        Criar senha
                    </label>

                    <input type="password"
                        class="form-control"
                        id="inputpassword">
                </div>

                <div class="confirmacao_senha">
                    <label for="inputconfirmpassword" class="form-label">
                        Confirmar senha
                    </label>

                    <input type="password"
                        class="form-control"
                        id="inputconfirmpassword">
                </div>

                <button type="submit" class="btn btn-primary">
                    Cadastre-se
                </button>

                <p>
                    Já tem uma conta?
                    <a href="login.html" class="pglogin">Faça login</a>
                </p>


<section class="terms-acceptance" id="concordar-termos">
  
     <div class="hero-icon" aria-hidden="true"> <i class="bi bi-file-earmark-lock2"></i></div>

    <div class="acceptance-content">
        <h2>Concordar com os Termos e Condições</h2>

        <p>
            Antes de continuar utilizando o SENSI, leia os termos apresentados
            nesta página. Ao concordar, você confirma que leu e compreendeu
            as regras de utilização da plataforma.
        </p>

        <?php if ($concordanciaEnviada): ?>

            <div class="acceptance-success" role="status">
                <i class="bi bi-check-circle-fill" aria-hidden="true"></i>
                <span>
                    Você concordou com os Termos e Condições do SENSI.
                </span>
            </div>

        <?php else: ?>

            <?php if ($erroConcordancia !== ''): ?>
                <p class="acceptance-error" role="alert">
                    <?= escapar($erroConcordancia) ?>
                </p>
            <?php endif; ?>

            <form method="POST" action="#concordar-termos"
                  class="acceptance-form">

                <input type="hidden" name="acao" value="aceitar_termos">

                <label class="acceptance-checkbox">
                    <input
                        type="checkbox"
                        name="aceite_termos"
                        value="sim"
                        required
                    >

                    <span>
                        Li e concordo com os Termos e Condições de uso
                        do SENSI.
                    </span>
                </label>

                <button type="submit" class="acceptance-button">
                    <i class="bi bi-check2-circle" aria-hidden="true"></i>
                    Concordar com os termos
                </button>
            </form>

        <?php endif; ?>
    </div>
</section>

            </form>

        </div>

     

    </main>

<script src="../js/cadastro.js"></script>
</body>

</html>