<?php
// application/views/auth/registo_proponente.php
// Acesso público — Registo de Proponente
?>
<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=yes">
<meta name="description" content="SGLA - Registo de Proponente">
<title>SGLA &mdash; Registo de Proponente</title>
<link rel="shortcut icon" type="image/x-icon" href="<?php echo base_url('assets/img/favicon.ico'); ?>">
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700&family=DM+Serif+Display:ital@0;1&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet">
<style>
:root{
  --v900:#1A3E12;--v800:#24571A;--v700:#2E5A1A;--v500:#45752E;
  --v400:#5B8C20;--v300:#75A636;--v200:#8FC96B;--v100:#B8D99A;--v50:#DAEAC5;
  --t500:#7A4E26;--t300:#B87B42;--t100:#EDD8B8;--t50:#F8F0E5;
  --a500:#085090;--a300:#2090C8;--a100:#A8D8EC;--a50:#E2F0F6;
  --danger:#d93025;--danger-bg:#fef2f0;
  --ease:.25s cubic-bezier(.4,0,.2,1);
  --r10:10px;--r14:14px;--r20:20px;--r28:28px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'DM Sans',system-ui,sans-serif;
  background:#1a8fd1;min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  padding:1.5rem;overflow-x:hidden;position:relative;
}
canvas#cv{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 110% 110% at 50% 50%,transparent 28%,rgba(0,0,0,.42) 100%);}
.glass-band{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(6,20,4,.20) 30%,rgba(4,16,2,.34) 50%,rgba(6,20,4,.20) 70%,transparent 100%);}

/* ── CARD PRINCIPAL ── */
.reg-card{
  position:relative;z-index:10;
  width:100%;max-width:860px;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(50px)saturate(2.0)brightness(1.05);
  -webkit-backdrop-filter:blur(50px)saturate(2.0)brightness(1.05);
  border:1px solid rgba(255,255,255,.80);
  border-top:2px solid rgba(255,255,255,.96);
  border-left:2px solid rgba(255,255,255,.90);
  border-radius:var(--r28);
  box-shadow:
    0 1px 0 rgba(255,255,255,.90) inset,
    0 40px 90px rgba(0,0,0,.22),
    0 12px 32px rgba(0,0,0,.12),
    0  3px  6px rgba(0,0,0,.08);
  overflow:hidden;
  animation:rise .8s cubic-bezier(.4,0,.2,1) both;
}
@keyframes rise{from{opacity:0;transform:translateY(32px)scale(.97);}to{opacity:1;transform:none;}}

/* Faixa tricolor no topo */
.reg-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;z-index:5;
  background:linear-gradient(90deg,var(--v400) 0% 33%,var(--t300) 33% 66%,var(--a300) 66% 100%);
}

/* ── HEADER ── */
.card-header-reg{
  padding:1.8rem 2.4rem 1.4rem;
  border-bottom:1px solid rgba(36,87,26,.10);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:linear-gradient(135deg,
    rgba(143,201,107,.08) 0%,
    rgba(255,255,255,.0) 100%);
}
.header-brand{display:flex;align-items:center;gap:.9rem;}
.header-ico{
  width:44px;height:44px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(135deg,var(--v800),var(--v400));
  border:1.5px solid rgba(255,255,255,.30);
  box-shadow:0 4px 16px rgba(36,87,26,.28);
  display:flex;align-items:center;justify-content:center;
}
.header-ico i{color:rgba(255,255,255,.94);font-size:1.1rem;}
.header-name{font-size:1rem;font-weight:700;color:var(--v800);letter-spacing:.2px;}
.header-sub{font-size:.58rem;color:rgba(36,87,26,.50);margin-top:1px;}

.header-step{
  display:flex;align-items:center;gap:.35rem;
  background:rgba(69,117,46,.08);border:1px solid rgba(69,117,46,.16);
  border-radius:99px;padding:.25rem .85rem;
  font-size:.60rem;font-weight:600;color:var(--v500);
}
.header-step i{font-size:.55rem;}

/* ── BODY ── */
.card-body-reg{padding:2rem 2.4rem 2.4rem;}

.reg-title{
  font-family:'DM Serif Display',Georgia,serif;
  font-size:1.6rem;font-weight:400;color:var(--v800);
  letter-spacing:-.4px;margin-bottom:.3rem;
}
.reg-title em{font-style:italic;color:var(--v400);}
.reg-sub{font-size:.74rem;color:rgba(36,87,26,.55);margin-bottom:2rem;line-height:1.6;}

