Added security check report settings and templating

modules/security/web/css/security.css

@@ -545,3 +545,58 @@
     padding: var(--app-spacing);
   }
 }
+
+/* --- Customer report design (logo + HTML/CSS template editor) --- */
+.security-template-editor textarea {
+  width: 100%;
+  margin: 0;
+  font-family: var(--font-mono, ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace);
+  font-size: 0.8125rem;
+  line-height: 1.5;
+  tab-size: 2;
+  white-space: pre;
+  resize: vertical;
+}
+
+.security-variable-reference {
+  margin-top: calc(var(--app-spacing) * 1.25);
+}
+
+.security-variable-reference h4 {
+  margin: 0 0 0.25rem;
+  font-size: var(--text-sm, 0.875rem);
+  font-weight: var(--font-medium, 600);
+}
+
+.security-variable-list {
+  display: grid;
+  grid-template-columns: minmax(12rem, max-content) 1fr;
+  gap: 0.25rem 1rem;
+  margin: 0.5rem 0 0;
+}
+
+.security-variable-list dt {
+  margin: 0;
+}
+
+.security-variable-list dt code {
+  font-size: 0.8125rem;
+  white-space: nowrap;
+}
+
+.security-variable-list dd {
+  margin: 0;
+  color: var(--app-muted-color, #6a6a6a);
+  font-size: var(--text-sm, 0.875rem);
+}
+
+@media (max-width: 576px) {
+  .security-variable-list {
+    grid-template-columns: 1fr;
+    gap: 0.1rem 0;
+  }
+
+  .security-variable-list dd {
+    margin-bottom: 0.4rem;
+  }
+}