diff --git a/app/core/src/main/resources/templates/multi-page-layout.html b/app/core/src/main/resources/templates/multi-page-layout.html
index 59ee843fa..0510935ee 100644
--- a/app/core/src/main/resources/templates/multi-page-layout.html
+++ b/app/core/src/main/resources/templates/multi-page-layout.html
@@ -21,16 +21,11 @@
                 <div class="mb-3">
                   <label class="form-label" th:text="#{pageLayout.mode}"></label>
                   <div class="form-check">
-                    <input class="form-check-input" type="radio" id="modeDefault" name="mode" value="DEFAULT" checked>
-                    <label class="form-check-label" for="modeDefault" th:text="#{pageLayout.default}">Default</label>
-                  </div>
-
-                  <div class="form-check">
-                    <input class="form-check-input" type="radio" id="modeCustom" name="mode" value="CUSTOM">
+                    <input class="form-check-input" type="checkbox" id="modeCustom" name="mode" value="CUSTOM">
                     <label class="form-check-label" for="modeCustom" th:text="#{pageLayout.custom}">Custom</label>
                   </div>
                 </div>
-                <div id="defaultSection" class="mb-3">
+                <div id="defaultSection" class="mb-3" style="border:1px solid #eee; padding:1em; border-radius:8px; margin-bottom:1em;">
                   <label for="pagesPerSheet" th:text="#{pageLayout.pagesPerSheet}"></label>
                   <select class="form-control" id="pagesPerSheet" name="pagesPerSheet" required>
                     <option value="2">2</option>
@@ -40,35 +35,41 @@
                     <option value="16">16</option>
                   </select>
                 </div>
-                <div id="customSection" class="mb-3">
+                <div id="customSection" class="mb-3" style="border:1px solid #eee; padding:1em; border-radius:8px; margin-bottom:1em;">
                   <div class="mb-3">
                     <label for="rows" th:text="#{pageLayout.rows}"></label>
-                    <input class="form-control" type="number" id="rows" name="rows" step="1" min="1" value="1" required>
+                    <input class="form-control" type="number" id="rows" name="rows" step="1" min="1" max="300" value="1" required>
                   </div>
                   <div class="mb-3">
                     <label for="cols" th:text="#{pageLayout.columns}"></label>
-                    <input class="form-control" type="number" id="cols" name="cols" step="1" min="1" value="1" required>
+                    <input class="form-control" type="number" id="cols" name="cols" step="1" min="1" max="300" value="1" required>
                   </div>
-                </div> 
-                <div class="mb-3">
-                  <label for="pageOrder" th:text="#{pageLayout.pageOrder}"></label>
-                  <select class="form-control" id="pageOrder" name="pageOrder">
-                    <option value="LR_TD" th:text="#{pageLayout.leftRightTopDown}"></option>
-                    <option value="RL_TD" th:text="#{pageLayout.rightLeftTopDown}"></option>
-                    <option value="TD_LR" th:text="#{pageLayout.topDownLeftRight}"></option>
-                    <option value="TD_RL" th:text="#{pageLayout.topDownRightLeft}"></option>
-                  </select>
-                </div>
-                <div class="mb-3">
-                  <label for="orientation" th:text="#{pageLayout.orientation}"></label>
-                  <select class="form-control" id="orientation" name="orientation">
-                    <option value="PORTRAIT" th:text="#{pageLayout.portrait}"></option>
-                    <option value="LANDSCAPE" th:text="#{pageLayout.landscape}"></option>
-                  </select>
                 </div>
                 <div class="form-check mb-3">
-                  <input id="addBorder" name="addBorder" type="checkbox">
-                  <label for="addBorder" th:text="#{pageLayout.addBorder}"></label>
+                  <input id="advancedSettingsToggle" type="checkbox">
+                  <label for="advancedSettingsToggle" th:text="#{pageLayout.advancedSettings}"></label>
+                </div>
+                <div id="advancedSettings" style="display:none; border:1px solid #eee; padding:1em; border-radius:8px; margin-bottom:1em;">
+                  <div class="mb-3">
+                    <label for="pageOrder" th:text="#{pageLayout.pageOrder}"></label>
+                    <select class="form-control" id="pageOrder" name="pageOrder">
+                      <option value="LR_TD" th:text="#{pageLayout.leftRightTopDown}"></option>
+                      <option value="RL_TD" th:text="#{pageLayout.rightLeftTopDown}"></option>
+                      <option value="TD_LR" th:text="#{pageLayout.topDownLeftRight}"></option>
+                      <option value="TD_RL" th:text="#{pageLayout.topDownRightLeft}"></option>
+                    </select>
+                  </div>
+                  <div class="mb-3">
+                    <label for="orientation" th:text="#{pageLayout.orientation}"></label>
+                    <select class="form-control" id="orientation" name="orientation">
+                      <option value="PORTRAIT" th:text="#{pageLayout.portrait}"></option>
+                      <option value="LANDSCAPE" th:text="#{pageLayout.landscape}"></option>
+                    </select>
+                  </div>
+                  <div class="form-check mb-3">
+                    <input id="addBorder" name="addBorder" type="checkbox">
+                    <label for="addBorder" th:text="#{pageLayout.addBorder}"></label>
+                  </div>
                 </div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{pageLayout.submit}"></button>
               </form>
@@ -76,7 +77,7 @@
               <script>
                 (function(){
                   const form = document.getElementById('multiPdfForm');
-                  const modeRadios = form.querySelectorAll('input[name="mode"]');
+                  const modeCheckbox = form.querySelector('input[name="mode"]');
                   const defaultSection = document.getElementById('defaultSection');
                   const customSection  = document.getElementById('customSection');
                   const pagesPerSheet  = document.getElementById('pagesPerSheet');
@@ -84,7 +85,7 @@
                   const colsInput      = document.getElementById('cols');
 
                   function sync() {
-                    const mode = [...modeRadios].find(r => r.checked)?.value || 'DEFAULT';
+                    const mode = modeCheckbox.checked? 'CUSTOM' : 'DEFAULT';
                     const isDefault = mode === 'DEFAULT';
 
                     // Enable/disable relevant fields
@@ -101,7 +102,20 @@
                     }
                   }
 
-                  modeRadios.forEach(r => r.addEventListener('change', sync));
+                  modeCheckbox.addEventListener('change', sync);
+                  
+                  // Show/hide advanced settings
+                  const advancedToggle = document.getElementById('advancedSettingsToggle');
+                  const advancedSettings = document.getElementById('advancedSettings');
+
+                  if (advancedToggle && advancedSettings) {
+                    advancedToggle.addEventListener('change', function() {
+                      advancedSettings.style.display = this.checked ? 'block' : 'none';
+                      advancedSettings.querySelector('#addBorder').checked = false;
+                      advancedSettings.querySelector('#pageOrder').value = 'LR_TD';
+                      advancedSettings.querySelector('#orientation').value = 'PORTRAIT';
+                    });
+                  }
                   // initial state
                   sync();
                 })();