<form hx-post="{{ url_for('modules.berechnen', module_name='cu') }}" 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>CU-Montage</h4></div>
      <label class="gl-label">Abschnitt</label><input class="gl-input" name="abschnitt">
      <div class="gl-subcard" style="margin-top:8px">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">Montage</div>
        <div class="gl-grid-auto">
          <label class="gl-toggle"><input type="checkbox" name="muffe_bis10"><span class="toggle-track"></span><span class="toggle-label"> Muffe bis 10 DA montieren</span></label>
          <label class="gl-toggle"><input type="checkbox" name="apl_bis10"><span class="toggle-track"></span><span class="toggle-label"> APL bis 10 DA montieren</span></label>
          <label class="gl-toggle"><input type="checkbox" name="anschl_trenn"><span class="toggle-track"></span><span class="toggle-label"> Anschluss-/Trennleisten einbauen</span></label>
          <label class="gl-toggle"><input type="checkbox" name="muffe_schrumpf"><span class="toggle-track"></span><span class="toggle-label"> Schrumpfmuffe herstellen</span></label>
          <label class="gl-toggle"><input type="checkbox" name="muffe_klemm"><span class="toggle-track"></span><span class="toggle-label"> Klemmmuffe herstellen</span></label>
          <label class="gl-toggle"><input type="checkbox" name="muffe_gel"><span class="toggle-track"></span><span class="toggle-label"> Gel-Muffen herstellen</span></label>
          <label class="gl-toggle"><input type="checkbox" name="muffe_klemm_dlr"><span class="toggle-track"></span><span class="toggle-label"> Klemmmuffen für DLR</span></label>
        </div>
      </div>
    </div>
  </div>
  <div class="column is-12-tablet is-4-desktop">
    <div class="gl-card" style="background:linear-gradient(135deg,#edf7ed,#e6f3e6);border-color:rgba(39,174,96,.1)">
      <div class="gl-card-header"><span class="icon" style="background:rgba(39,174,96,.1)">??</span><h4>Verbindungen & EV</h4></div>
      <label class="gl-label">Anzahl CU-Verbinden</label><input class="gl-input gl-input-sm" name="anz_cu_verb" type="number" step="1">
      <div class="gl-grid-auto" style="margin-top:8px">
        <label class="gl-toggle"><input type="checkbox" name="cu_da_gr"><span class="toggle-track"></span><span class="toggle-label"> CU-DA > 0,8 mm verbinden</span></label>
        <label class="gl-toggle"><input type="checkbox" name="cu_da_kl"><span class="toggle-track"></span><span class="toggle-label"> CU-DA = 0,8 mm verbinden</span></label>
      </div>
      <div class="gl-subcard" style="margin-top:10px">
        <div style="font-weight:600;font-size:.78rem;margin-bottom:6px">EVs</div>
        <label class="gl-label">Anzahl Stück</label><input class="gl-input gl-input-sm" name="anz_stk" type="number" step="1">
        <label class="gl-toggle"><input type="checkbox" name="evs_einbauen"><span class="toggle-track"></span><span class="toggle-label"> EVs einbauen</span></label>
        <label class="gl-toggle"><input type="checkbox" name="kabel_anlegen_ev"><span class="toggle-track"></span><span class="toggle-label"> Kabel anlegen EVs/TrLe</span></label>
      </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>Stopfstellen</h4></div>
      <div class="gl-grid-auto">
        <label class="gl-toggle"><input type="checkbox" name="stopfstelle"><span class="toggle-track"></span><span class="toggle-label"> Druckluftstutzen Stopfstelle einbauen</span></label>
        <label class="gl-toggle"><input type="checkbox" name="zulage_stopf"><span class="toggle-track"></span><span class="toggle-label"> Zulage Stopfstelle DLR</span></label>
      </div>
      
    </div>
  </div>
</div>
  {% include 'components/modul_actions.html' %}
</div>
</form>