[#2311] Changed info color into secondary color

src/open_inwoner/scss/components/KCMSurvey/KCMSurvey.scss

@@ -1,30 +1,30 @@
 .kcm-survey {
   display: inline-block;
-  border-color: var(--color-info-darker);
-  border-top: 1px solid var(--color-info-darker);
+  border-color: var(--color-secondary-darker);
+  border-top: 1px solid var(--color-secondary-darker);
   border-right: none;
   border-bottom: none;
-  border-left: 1px solid var(--color-info-darker);
+  border-left: 1px solid var(--color-secondary-darker);
   outline: 1px solid var(--color-white);
   border-radius: var(--border-radius) 0 0 0;
   position: fixed;
   bottom: 0;
   right: 0;
   z-index: 1010;
   padding: var(--spacing-medium);
-  background-color: var(--color-info-lighter);
+  background-color: var(--color-secondary-lightest);
   font-size: var(--font-size-heading-card);
   font-weight: bold;
   writing-mode: initial;
 
   & .link {
-    color: var(--color-info-darker);
+    color: var(--color-secondary-darker);
   }
 
   @media (min-width: 768px) {
-    border-top: 1px solid var(--color-info-darker);
-    border-right: 1px solid var(--color-info-darker);
-    border-bottom: 1px solid var(--color-info-darker);
+    border-top: 1px solid var(--color-secondary-darker);
+    border-right: 1px solid var(--color-secondary-darker);
+    border-bottom: 1px solid var(--color-secondary-darker);
     border-left: none;
     border-radius: 0 var(--border-radius) var(--border-radius) 0;
     bottom: initial;

src/open_inwoner/scss/views/App.scss

@@ -80,6 +80,11 @@
     calc(var(--color-secondary-s) - 30%),
     calc(var(--color-secondary-l) + 30%)
   );
+  --color-secondary-lightest: hsl(
+    var(--color-secondary-h),
+    calc(var(--color-secondary-s) - 30%),
+    calc(var(--color-secondary-l) + 50%)
+  );
 
   --color-accent-h: 50;
   --color-accent-s: 94%;