/* Progress steps */
.steps{
  display:flex;align-items:center;gap:0;
  margin-bottom:2rem;
  background:rgba(36,87,26,.04);
  border:1px solid rgba(36,87,26,.08);
  border-radius:var(--r14);padding:.6rem .8rem;
}
.step{
  flex:1;display:flex;align-items:center;gap:.5rem;
  font-size:.64rem;font-weight:600;color:rgba(36,87,26,.40);
  position:relative;transition:color .3s;
}
.step.active{color:var(--v500);}
.step.done{color:var(--v300);}
.step-num{
  width:22px;height:22px;border-radius:50%;flex-shrink:0;
  background:rgba(36,87,26,.10);
  display:flex;align-items:center;justify-content:center;
  font-size:.6rem;font-weight:700;transition:all .3s;
}
.step.active .step-num{background:var(--v500);color:#fff;box-shadow:0 2px 8px rgba(69,117,46,.35);}
.step.done  .step-num{background:var(--v200);color:var(--v800);}
.step-connector{flex:1;height:1.5px;background:rgba(36,87,26,.12);margin:0 .3rem;max-width:60px;}
.step.done + .step .step-connector,.step.active + .step .step-connector{}

/* Alert */
.sg-alert{display:flex;align-items:flex-start;gap:.45rem;padding:.6rem .8rem;border-radius:10px;
  font-size:.70rem;font-weight:500;margin-bottom:1.2rem;border-left:3px solid transparent;}
.sg-alert.danger{background:var(--danger-bg);border-left-color:var(--danger);color:var(--danger);}
.sg-alert.ok{background:var(--v50);border-left-color:var(--v500);color:var(--v700);}
.sg-alert.info{background:var(--a50);border-left-color:var(--a300);color:var(--a500);}

/* Form sections */
.form-section{margin-bottom:1.8rem;}
.section-label{
  display:flex;align-items:center;gap:.5rem;
  font-size:.72rem;font-weight:700;color:var(--v800);
  margin-bottom:1.1rem;padding-bottom:.5rem;
  border-bottom:2px solid var(--v50);
}
.section-label .sec-num{
  width:22px;height:22px;border-radius:6px;
  background:linear-gradient(135deg,var(--v800),var(--v400));
  color:#fff;font-size:.62rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.section-label i{color:var(--v400);font-size:.78rem;}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:.8rem;}
.form-row.single{grid-template-columns:1fr;}
.form-row.triple{grid-template-columns:1fr 1fr 1fr;}

.fg{display:flex;flex-direction:column;}
.flbl{font-size:.66rem;font-weight:600;color:var(--v800);margin-bottom:.28rem;
  display:flex;align-items:center;gap:.3rem;}
.flbl .req{color:var(--danger);font-size:.65rem;}
.flbl .tip{font-size:.58rem;font-weight:400;color:rgba(36,87,26,.45);margin-left:.3rem;}

.fw{position:relative;}
.f-icon-i{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);
  color:rgba(36,87,26,.30);font-size:.68rem;pointer-events:none;}
.finp,.fsel{
  width:100%;padding:.60rem .78rem .60rem 2.1rem;
  background:rgba(255,255,255,.65);
  border:1.5px solid rgba(255,255,255,.82);
  border-bottom:1.5px solid rgba(36,87,26,.14);
  border-right:1.5px solid rgba(36,87,26,.08);
  border-radius:10px;font-size:.76rem;font-family:inherit;color:var(--v800);
  outline:none;
  box-shadow:0 1px 0 rgba(255,255,255,.72) inset;
  transition:all .22s ease;
  -webkit-appearance:none;appearance:none;
}
.fsel{padding-left:2.1rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2345752E' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center;}
.finp::placeholder{color:rgba(36,87,26,.25);}
.finp:focus,.fsel:focus{
  background:rgba(255,255,255,.90);border-color:var(--v300);
  box-shadow:0 0 0 3px rgba(117,166,54,.15),0 1px 0 rgba(255,255,255,.82) inset;
}
.finp.error,.fsel.error{border-color:var(--danger);box-shadow:0 0 0 2px rgba(217,48,37,.12);}

/* Upload field */
.upload-area{
  position:relative;
  border:2px dashed rgba(36,87,26,.20);
  border-radius:10px;padding:1rem;
  background:rgba(255,255,255,.50);
  text-align:center;cursor:pointer;
  transition:all .22s ease;
  display:flex;align-items:center;gap:.8rem;
  justify-content:center;
}
.upload-area:hover{border-color:var(--v300);background:rgba(117,166,54,.05);}
.upload-area.has-file{border-color:var(--v300);background:rgba(117,166,54,.08);border-style:solid;}
.upload-area input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
.upload-icon{color:var(--v400);font-size:1.2rem;flex-shrink:0;}
.upload-text{font-size:.68rem;color:rgba(36,87,26,.55);text-align:left;}
.upload-text strong{display:block;font-size:.72rem;color:var(--v800);font-weight:600;margin-bottom:1px;}
.upload-text span{color:var(--v400);}

/* Checkbox terms */
.terms-row{
  display:flex;align-items:flex-start;gap:.6rem;
  padding:1rem 1.2rem;
  background:rgba(36,87,26,.04);
  border:1px solid rgba(36,87,26,.10);
  border-radius:10px;margin-top:1.4rem;
}
.terms-box{
  width:16px;height:16px;min-width:16px;
  border:2px solid rgba(36,87,26,.25);border-radius:4px;
  background:rgba(255,255,255,.60);cursor:pointer;
  position:relative;transition:all .2s;margin-top:1px;
}
.terms-box.checked{background:var(--v500);border-color:var(--v500);}
.terms-box.checked::after{content:'';position:absolute;left:2px;top:-.5px;width:8px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);}
.terms-text{font-size:.66rem;color:rgba(36,87,26,.65);line-height:1.6;}
.terms-text a{color:var(--v400);text-decoration:none;font-weight:600;}
.terms-text a:hover{color:var(--v700);text-decoration:underline;}

/* Action row */
.action-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;margin-top:1.8rem;flex-wrap:wrap;
}
.btn-back{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.72rem;font-weight:500;color:rgba(36,87,26,.50);
  text-decoration:none;padding:.5rem 0;transition:color .2s;
  background:none;border:none;cursor:pointer;
}
.btn-back:hover{color:var(--v500);}

