<form hx-post="{{ url_for('modules.berechnen', module_name='neff_achberg') }}" hx-target="#modul-modal-body" hx-swap="innerHTML">

<div class="modal-modul mg">
<div class="columns is-multiline is-variable is-3">
  <div class="column is-12-tablet is-4-desktop">
    <div class="gl-card" style="background:linear-gradient(135deg,#eef2fa,#e8edf5);border-color:rgba(47,84,150,.1)">
      <div class="gl-card-header"><span class="icon" style="background:rgba(47,84,150,.1)">🏠</span><h4>Hausanschluss</h4></div>
      <label class="gl-toggle"><input type="checkbox" name="ha_herstellen"><span class="toggle-track"></span><span class="toggle-label"> HA herstellen</span></label>
      <label class="gl-label" style="margin-top:6px">Scan Name</label><input class="gl-input" name="scan_name">
      <div class="gl-subcard" style="margin-top:8px">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">Kabelgraben</div>
        <div class="gl-grid-2">
          <div><label class="gl-toggle"><input type="checkbox" name="kg_gruen"><span class="toggle-track"></span><span class="toggle-label"> Grünflächen</span></label><input class="gl-input gl-input-sm" name="kg_gruen_m" type="number" step="0.1" placeholder="m"></div>
          <div><label class="gl-toggle"><input type="checkbox" name="kg_asphalt"><span class="toggle-track"></span><span class="toggle-label"> Asphaltflächen</span></label><input class="gl-input gl-input-sm" name="kg_asphalt_m" type="number" step="0.1" placeholder="m"></div>
          <div><label class="gl-toggle"><input type="checkbox" name="kg_pflaster"><span class="toggle-track"></span><span class="toggle-label"> Pflasterflächen</span></label><input class="gl-input gl-input-sm" name="kg_pflaster_m" type="number" step="0.1" placeholder="m"></div>
        </div>
      </div>
      <div class="gl-subcard">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">Kopfloch</div>
        <div class="gl-grid-auto">
          <label class="gl-toggle"><input type="checkbox" name="kopfl_geb"><span class="toggle-track"></span><span class="toggle-label"> Gebäude</span></label>
          <label class="gl-toggle"><input type="checkbox" name="kopfl_tr"><span class="toggle-track"></span><span class="toggle-label"> Trasse</span></label>
        </div>
      </div>
    </div>
  </div>
  <div class="column is-12-tablet is-4-desktop">
    <div class="gl-card" style="background:linear-gradient(135deg,#fef9e7,#fdf3d0);border-color:rgba(243,156,18,.1)">
      <div class="gl-card-header"><span class="icon" style="background:rgba(243,156,18,.1)">🔌</span><h4>Leitungen & Sicherung</h4></div>
      <div class="gl-subcard">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">vorh. Leitungen Unterfahren</div>
        <div class="gl-grid-2">
          <label class="gl-toggle"><input type="checkbox" name="unt_kabel"><span class="toggle-track"></span><span class="toggle-label"> Kabel u. Rohre</span></label><input class="gl-input gl-input-sm" name="unt_kabel_anz" type="number" step="1" placeholder="Anz.">
          <label class="gl-toggle"><input type="checkbox" name="unt_vers"><span class="toggle-track"></span><span class="toggle-label"> Versorgungsleitungen</span></label><input class="gl-input gl-input-sm" name="unt_vers_anz" type="number" step="1" placeholder="Anz.">
          <label class="gl-toggle"><input type="checkbox" name="unt_abw"><span class="toggle-track"></span><span class="toggle-label"> Abwasserleitungen</span></label><input class="gl-input gl-input-sm" name="unt_abw_anz" type="number" step="1" placeholder="Anz.">
        </div>
      </div>
      <div class="gl-subcard">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">vorh. LTG sichern Längs</div>
        <div class="gl-grid-2">
          <label class="gl-toggle"><input type="checkbox" name="sich_kabel"><span class="toggle-track"></span><span class="toggle-label"> Kabel u. Rohr</span></label><input class="gl-input gl-input-sm" name="sich_kabel_m" type="number" step="0.1" placeholder="m">
          <label class="gl-toggle"><input type="checkbox" name="sich_vers"><span class="toggle-track"></span><span class="toggle-label"> Versorgungsleitungen</span></label><input class="gl-input gl-input-sm" name="sich_vers_m" type="number" step="0.1" placeholder="m">
          <label class="gl-toggle"><input type="checkbox" name="sich_abw"><span class="toggle-track"></span><span class="toggle-label"> Abwasserleitungen</span></label><input class="gl-input gl-input-sm" name="sich_abw_m" type="number" step="0.1" placeholder="m">
        </div>
      </div>
    </div>
  </div>
  <div class="column is-12-tablet is-4-desktop">
    <div class="gl-card" style="background:linear-gradient(135deg,#f3e8fd,#ede0f7);border-color:rgba(142,68,173,.1)">
      <div class="gl-card-header"><span class="icon" style="background:rgba(142,68,173,.1)">⚙️</span><h4>Sonstiges & Aktionen</h4></div>
      <div class="gl-grid-auto">
        <label class="gl-toggle"><input type="checkbox" name="ha_koordinieren"><span class="toggle-track"></span><span class="toggle-label"> HA Koordinieren</span></label>
        <label class="gl-toggle"><input type="checkbox" name="kernbohrung"><span class="toggle-track"></span><span class="toggle-label"> Kernbohrung herstellen</span></label>
        <label class="gl-toggle"><input type="checkbox" name="md1"><span class="toggle-track"></span><span class="toggle-label"> MD1 FttH herstellen</span></label>
      </div>
      
    </div>
  </div>
</div>
  {% include 'components/modul_actions.html' %}
</div>
</form>