<!DOCTYPE html>
<html lang="pt">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Instruções do Exame - INSUTEC</title>
    <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
    <style>
        body { font-family: Arial, sans-serif; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; padding: 15px; box-sizing: border-box; flex-direction: column; }
        .logo-container { text-align: center; margin-bottom: 20px; }
        .logo-container img { max-width: 200px; height: auto; }
        .container { background-color: #fff; padding: 30px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); width: 100%; max-width: 700px; }
        h1 { text-align: center; color: #003366; }
        .rules-list { list-style-type: none; padding-left: 0; }
        .rules-list li { margin-bottom: 15px; padding-left: 35px; position: relative; }
        .rules-list li::before { content: '⚠️'; position: absolute; left: 0; font-size: 20px; }
        .regra-critica { color: #dc3545; font-weight: bold; }
        .acceptance { margin-top: 20px; font-weight: bold; }
        button { width: 100%; background-color: #28a745; color: white; padding: 15px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; margin-top: 20px; }
        button:hover { background-color: #218838; }
        button:disabled { background-color: #ccc; cursor: not-allowed; }
        footer { margin-top: 20px; padding: 10px; color: #888; text-align: center; font-size: 14px; }
    </style>
</head>
<body>
    <div class="logo-container">
        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Logotipo eD Consulting">
    </div>
    <div class="container">
        <h1>Instruções e Regras do Exame</h1>
        <p>Bem-vindo(a), <strong>{{ nome_candidato }}</strong>. Por favor, leia atentamente as regras abaixo antes de iniciar a sua prova para o curso de <strong>{{ curso_desejado }}</strong>.</p>
        
        <ul class="rules-list">
            <li>O teste tem a duração máxima de <strong>45 minutos</strong>. O tempo restante será visível no canto superior do ecrã. A prova será submetida automaticamente quando o tempo terminar.</li>
            <li class="regra-critica">É estritamente proibido sair do foco da página do exame (mudar de aba, minimizar a janela ou abrir outro programa). Se o sistema detetar que saiu da página, o seu teste será imediatamente cancelado e submetido com a nota zero (0).</li>
            <li>A prova consiste em 5 perguntas de múltipla escolha, selecionadas aleatoriamente de um banco de dados.</li>
            <li>Certifique-se de que tem uma ligação à internet estável. Problemas de conexão são da responsabilidade do candidato.</li>
        </ul>

        <form action="/comecar-exame" method="post">
            <input type="hidden" name="candidato_id" value="{{ candidato_id }}">
            <input type="hidden" name="teste_id" value="{{ teste_id }}">
            <input type="hidden" name="nome_completo" value="{{ nome_candidato }}">
            <input type="hidden" name="numero_candidato" value="{{ numero_candidato }}">
            <input type="hidden" name="curso_desejado" value="{{ curso_desejado }}">

            <div class="acceptance">
                <label>
                    <input type="checkbox" id="accept-rules" onchange="document.getElementById('start-button').disabled = !this.checked;">
                    Li, compreendi e aceito as regras do exame.
                </label>
            </div>
            
            <button type="submit" id="start-button" disabled>Começar o Exame</button>
        </form>
    </div>
    <footer>
        &copy; 2025 eD Consulting. Todos os direitos reservados.
    </footer>
</body>
</html><!DOCTYPE html>
<html lang="pt">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Instruções do Exame - INSUTEC</title>
    <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
    <style>
        body { font-family: Arial, sans-serif; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; padding: 15px; box-sizing: border-box; flex-direction: column; }
        .logo-container { text-align: center; margin-bottom: 20px; }
        .logo-container img { max-width: 200px; height: auto; }
        .container { background-color: #fff; padding: 30px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); width: 100%; max-width: 700px; }
        h1 { text-align: center; color: #003366; }
        .rules-list { list-style-type: none; padding-left: 0; }
        .rules-list li { margin-bottom: 15px; padding-left: 35px; position: relative; }
        .rules-list li::before { content: '⚠️'; position: absolute; left: 0; font-size: 20px; }
        .regra-critica { color: #dc3545; font-weight: bold; }
        .acceptance { margin-top: 20px; font-weight: bold; }
        button { width: 100%; background-color: #28a745; color: white; padding: 15px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; margin-top: 20px; }
        button:hover { background-color: #218838; }
        button:disabled { background-color: #ccc; cursor: not-allowed; }
        footer { margin-top: 20px; padding: 10px; color: #888; text-align: center; font-size: 14px; }
    </style>
</head>
<body>
    <div class="logo-container">
        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Logotipo eD Consulting">
    </div>
    <div class="container">
        <h1>Instruções e Regras do Exame</h1>
        <p>Bem-vindo(a), <strong>{{ nome_candidato }}</strong>. Por favor, leia atentamente as regras abaixo antes de iniciar a sua prova para o curso de <strong>{{ curso_desejado }}</strong>.</p>
        
        <ul class="rules-list">
            <li>O teste tem a duração máxima de <strong>45 minutos</strong>. O tempo restante será visível no canto superior do ecrã. A prova será submetida automaticamente quando o tempo terminar.</li>
            <li class="regra-critica">É estritamente proibido sair do foco da página do exame (mudar de aba, minimizar a janela ou abrir outro programa). Se o sistema detetar que saiu da página, o seu teste será imediatamente cancelado e submetido com a nota zero (0).</li>
            <li>A prova consiste em 5 perguntas de múltipla escolha, selecionadas aleatoriamente de um banco de dados.</li>
            <li>Certifique-se de que tem uma ligação à internet estável. Problemas de conexão são da responsabilidade do candidato.</li>
        </ul>

        <form action="/comecar-exame" method="post">
            <input type="hidden" name="candidato_id" value="{{ candidato_id }}">
            <input type="hidden" name="teste_id" value="{{ teste_id }}">
            <input type="hidden" name="nome_completo" value="{{ nome_candidato }}">
            <input type="hidden" name="numero_candidato" value="{{ numero_candidato }}">
            <input type="hidden" name="curso_desejado" value="{{ curso_desejado }}">

            <div class="acceptance">
                <label>
                    <input type="checkbox" id="accept-rules" onchange="document.getElementById('start-button').disabled = !this.checked;">
                    Li, compreendi e aceito as regras do exame.
                </label>
            </div>
            
            <button type="submit" id="start-button" disabled>Começar o Exame</button>
        </form>
    </div>
    <footer>
        &copy; 2025 eD Consulting. Todos os direitos reservados.
    </footer>
</body>
</html>