.btn-submit{
  padding:.72rem 2.2rem;
  background:linear-gradient(135deg,var(--v900) 0%,var(--v500) 50%,var(--v300) 100%);
  color:#fff;border:none;border-radius:10px;
  font-size:.8rem;font-weight:700;font-family:inherit;cursor:pointer;
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  box-shadow:0 5px 22px rgba(36,87,26,.32),0 1px 4px rgba(0,0,0,.10);
  transition:all .24s ease;
}
.btn-submit::before{content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.14),transparent 55%);}
.btn-submit .sw{position:absolute;top:0;height:100%;width:50%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  animation:sw 3s ease-in-out infinite;}
@keyframes sw{0%{left:-60%;}100%{left:125%;}}
.btn-submit:hover{
  background:linear-gradient(135deg,var(--v900) 0%,var(--v700) 50%,var(--v400) 100%);
  transform:translateY(-1px);box-shadow:0 10px 32px rgba(36,87,26,.42);}
.btn-submit:active{transform:none;}
.btn-submit:disabled{opacity:.65;pointer-events:none;}

/* Divider */
.fdiv{display:flex;align-items:center;gap:.6rem;margin:1.4rem 0 1rem;}
.fdiv::before,.fdiv::after{content:'';flex:1;height:1px;background:rgba(36,87,26,.10);}
.fdiv span{font-size:.60rem;color:rgba(36,87,26,.40);white-space:nowrap;}

/* Success state */
.success-wrap{
  text-align:center;padding:2.5rem 1.5rem;
  display:none;
}
.success-ico{
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,var(--v700),var(--v300));
  box-shadow:0 8px 28px rgba(36,87,26,.30);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1.4rem;
}
.success-ico i{color:#fff;font-size:1.8rem;}
.success-h{font-family:'DM Serif Display',Georgia,serif;font-size:1.6rem;color:var(--v800);margin-bottom:.5rem;}
.success-p{font-size:.76rem;color:rgba(36,87,26,.58);line-height:1.7;max-width:420px;margin:0 auto 1.8rem;}
.btn-login-go{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.72rem 2rem;
  background:linear-gradient(135deg,var(--v900),var(--v400));
  color:#fff;border:none;border-radius:10px;
  font-size:.78rem;font-weight:700;font-family:inherit;
  text-decoration:none;cursor:pointer;
  box-shadow:0 4px 18px rgba(36,87,26,.28);
  transition:all .24s ease;
}
.btn-login-go:hover{transform:translateY(-1px);}

/* Responsive */
@media(max-width:700px){
  .form-row{grid-template-columns:1fr;}
  .form-row.triple{grid-template-columns:1fr;}
  .card-body-reg,.card-header-reg{padding-left:1.4rem;padding-right:1.4rem;}
  .reg-title{font-size:1.3rem;}
  .action-row{flex-direction:column-reverse;align-items:stretch;}
  .btn-submit{width:100%;justify-content:center;}
}
@media(max-width:480px){
  body{padding:.8rem;}
  .card-header-reg,.card-body-reg{padding-left:1.1rem;padding-right:1.1rem;}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;}}
</style>
</head>
<body>

<canvas id="cv"></canvas>
<div class="vignette"></div>
<div class="glass-band"></div>

