Update nutri_call.html

nutri_call.html

@@ -439,7 +439,7 @@ legend {
 .compensation-section {
     display: flex;
     flex-direction: column;
-    gap: 10px;
+    gap: 20px;
 }
 
 .enhancement-title {
@@ -474,6 +474,11 @@ legend {
     border-radius: 4px;
 }
 
+.input-columns {
+    display: flex;
+    gap: 20px;
+}
+
 .input-column {
     display: flex;
     flex-direction: column;
@@ -489,8 +494,9 @@ legend {
     border-radius: 5px;
     cursor: pointer;
     transition: background-color 0.3s;
-    margin-bottom: 5px;
+    margin-top: 10px;
     font-weight: bold;
+    align-self: flex-start; /* Кнопка выравнивается по левому краю */
 }
 
 #calculate-btn:hover {
@@ -504,7 +510,7 @@ legend {
 }
 
 .input-group label {
-    width: 80px;
+    width: 120px; /* Увеличил ширину для лучшего отображения текста */
     text-align: right;
     font-weight: bold;
     font-size: 0.9em;
@@ -518,8 +524,6 @@ legend {
 }
 
 
-
-
 .micro-container {
     padding: 10px;
 }
@@ -923,24 +927,40 @@ legend {
 
   
   
-    <fieldset class="calculation-box">
-        <legend>Расчёт удобрений</legend>
-        <div class="calculation-container">
-            <div class="compensation-section">
-
-            <div class="input-column">
-                <button id="calculate-btn">Рассчитать</button>
-                <div class="input-group">
-                    <label for="liters-input">Литры:</label>
-                    <input type="number" id="liters-input" value="100" min="1" step="1">
+<fieldset class="calculation-box">
+    <legend>Расчёт удобрений</legend>
+    <div class="calculation-container">
+        <div class="compensation-section">
+            <!-- Поля ввода -->
+            <div class="input-columns">
+                <div class="input-column">
+                    <div class="input-group">
+                        <label for="liters-input">Литры:</label>
+                        <input type="number" id="liters-input" value="100" min="1" step="1">
+                    </div>
+                    <div class="input-group">
+                        <label for="rounding-precision">Точность:</label>
+                        <input type="number" id="rounding-precision" value="3" min="0" max="3" step="1">
+                    </div>
                 </div>
-                <div class="input-group">
-                    <label for="rounding-precision">Точность:</label>
-                    <input type="number" id="rounding-precision" value="3" min="0" max="3" step="1">
+
+                <div class="input-column">
+                    <div class="input-group">
+                        <label for="activation-cacl">Активация CaCl:</label>
+                        <input type="number" id="activation-cacl" value="0" min="0" step="0.01">
+                    </div>
+                    <div class="input-group">
+                        <label for="enhancement-cacl">Усиление CaCl:</label>
+                        <input type="number" id="enhancement-cacl" value="0" min="0" step="0.01">
+                    </div>
                 </div>
             </div>
+
+            <!-- Кнопка "Рассчитать" -->
+            <button id="calculate-btn">Рассчитать</button>
         </div>
-    </fieldset>
+    </div>
+</fieldset>