<div class="reg-card">

  <!-- HEADER -->
  <div class="card-header-reg">
    <div class="header-brand">
      <div class="header-ico"><i class="fas fa-leaf"></i></div>
      <div>
        <div class="header-name">SGLA — Registo de Proponente</div>
        <div class="header-sub">MAAP &mdash; Ministerio da Agricultura, Ambiente e Pescas</div>
      </div>
    </div>
    <div class="header-step">
      <i class="fas fa-user-plus"></i> Novo Registo
    </div>
  </div>

  <!-- BODY -->
  <?php
  $registo_ok    = $this->session->flashdata('registo_ok_email');
  $registo_nome  = $this->session->flashdata('registo_ok_nome');
  $show_success  = !empty($registo_ok);
  ?>

  <div class="card-body-reg" id="formWrap" <?= $show_success ? 'style="display:none"' : '' ?>>

    <div class="reg-title">Criar conta de <em>Proponente</em></div>
    <p class="reg-sub">
      Preencha o formulário abaixo para registar a sua empresa no sistema SGLA.
      O registo fica pendente de aprovação pela equipa técnica do MAAP. Após aprovação,
      receberá as credenciais de acesso por email.
    </p>

    <!-- Progress -->
    <div class="steps">
      <div class="step active" id="s1">
        <div class="step-num">1</div>
        <span>Dados da Empresa</span>
      </div>
      <div class="step-connector"></div>
      <div class="step" id="s2">
        <div class="step-num">2</div>
        <span>Responsável</span>
      </div>
      <div class="step-connector"></div>
      <div class="step" id="s3">
        <div class="step-num">3</div>
        <span>Confirmação</span>
      </div>
    </div>

    <!-- Flash messages -->
    <?php if ($this->session->flashdata('error')): ?>
    <div class="sg-alert danger">
      <i class="fas fa-exclamation-triangle"></i>
      <span><?php echo $this->session->flashdata('error'); ?></span>
    </div>
    <?php endif; ?>
    <?php if ($this->session->flashdata('success')): ?>
    <div class="sg-alert ok">
      <i class="fas fa-check-circle"></i>
      <span><?php echo $this->session->flashdata('success'); ?></span>
    </div>
    <?php endif; ?>

    <form id="regForm"
          action="<?php echo site_url('admin/auth/registo/processar'); ?>"
          method="post"
          enctype="multipart/form-data"
          novalidate>

      <?php echo $this->security->get_csrf_token_name(); ?>=<?php echo $this->security->get_csrf_hash(); ?>

      <!-- ── SECÇÃO 1: Empresa ── -->
      <div class="form-section" id="sec1">
        <div class="section-label">
          <div class="sec-num">1</div>
          <i class="fas fa-building"></i>
          Informações da Empresa / Entidade
        </div>

        <div class="form-row">
          <div class="fg">
            <label class="flbl">
              Nome completo da empresa <span class="req">*</span>
            </label>
            <div class="fw">
              <i class="fas fa-building f-icon-i"></i>
              <input class="finp" type="text" name="nome_empresa" id="nome_empresa"
                     value="<?php echo set_value('nome_empresa'); ?>"
                     placeholder="Ex: Techcontrol Moçambique, LDA"
                     required maxlength="500">
            </div>
          </div>
          <div class="fg">
            <label class="flbl">
              NUIT <span class="req">*</span>
              <span class="tip">(9 dígitos)</span>
            </label>
            <div class="fw">
              <i class="fas fa-id-card f-icon-i"></i>
              <input class="finp" type="text" name="nuit" id="nuit"
                     value="<?php echo set_value('nuit'); ?>"
                     placeholder="000000000"
                     maxlength="9" pattern="[0-9]{9}"
                     required>
            </div>
          </div>
        </div>

        <div class="form-row single">
          <div class="fg">
            <label class="flbl">
              <i class="fas fa-file-pdf" style="color:#d93025;margin-right:.25rem;"></i>
              Comprovativo do NUIT (PDF) <span class="req">*</span>
            </label>
            <div class="upload-area" id="uploadArea">
              <input type="file" name="nuit_ficheiro" id="nuitFile"
                     accept=".pdf,application/pdf" required>
              <div class="upload-icon"><i class="fas fa-cloud-upload-alt"></i></div>
              <div class="upload-text">
                <strong id="uploadLabel">Clique para seleccionar o ficheiro PDF</strong>
                <span>Apenas ficheiros PDF &mdash; máximo 5MB</span>
              </div>
            </div>
          </div>
        </div>

        <div class="form-row single">
          <div class="fg">
            <label class="flbl">
              Tipo de actividade / sector <span class="req">*</span>
            </label>
            <div class="fw">
              <i class="fas fa-industry f-icon-i"></i>
              <select class="fsel" name="setor_atividade" id="setor_atividade" required>
                <option value="">Seleccionar sector de actividade</option>
                <optgroup label="Recursos Naturais e Ambiente">
                  <option value="Mineração" <?php echo set_select('setor_atividade','Mineração'); ?>>Mineração</option>
                  <option value="Hidrocarbonetos" <?php echo set_select('setor_atividade','Hidrocarbonetos'); ?>>Hidrocarbonetos (Petróleo e Gás)</option>
                  <option value="Florestal" <?php echo set_select('setor_atividade','Florestal'); ?>>Florestal e Madeireiro</option>
                  <option value="Pesca e Aquacultura" <?php echo set_select('setor_atividade','Pesca e Aquacultura'); ?>>Pesca e Aquacultura</option>
                  <option value="Biodiversidade" <?php echo set_select('setor_atividade','Biodiversidade'); ?>>Conservação e Biodiversidade</option>
                </optgroup>
                <optgroup label="Infraestrutura e Construção">
                  <option value="Construção Civil" <?php echo set_select('setor_atividade','Construção Civil'); ?>>Construção Civil</option>
                  <option value="Imobiliário" <?php echo set_select('setor_atividade','Imobiliário'); ?>>Imobiliário e Desenvolvimento Urbano</option>
                  <option value="Transportes e Logística" <?php echo set_select('setor_atividade','Transportes e Logística'); ?>>Transportes e Logística</option>
                  <option value="Energia" <?php echo set_select('setor_atividade','Energia'); ?>>Energia (Eléctrica, Solar, Hídrica)</option>
                  <option value="Telecomunicações" <?php echo set_select('setor_atividade','Telecomunicações'); ?>>Telecomunicações</option>
                </optgroup>
                <optgroup label="Indústria e Agro-negócio">
                  <option value="Agricultura e Pecuária" <?php echo set_select('setor_atividade','Agricultura e Pecuária'); ?>>Agricultura e Pecuária</option>
                  <option value="Indústria Transformadora" <?php echo set_select('setor_atividade','Indústria Transformadora'); ?>>Indústria Transformadora</option>
                  <option value="Agro-processamento" <?php echo set_select('setor_atividade','Agro-processamento'); ?>>Agro-processamento e Alimentação</option>
                  <option value="Química e Farmacêutica" <?php echo set_select('setor_atividade','Química e Farmacêutica'); ?>>Química e Farmacêutica</option>
                </optgroup>
                <optgroup label="Serviços e Outros">
                  <option value="Turismo e Hotelaria" <?php echo set_select('setor_atividade','Turismo e Hotelaria'); ?>>Turismo e Hotelaria</option>
                  <option value="Saúde" <?php echo set_select('setor_atividade','Saúde'); ?>>Saúde e Serviços Médicos</option>
                  <option value="Educação" <?php echo set_select('setor_atividade','Educação'); ?>>Educação e Formação</option>
                  <option value="Consultoria Ambiental" <?php echo set_select('setor_atividade','Consultoria Ambiental'); ?>>Consultoria Ambiental</option>
                  <option value="Outro" <?php echo set_select('setor_atividade','Outro'); ?>>Outro</option>
                </optgroup>
              </select>
            </div>
          </div>
        </div>
      </div><!-- /sec1 -->

      <!-- ── SECÇÃO 2: Responsável ── -->
      <div class="form-section" id="sec2">
        <div class="section-label">
          <div class="sec-num">2</div>
          <i class="fas fa-user-tie"></i>
          Informações do Responsável / Representante Legal
        </div>

        <div class="form-row single">
          <div class="fg">
            <label class="flbl">
              Nome completo do responsável <span class="req">*</span>
            </label>
            <div class="fw">
              <i class="fas fa-user f-icon-i"></i>
              <input class="finp" type="text" name="nome_responsavel" id="nome_responsavel"
                     value="<?php echo set_value('nome_responsavel'); ?>"
                     placeholder="Nome completo do representante legal"
                     required maxlength="350">
            </div>
          </div>
        </div>

        <div class="form-row">
          <div class="fg">
            <label class="flbl">
              Número de telefone <span class="req">*</span>
            </label>
            <div class="fw">
              <i class="fas fa-phone f-icon-i"></i>
              <input class="finp" type="tel" name="telefone" id="telefone"
                     value="<?php echo set_value('telefone'); ?>"
                     placeholder="+258 84 000 0000"
                     required maxlength="20">
            </div>
          </div>
          <div class="fg">
            <label class="flbl">
              Email <span class="req">*</span>
              <span class="tip">Usado para notificações e senha</span>
            </label>
            <div class="fw">
              <i class="fas fa-envelope f-icon-i"></i>
              <input class="finp" type="email" name="email" id="email"
                     value="<?php echo set_value('email'); ?>"
                     placeholder="responsavel@empresa.co.mz"
                     required maxlength="150">
            </div>
          </div>
        </div>
      </div><!-- /sec2 -->

      <!-- ── TERMOS ── -->
      <div class="terms-row" id="termsRow">
        <div class="terms-box" id="termsBox"></div>
        <input type="checkbox" name="aceita_termos" id="aceita_termos" style="display:none;" required>
        <div class="terms-text">
          Declaro que as informações prestadas são verdadeiras e autorizo o
          <strong>MAAP / SGLA</strong> a processar os meus dados para efeitos de
          licenciamento ambiental, nos termos da legislação moçambicana vigente.
          <a href="<?php echo base_url('consulta_publica.php'); ?>" target="_blank">
            Ver Termos e Condições
          </a>
        </div>
      </div>

      <!-- ── ACÇÕES ── -->
      <div class="action-row">
        <a href="<?php echo site_url('admin/login'); ?>" class="btn-back">
          <i class="fas fa-arrow-left"></i> Voltar ao Login
        </a>
        <button type="submit" class="btn-submit" id="btnSubmit" disabled>
          <i class="fas fa-paper-plane" id="btnIcon"></i>
          <span id="btnText">Submeter Pedido de Registo</span>
          <div class="sw"></div>
        </button>
      </div>

    </form>

    <!-- ── DIVIDER ── -->
    <div class="fdiv"><span>já tem conta?</span></div>
    <div style="text-align:center;">
      <a href="<?php echo site_url('admin/login'); ?>"
         style="font-size:.68rem;font-weight:600;color:var(--v400);text-decoration:none;">
        <i class="fas fa-sign-in-alt" style="margin-right:.3rem;"></i>
        Aceder ao Sistema SGLA
      </a>
    </div>

  </div><!-- /formWrap -->

  <!-- SUCCESS STATE (shown after submission) -->
  <div class="success-wrap" id="successWrap" <?= $show_success ? 'style="display:block"' : '' ?>>
    <div class="success-ico"><i class="fas fa-check"></i></div>
    <div class="success-h">Pedido Submetido com <em style="font-style:italic;color:var(--v400)">Sucesso!</em></div>
    <p class="success-p">
      O seu pedido de registo foi recebido com sucesso e encontra-se em análise pela equipa técnica do MAAP.
      Receberá uma notificação no email <strong><?php echo htmlspecialchars($registo_ok ?? ''); ?></strong> assim que o registo for aprovado.
    </p>
    <a href="<?php echo base_url(); ?>" class="btn-login-go">
      <i class="fas fa-home"></i> Voltar ao Portal
    </a>
  </div>

</div><!-- /reg-card -->

<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script>
/* ── Canvas daytime forest background ── */
var cv=document.getElementById('cv'),ctx=cv.getContext('2d'),W,H,t=0;
function rsz(){W=cv.width=window.innerWidth;H=cv.height=window.innerHeight;}
window.addEventListener('resize',rsz);rsz();
var clouds=[];for(var i=0;i<9;i++)clouds.push({x:Math.random(),y:.04+Math.random()*.28,w:.12+Math.random()*.18,h:.04+Math.random()*.06,vx:(0.6e-4+Math.random()*0.8e-4)*(Math.random()>.5?1:-1),a:.72+Math.random()*.28});
var bflies=[];for(var i=0;i<14;i++)bflies.push({x:Math.random(),y:.42+Math.random()*.45,vx:(Math.random()-.5)*.0006,vy:(Math.random()-.5)*.0003,ph:Math.random()*Math.PI*2,col:['rgba(255,120,60,','rgba(255,200,40,','rgba(80,180,80,','rgba(140,80,200,'][Math.floor(Math.random()*4)],sz:3+Math.random()*3});
var birds=[];for(var i=0;i<11;i++)birds.push({x:Math.random(),y:.08+Math.random()*.25,vx:2.5e-4+Math.random()*3e-4,fp:Math.random()*Math.PI*2,sz:2.8+Math.random()*3.5});
function sky(){var g=ctx.createLinearGradient(0,0,0,H);g.addColorStop(0,'#1a8fd1');g.addColorStop(.25,'#3aade0');g.addColorStop(.55,'#74c8e8');g.addColorStop(.78,'#b8e4f0');g.addColorStop(.90,'#d8eecc');g.addColorStop(1,'#c0d890');ctx.fillStyle=g;ctx.fillRect(0,0,W,H);}
function sun(){var sx=W*.82,sy=H*.12,sr=H*.055;for(var r=0;r<4;r++){var rg=ctx.createRadialGradient(sx,sy,0,sx,sy,sr*(2.5+r*1.8));rg.addColorStop(0,'rgba(255,230,80,'+(0.06-r*.012)+')');rg.addColorStop(1,'transparent');ctx.fillStyle=rg;ctx.beginPath();ctx.arc(sx,sy,sr*(2.5+r*1.8),0,Math.PI*2);ctx.fill();}var sg=ctx.createRadialGradient(sx,sy,0,sx,sy,sr);sg.addColorStop(0,'#fff8c0');sg.addColorStop(.5,'#ffe060');sg.addColorStop(1,'#ffb820');ctx.fillStyle=sg;ctx.beginPath();ctx.arc(sx,sy,sr,0,Math.PI*2);ctx.fill();}
function cloud(cx,cy,cw,ch,a){ctx.save();ctx.globalAlpha=a;ctx.fillStyle='#fff';var bx=cx*W,by=cy*H,bw=cw*W,bh=ch*H;[0,-.28,.28,.12,-.1].forEach(function(ox,i){var oy=[.1,.1,.08,-.2,-.18][i];var ow=[.5,.32,.30,.28,.26][i];var oh=[.55,.42,.40,.38,.36][i];ctx.beginPath();ctx.ellipse(bx+ox*bw,by+oy*bh,ow*bw,oh*bh,0,0,Math.PI*2);ctx.fill();});ctx.restore();}
function doClouds(){clouds.forEach(function(c){c.x+=c.vx;if(c.x>1.25)c.x=-0.25;if(c.x<-0.25)c.x=1.25;cloud(c.x,c.y,c.w,c.h,c.a);});}
function hill(pts,col){ctx.beginPath();ctx.moveTo(0,H);pts.forEach(function(p,i){if(i===0)ctx.lineTo(p[0]*W,p[1]*H);else{var q=pts[i-1];ctx.quadraticCurveTo((q[0]+p[0])/2*W,(q[1]+p[1])/2*H-H*.018,p[0]*W,p[1]*H);}});ctx.lineTo(W,H);ctx.closePath();ctx.fillStyle=col;ctx.fill();}
function tree(x,y,h,c1,c2){var w=h*.30;var tg=ctx.createLinearGradient(x-w*.08,0,x+w*.08,0);tg.addColorStop(0,'#4a2e10');tg.addColorStop(.5,'#6b4418');tg.addColorStop(1,'#4a2e10');ctx.fillStyle=tg;ctx.fillRect(x-w*.07,y-h*.28,w*.14,h*.32);for(var l=0;l<3;l++){var ly=y-h*(.22+l*.30),lw=w*(1.05-l*.22);var cg=ctx.createRadialGradient(x-lw*.1,ly-h*.3*.36,0,x,ly,lw*.6);cg.addColorStop(0,l===0?c2:c1);cg.addColorStop(.6,c1);cg.addColorStop(1,c1);ctx.fillStyle=cg;ctx.beginPath();ctx.moveTo(x,ly-h*.34*.55);ctx.lineTo(x-lw*.5,ly+h*.07*.36);ctx.lineTo(x+lw*.5,ly+h*.07*.36);ctx.closePath();ctx.fill();}}
function treeRow(yb,th,c1,c2,n,off){for(var i=0;i<n;i++){var x=((i+off)/n)*W+Math.sin(i*1.7)*W*.014,h=th*(.65+.55*Math.abs(Math.sin(i*2.3+.4)));tree(x,yb*H,h,c1,c2);}}
function rtree(x,y,h,col){var tr=h*.18;ctx.fillStyle='#3d2408';ctx.fillRect(x-tr*.5,y-h*.25,tr,h*.28);var cg=ctx.createRadialGradient(x-h*.08,y-h*.45,0,x,y-h*.3,h*.38);cg.addColorStop(0,col);cg.addColorStop(.7,'rgba(30,80,15,.9)');cg.addColorStop(1,'rgba(10,40,5,.7)');ctx.fillStyle=cg;ctx.beginPath();ctx.ellipse(x,y-h*.30,h*.36,h*.22,0,0,Math.PI*2);ctx.fill();}
function water(){var wy=H*.82;var wg=ctx.createLinearGradient(0,wy,0,H*.90);wg.addColorStop(0,'rgba(40,130,200,.65)');wg.addColorStop(.4,'rgba(30,110,180,.80)');wg.addColorStop(1,'rgba(20,80,140,.90)');ctx.fillStyle=wg;ctx.fillRect(0,wy,W,H*.09);ctx.strokeStyle='rgba(255,255,255,.22)';for(var r=0;r<8;r++){var ry=wy+H*.012+(r)*(H*.065/9),rw=W*(.22+.18*Math.sin(t*.6+r*1.1)),rx=W*(.15+r*.08+.04*Math.sin(t*.4+r));ctx.beginPath();ctx.ellipse(rx,ry,rw*.5,H*.003,-.08,0,Math.PI*2);ctx.lineWidth=.6;ctx.stroke();}}
function doFlies(){bflies.forEach(function(f,i){f.x+=f.vx+Math.sin(t*1.8+i*1.3)*.00025;f.y+=f.vy+Math.cos(t*1.5+i*1.1)*.00015;if(f.x<0)f.x=1;if(f.x>1)f.x=0;if(f.y<.38)f.y=.90;if(f.y>.95)f.y=.40;f.ph+=.18;var bx=f.x*W,by=f.y*H,bs=f.sz,fw=Math.abs(Math.sin(f.ph));ctx.fillStyle=f.col+(.55+fw*.35)+')';[[bx-bs*fw,by-bs*.4,.4],[bx+bs*fw,by-bs*.4,-.4],[bx-bs*fw*.7,by+bs*.2,.5],[bx+bs*fw*.7,by+bs*.2,-.5]].forEach(function(p){ctx.beginPath();ctx.ellipse(p[0],p[1],bs*fw*(p===0||p===2?.9:.9),bs*(p[1]>by?.38:.55),p[2],0,Math.PI*2);ctx.fill();});ctx.fillStyle='rgba(20,10,5,.70)';ctx.beginPath();ctx.ellipse(bx,by,bs*.12,bs*.55,0,0,Math.PI*2);ctx.fill();});}
function doBirds(){birds.forEach(function(b){b.x+=b.vx;if(b.x>1.06)b.x=-.06;b.fp+=.095;var fl=Math.sin(b.fp)*b.sz*.65;ctx.beginPath();ctx.moveTo(b.x*W-b.sz*1.2,b.y*H+fl);ctx.quadraticCurveTo(b.x*W-b.sz*.3,b.y*H-fl*.5,b.x*W,b.y*H);ctx.quadraticCurveTo(b.x*W+b.sz*.3,b.y*H-fl*.5,b.x*W+b.sz*1.2,b.y*H+fl);ctx.lineWidth=1.4;ctx.strokeStyle='rgba(15,25,10,.65)';ctx.stroke();});}
function ground(){var gy=H*.91;var g=ctx.createLinearGradient(0,gy,0,H);g.addColorStop(0,'#3a5c18');g.addColorStop(.4,'#2e4a12');g.addColorStop(1,'#1e3008');ctx.fillStyle=g;ctx.fillRect(0,gy,W,H-gy);}
function frame(){t+=.007;ctx.clearRect(0,0,W,H);sky();sun();doClouds();hill([[0,.45],[.12,.35],[.25,.28],[.40,.34],[.52,.25],[.65,.31],[.78,.22],[.92,.30],[1,.36]],'#4a8040');hill([[0,.58],[.08,.50],[.20,.44],[.35,.52],[.48,.42],[.62,.50],[.75,.41],[.88,.48],[1,.54]],'#3a6a2c');hill([[0,.68],[.07,.60],[.18,.55],[.32,.63],[.46,.54],[.60,.62],[.74,.53],[.88,.60],[1,.64]],'#2e5420');hill([[0,.78],[.06,.72],[.18,.68],[.30,.74],[.44,.66],[.58,.73],[.72,.65],[.86,.72],[1,.75]],'#264818');water();treeRow(.74,H*.11,'#1a5012','#2a7020',22,.4);treeRow(.80,H*.14,'#164010','#245018',18,.0);['#1c5a14','#226018','#18500e','#205818','#1a5412'].forEach(function(c,i){rtree((.08+i*.18+Math.sin(i*2.1)*.05)*W,.82*H,H*(.10+.04*Math.abs(Math.sin(i*1.8))),c);});treeRow(.90,H*.18,'#122e08','#1c4410',12,.6);ground();doFlies();doBirds();requestAnimationFrame(frame);}
frame();

/* ── Form UI ── */
$(function(){

  /* Upload feedback */
  $('#nuitFile').on('change',function(){
    var f=this.files[0];
    if(f){
      $('#uploadLabel').text(f.name);
      $('#uploadArea').addClass('has-file');
      $('#uploadArea .upload-icon i').removeClass('fa-cloud-upload-alt').addClass('fa-check-circle').css('color','#45752E');
    }
  });

  /* Terms toggle */
  $('#termsRow').on('click',function(e){
    if($(e.target).is('a'))return;
    var cb=$('#aceita_termos'),box=$('#termsBox');
    var checked=!cb.prop('checked');
    cb.prop('checked',checked);
    box.toggleClass('checked',checked);
    $('#btnSubmit').prop('disabled',!checked);
  });

  /* Progress steps on field focus */
  $('#nome_empresa,#nuit,#nuitFile,#setor_atividade').on('focus change',function(){
    $('#s1').addClass('active');
  });
  $('#nome_responsavel,#telefone,#email').on('focus',function(){
    $('#s1').addClass('done').removeClass('active');
    $('#s2').addClass('active');
  });
  $('#aceita_termos').on('change',function(){
    if($(this).prop('checked')){
      $('#s1,#s2').addClass('done').removeClass('active');
      $('#s3').addClass('active');
    }
  });

  /* Submit */
  $('#regForm').on('submit',function(e){
    var ok=true;
    $(this).find('[required]').each(function(){
      if(!$(this).val()){$(this).addClass('error');ok=false;}
      else $(this).removeClass('error');
    });
    if(!ok){e.preventDefault();
      toastr.error('Por favor preencha todos os campos obrigatórios.','Campos em falta');
      return false;}

    var btn=$('#btnSubmit');
    btn.prop('disabled',true);
    $('#btnIcon').removeClass('fa-paper-plane').addClass('fa-spinner fa-spin');
    $('#btnText').text('A submeter...');
    return true;
  });

  /* Remove error on input */
  $('input,select').on('input change',function(){$(this).removeClass('error');});

  /* Auto-format NUIT */
  $('#nuit').on('input',function(){this.value=this.value.replace(/\D/g,'').slice(0,9);});

  /* Phone */
  $('#telefone').on('input',function(){this.value=this.value.replace(/[^\d\s+\-()]/g,'');});

  toastr.options={closeButton:true,progressBar:true,positionClass:'toast-top-right',timeOut:5000};
});
</script>
</body>
</html>
