From 3fc04a43730dee7458cbddfa89b48f3d309689ed Mon Sep 17 00:00:00 2001
From: Thomas Peterson <info@thomas-peterson.de>
Date: Thu, 4 Dec 2025 14:13:32 +0100
Subject: [PATCH] Backup

---
 .../views/backend/edit/create.html.twig       |   7 +-
 .../views/backend/edit/delete.html.twig       |  68 ++---
 .../views/backend/edit/edit.html.twig         |   7 +-
 .../views/backend/list/index.html.twig        |  30 +-
 .../views/backend/edit/delete.html.twig       |  91 +++++--
 .../views/backend/list/index.html.twig        | 257 +++++++++++-------
 .../views/backend/help/create.html.twig       | 145 +++++-----
 .../views/backend/help/delete.html.twig       |  97 ++++---
 .../views/backend/help/edit.html.twig         | 145 +++++-----
 .../views/backend/help/index.html.twig        | 111 ++++----
 .../views/backend/paper/delete.html.twig      |  52 +++-
 .../views/backend/status/delete.html.twig     |  66 +++--
 src/new/var/tailwind/backend.built.css        | 117 ++++++--
 13 files changed, 715 insertions(+), 478 deletions(-)

diff --git a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/create.html.twig b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/create.html.twig
index 9714e4369..7750f9ddf 100755
--- a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/create.html.twig
+++ b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/create.html.twig
@@ -202,7 +202,12 @@
     {% endfor %}
 
     <div class="text-end my-2">
-        {{ form_widget(form.save, {attr: {class: 'inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]'}}) }}
+        <button type="submit" name="{{ form.save.vars.full_name }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+            </svg>
+            {{ form.save.vars.label|trans }}
+        </button>
     </div>
 
     {{ form_end(form) }}
diff --git a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/delete.html.twig b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/delete.html.twig
index 13398f9cb..0bb24542a 100755
--- a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/delete.html.twig
+++ b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/delete.html.twig
@@ -20,40 +20,46 @@
 {% endblock %}
 
 {% block body %}
-<div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
-    <div class="mb-6">
-        <h4 class="text-lg font-semibold text-gray-900 mb-4">{{ 'psc_shop_cms.Site'|trans }} {{ 'psc_shop_cms.Delete'|trans }}?</h4>
-        <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
-            <div class="flex">
-                <div class="flex-shrink-0">
-                    <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
-                        <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
-                    </svg>
-                </div>
-                <div class="ml-3">
-                    <p class="text-sm text-yellow-700 font-medium">
-                        {{ cms.title }}
-                    </p>
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-7">
+            <h4 class="text-lg font-semibold text-gray-900 mb-4">{{ 'psc_shop_cms.Site'|trans }} {{ 'psc_shop_cms.Delete'|trans }}?</h4>
+            <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+                        </svg>
+                    </div>
+                    <div class="ml-3">
+                        <p class="text-sm text-yellow-700 font-medium">
+                            {{ cms.title }}
+                        </p>
+                    </div>
                 </div>
             </div>
         </div>
-    </div>
 
-    {{ form_start(form, {attr: {class: ''}}) }}
-    <div class="flex gap-4 items-center">
-        <button type="submit" name="yes" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
-                <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
-            </svg>
-            Ja, löschen
-        </button>
-        <button type="submit" name="no" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem]">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
-                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
-            </svg>
-            Nein, abbrechen
-        </button>
+        {{ form_start(form, {attr: {class: ''}}) }}
+        <div class="flex gap-4 px-7 items-center">
+            <button type="submit" name="{{ form.yes.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+                Ja, löschen
+            </button>
+            <button type="submit" name="{{ form.no.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem] border border-gray-300">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
+                </svg>
+                Nein, abbrechen
+            </button>
+        </div>
+        <div class="hidden">
+            {{ form_widget(form.yes) }}
+            {{ form_widget(form.no) }}
+        </div>
+        {{ form_end(form) }}
     </div>
-    {{ form_end(form) }}
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/edit.html.twig b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/edit.html.twig
index 1a343e459..20ece71cd 100755
--- a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/edit.html.twig
+++ b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/edit/edit.html.twig
@@ -206,7 +206,12 @@
     {% endfor %}
 
     <div class="text-end my-2">
-        {{ form_widget(form.save, {attr: {class: 'inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]'}}) }}
+        <button type="submit" name="{{ form.save.vars.full_name }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+            </svg>
+            {{ form.save.vars.label|trans }}
+        </button>
     </div>
 
     {{ form_end(form) }}
diff --git a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/list/index.html.twig b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/list/index.html.twig
index 5162be202..725fed32a 100755
--- a/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/list/index.html.twig
+++ b/src/new/src/PSC/Shop/CmsBundle/Resources/views/backend/list/index.html.twig
@@ -22,19 +22,31 @@
 {% block body %}
 <div class="flex flex-col gap-6">
     <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
-        <div class="mb-4">
+        <div class="mb-6 px-4">
             {{ form_start(form, { 'attr': {'class': ''}}) }}
-            <div class="flex items-center gap-4">
-                <label class="font-medium text-sm">
-                    {{ 'psc_shop_cms.Search'|trans }}
+            <div class="flex items-center gap-6">
+                <label class="font-medium text-gray-700 text-sm min-w-fit">
+                    {{ 'psc_shop_cms.Search'|trans }}:
                 </label>
-                <div class="flex-1 max-w-md">
-                    <div class="flex gap-2">
-                        {{ form_widget(form.term, {attr: {class:'form-input'}}) }}
-                        <button type="submit" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
-                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <div class="flex-1 max-w-xl">
+                    <div class="relative flex gap-3">
+                        <div class="relative flex-1">
+                            <div class="absolute inset-y-0 left-3.5 flex items-center pointer-events-none z-10">
+                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 text-gray-400">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
+                                </svg>
+                            </div>
+                            {{ form_widget(form.term, {attr: {
+                                class:'w-full pr-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-psc-500 focus:border-psc-500 transition-all text-sm',
+                                placeholder: 'CMS Seiten suchen...',
+                                style: 'padding-left: 2.75rem !important;'
+                            }}) }}
+                        </div>
+                        <button type="submit" class="inline-flex items-center justify-center gap-2 font-medium rounded-lg px-5 py-2.5 text-sm text-white shadow-md bg-psc-500 hover:bg-psc-600 hover:shadow-lg transition-all duration-200">
+                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
                             </svg>
+                            {{ 'psc_shop_cms.Search'|trans }}
                         </button>
                     </div>
                 </div>
diff --git a/src/new/src/PSC/Shop/NewsBundle/Resources/views/backend/edit/delete.html.twig b/src/new/src/PSC/Shop/NewsBundle/Resources/views/backend/edit/delete.html.twig
index 05f702594..92ba4609c 100755
--- a/src/new/src/PSC/Shop/NewsBundle/Resources/views/backend/edit/delete.html.twig
+++ b/src/new/src/PSC/Shop/NewsBundle/Resources/views/backend/edit/delete.html.twig
@@ -1,40 +1,71 @@
-{% extends 'backend_base.html.twig' %}
+{% extends 'backend_tailwind_base.html.twig' %}
 {% trans_default_domain 'core_news_delete' %}
-{% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa-fw fa fa-newspaper"></i>
-                    {{'News'|trans}} <span>>
-                    {{'del'|trans}}</span>
-                </h3>
-            </div>
-        </div>
+
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M12 7.5h1.5m-1.5 3h1.5m-7.5 3h7.5m-7.5 3h7.5m3-9h3.375c.621 0 1.125.504 1.125 1.125V18a2.25 2.25 0 01-2.25 2.25M16.5 7.5V18a2.25 2.25 0 002.25 2.25M16.5 7.5V4.875c0-.621-.504-1.125-1.125-1.125H4.125C3.504 3.75 3 4.254 3 4.875V18a2.25 2.25 0 002.25 2.25h13.5M6 7.5h3v3H6v-3z" />
+            </svg>
+            News <span class="text-gray-500">{{'del'|trans}}</span>
+        </h1>
     </div>
+    <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
+        <a href="{{ path("psc_shop_news_backend_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />
+            </svg>
+            Zurück
+        </a>
+    </div>
+{% endblock %}
 
-    <div class="body">
-        <div class="panel">
-            <div class="header">
-                <h4>{{'News'|trans}} {{'del'|trans}}?</h4>
-            </div>
-            <div class="body">
-
-                <h5>{{ news.title }}</h5>
-                {{ news.introduction }}
-
-                {{ form_start(form, { 'attr': {'class': ''}}) }}
-                <div class="row mb-3">
-                    <label class="col-md-1 form-control-label"></label>
-                    <div class="col-md-1">
-                        {{ form_widget(form.yes, {attr: {class: 'btn btn-lg btn-warning btn-sm'}}) }}
+{% block body %}
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-7">
+            <h4 class="text-lg font-semibold text-gray-900 mb-4">{{'News'|trans}} {{'del'|trans}}?</h4>
+            <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+                        </svg>
                     </div>
-                    <div class="col-md-1">
-                        {{ form_widget(form.no, {attr: {class: 'btn btn-lg btn-primary btn-sm'}}) }}
+                    <div class="ml-3">
+                        <p class="text-sm text-yellow-700 font-medium">
+                            {{ news.title }}
+                        </p>
+                        {% if news.introduction %}
+                            <p class="text-xs text-yellow-600 mt-1">
+                                {{ news.introduction|striptags|slice(0, 100) }}{% if news.introduction|length > 100 %}...{% endif %}
+                            </p>
+                        {% endif %}
                     </div>
                 </div>
-                {{ form_end(form) }}
             </div>
         </div>
+
+        {{ form_start(form, {attr: {class: ''}}) }}
+        <div class="flex gap-4 px-7 items-center">
+            <button type="submit" name="{{ form.yes.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+                Ja, löschen
+            </button>
+            <button type="submit" name="{{ form.no.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem] border border-gray-300">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
+                </svg>
+                Nein, abbrechen
+            </button>
+        </div>
+        <div class="hidden">
+            {{ form_widget(form.yes) }}
+            {{ form_widget(form.no) }}
+        </div>
+        {{ form_end(form) }}
     </div>
+</div>
 {% endblock %}
\ No newline at end of file
diff --git a/src/new/src/PSC/Shop/OrderBundle/Resources/views/backend/list/index.html.twig b/src/new/src/PSC/Shop/OrderBundle/Resources/views/backend/list/index.html.twig
index 1939363dd..16130a1d5 100755
--- a/src/new/src/PSC/Shop/OrderBundle/Resources/views/backend/list/index.html.twig
+++ b/src/new/src/PSC/Shop/OrderBundle/Resources/views/backend/list/index.html.twig
@@ -1,114 +1,169 @@
-{% extends 'backend_base.html.twig' %}
+{% extends 'backend_tailwind_base.html.twig' %}
 {% trans_default_domain 'core_order_list' %}
+
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z" />
+            </svg>
+            {{'order'|trans}} <span class="text-gray-500">{{'list'|trans}}</span>
+        </h1>
+    </div>
+{% endblock %}
+
 {% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa-fw fa fa-shopping-cart"></i>
-                    {{'order'|trans}} <span>>
-                    {{'list'|trans}} </span>
-                </h3>
+<div class="flex flex-col gap-6">
+    {% for customSection in customSections %}
+        {% if customSection.getController %}
+            {{ render(controller(
+                customSection.getController,{}
+            )) }}
+        {% endif %}
+    {% endfor %}
+
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-4">
+            {{ form_start(form, { 'attr': {'class': 'searchForm'}}) }}
+            <div class="flex flex-wrap gap-6">
+                <div class="flex-1 min-w-[300px]">
+                    <label class="block text-sm font-medium text-gray-700 mb-2">
+                        Filtern nach Auftragsstatus (Positionsstatus wird nicht berücksichtigt):
+                    </label>
+                    {{ form_widget(form.status, {attr: {
+                        class: 'w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-psc-500 focus:border-psc-500 transition-all text-sm'
+                    }}) }}
+                </div>
+                <div class="flex-1 min-w-[300px]">
+                    <label class="block text-sm font-medium text-gray-700 mb-2">
+                        Suchen nach (Auftragsstatus-Filter wird berücksichtigt):
+                    </label>
+                    <div class="flex gap-3">
+                        {{ form_widget(form.term, {attr: {
+                            class: 'flex-1 px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-psc-500 focus:border-psc-500 transition-all text-sm',
+                            placeholder: 'Auftrag suchen...'
+                        }}) }}
+                        <button type="submit" class="inline-flex items-center justify-center gap-2 font-medium rounded-sm px-5 py-2.5 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
+                            </svg>
+                            Filter anwenden
+                        </button>
+                    </div>
+                </div>
             </div>
+            {{ form_rest(form) }}
+            {{ form_end(form) }}
         </div>
-    </div>
-    <div class="body">
-        {% for customSection in customSections %}
-            {% if customSection.getController %}
-                {{ render(controller(
-                    customSection.getController,{}
-                )) }}
-            {% endif %}
-        {% endfor %}
-        <div class="panel">
-            <div class="body">
-                {{ form_start(form, { 'attr': {'class': 'searchForm'}}) }}
-                <div class="form-group form-group-sm row">
-                    <div class="col-md-5">
-                    Filtern nach Auftragsstatus (Positionsstatus wird nicht berücksichtigt):<br />
-                        {{ form_widget(form.status) }}
-                        <div style="clear: both;"></div>
-                    </div>
-                    <div class="col-md-3">
-                    Suchen nach (Auftragsstatus-Filter wird berücksichtigt):<br />
-                        <div class="input-group input-group-sm">
-                            {{ form_widget(form.term) }}
-                            
-                        </div><br /><br />
-                        <span class="input-group-btn">
-                                    <button type="submit" class="btn btn-sm btn-success btn">Filter anwenden</button>
-                                </span>
-                    </div>
-                </div>
-
-                {{ form_rest(form) }}
-
-                {{ form_end(form) }}
-
-                <div class="navigation">
-                    {{ knp_pagination_render(pagination) }}
-                </div>
-                <div class="row bg-dark text-light">
-                    <div class="col-2 p-1"><div class="row">
-                            <div class="col-2"></div>
-                            <div class="col-3">{{ knp_pagination_sortable(pagination, 'Id'|trans, 'orders.uid', {class: 'link-light'}) }}</div>
-                            <div class="col-2">{{ knp_pagination_sortable(pagination, 'Typ'|trans, 'orders.type', {class: 'link-light'}) }}</div>
-                            <div class="col-2">{{'draft'|trans}}</div>
-                            <div class="col-2">{{'virtual'|trans}}</div>
-                        </div>
-                    </div>
-                    <div class="col-1 p-1">{{ knp_pagination_sortable(pagination, 'ordernumber'|trans, 'orders.alias', {class: 'link-light'}) }}</div>
-                    <div class="col-1 p-1">{{ knp_pagination_sortable(pagination, 'createdat'|trans, 'orders.created', {class: 'link-light'}) }}</div>
-                    <div class="col-2 p-1">{{ knp_pagination_sortable(pagination, 'Name'|trans, 'contact.username', {class: 'link-light'}) }} / {{ knp_pagination_sortable(pagination, 'firstname'|trans, 'contact.firstname', {class: 'link-light'}) }} {{ knp_pagination_sortable(pagination, 'lastname'|trans, 'contact.lastname', {class: 'link-light'}) }}</div>
-                    <div class="col-1 p-1">{{ knp_pagination_sortable(pagination, 'wkpos1'|trans, 'orders.basketfield1', {class: 'link-light'}) }} / {{ knp_pagination_sortable(pagination, 'wkpos2'|trans, 'orders.basketfield2', {class: 'link-light'}) }}</div>
-                    <div class="col-2 p-1">{{'re'|trans}}</div>
-                    <div class="col-1 p-1 text-end">{{'grossprice'|trans}}</div>
-                    <div class="col-1 p-2 text-end"></div>
-                </div>
 
+        <div class="overflow-x-auto">
+            <table class="min-w-full text-sm">
+                <thead class="bg-slate-100 border-t border-stroke">
+                    <tr>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700"></th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'Id'|trans, 'orders.uid') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'Typ'|trans, 'orders.type') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{'draft'|trans}}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{'virtual'|trans}}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'ordernumber'|trans, 'orders.alias') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'createdat'|trans, 'orders.created') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'Name'|trans, 'contact.username') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{ knp_pagination_sortable(pagination, 'wkpos1'|trans, 'orders.basketfield1') }}</th>
+                        <th class="px-2 py-3 text-left font-medium text-gray-700">{{'re'|trans}}</th>
+                        <th class="px-2 py-3 text-right font-medium text-gray-700">{{'grossprice'|trans}}</th>
+                        <th class="px-2 py-3 text-right font-medium text-gray-700">Aktionen</th>
+                    </tr>
+                </thead>
+                <tbody>
                 {% for order in pagination %}
-                {% set orderObj = orderService.getOrderByUuid(order.uuid, true) %}
-                <div class="row border-top border-dark" style="{% if orderStatuse.getStatusColor(order.status) != '' %}background-color: {{ orderStatuse.getStatusColor(order.status) }}{% endif %}">
-                    <div class="col-2 p-1">
-                        <div class="row">
-                            <div class="col-2"><i class="fa fa-plus toogle_list_detail_view" data-uuid="{{ order.uuid }}" style="cursor: pointer;" data-target="rows-{{ order.uid }}" aria-hidden="true"></i></div>
-                            <div class="col-3">{{ order.uid }}</div>
-                            <div class="col-2">{{ orderObj.getTypeAsString() }}</div>
-                            <div class="col-2">{% if orderObj.isDraft() %}<span class="badge bg-warning" data-bs-toggle="tooltip" data-bs-placement="bottom">{{'yes'|trans}}</span>{% else %}<span class="badge bg-secondary">{{'no'|trans}}</span>{% endif %}</div>
-                            <div class="col-2">{% if order.contact.virtual %}<span class="badge bg-warning" data-bs-toggle="tooltip" data-bs-placement="bottom">{{'yes'|trans}}</span>{% else %}<span class="badge bg-secondary">{{'no'|trans}}</span>{% endif %}</div>
-                        </div>
-                    </div>
-                    <div class="col-1 p-1">{{ order.alias }}</div>
-                    <div class="col-1 p-1">{{ order.created|date('d.m.Y H:i:s') }}</div>
-                    <div class="col-2 p-1"><a href="mailto:{{ order.contact.username }}">{{ order.contact.username }}</a><br/><br/><a href="/apps/backend/contact/edit/edit/{{ order.contact.uuid }}">{{ order.contact.firstname }} {{ order.contact.lastname }}</a></div>
-                    <div class="col-1 p-1">{{ order.basketfield1 }} {{ order.basketfield2 }}</div>
-                    <div class="col-2 p-1"><small>{{ orderObj.getInvoiceAddress().company }}<br/>{{ orderObj.getInvoiceAddress().firstname }} {{ orderObj.getInvoiceAddress().lastname }}<br/>
+                    {% set orderObj = orderService.getOrderByUuid(order.uuid, true) %}
+                    <tr class="border-t border-stroke hover:bg-gray-50" {% if orderStatuse.getStatusColor(order.status) != '' %}style="background-color: {{ orderStatuse.getStatusColor(order.status) }};"{% endif %}>
+                        <td class="px-2 py-3">
+                            <i class="fa fa-plus toogle_list_detail_view cursor-pointer text-gray-600 hover:text-psc-500" data-uuid="{{ order.uuid }}" data-target="rows-{{ order.uuid }}"></i>
+                        </td>
+                        <td class="px-2 py-3 font-medium">{{ order.uid }}</td>
+                        <td class="px-2 py-3">{{ orderObj.getTypeAsString() }}</td>
+                        <td class="px-2 py-3">
+                            {% if orderObj.isDraft() %}
+                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">{{'yes'|trans}}</span>
+                            {% else %}
+                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-gray-100 text-gray-800">{{'no'|trans}}</span>
+                            {% endif %}
+                        </td>
+                        <td class="px-2 py-3">
+                            {% if order.contact.virtual %}
+                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">{{'yes'|trans}}</span>
+                            {% else %}
+                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-gray-100 text-gray-800">{{'no'|trans}}</span>
+                            {% endif %}
+                        </td>
+                        <td class="px-2 py-3">{{ order.alias }}</td>
+                        <td class="px-2 py-3 whitespace-nowrap">{{ order.created|date('d.m.Y H:i') }}</td>
+                        <td class="px-2 py-3">
+                            <a href="mailto:{{ order.contact.username }}" class="text-psc-500 hover:underline block">{{ order.contact.username }}</a>
+                            <a href="/apps/backend/contact/edit/edit/{{ order.contact.uuid }}" class="text-gray-600 hover:underline text-xs block mt-1">{{ order.contact.firstname }} {{ order.contact.lastname }}</a>
+                        </td>
+                        <td class="px-2 py-3">{{ order.basketfield1 }} {{ order.basketfield2 }}</td>
+                        <td class="px-2 py-3 text-xs">
+                            {{ orderObj.getInvoiceAddress().company }}<br/>
+                            {{ orderObj.getInvoiceAddress().firstname }} {{ orderObj.getInvoiceAddress().lastname }}<br/>
                             {{ orderObj.getInvoiceAddress().street }} {{ orderObj.getInvoiceAddress().houseNumber }}<br/>
-                            {{ orderObj.getInvoiceAddress().zip }} {{ orderObj.getInvoiceAddress().city }}</small></div>
-                    <div class="col-1 p-1 text-end">{{ order.netto|number_format(2, ',', '.') }}€ <strong>({{ order.brutto|number_format(2, ',', '.') }}€)</strong></div>
-                    <div class="col-2 p-1 text-end"><div class="btn-group btn-group-sm w-100 mb-1">
-                            <button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                {{ orderStatuse.getStatusText(order.status) }}
-                            </button>
-                            <div class="dropdown-menu">
-                                {% for status in orderStatuse.getOrderStatuse %}
-                                    <a class="dropdown-item" href="{{ path("psc_shop_order_backend_list_switchstatus", {order: order.uuid, status: status.code}) }}">{{ status.internalName|trans({}, 'status') }}</a>
-                                {% endfor %}
+                            {{ orderObj.getInvoiceAddress().zip }} {{ orderObj.getInvoiceAddress().city }}
+                        </td>
+                        <td class="px-2 py-3 text-right whitespace-nowrap">
+                            {{ order.netto|number_format(2, ',', '.') }}€<br/>
+                            <strong>({{ order.brutto|number_format(2, ',', '.') }}€)</strong>
+                        </td>
+                        <td class="px-2 py-3 text-right">
+                            <div class="flex flex-col gap-1 min-w-[180px]">
+                                <div class="relative inline-block text-left w-full">
+                                    <button type="button" class="inline-flex justify-between items-center w-full px-3 py-1.5 text-xs font-medium text-white bg-psc-500 hover:bg-psc-600 rounded-sm shadow-sm">
+                                        {{ orderStatuse.getStatusText(order.status) }}
+                                        <svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
+                                        </svg>
+                                    </button>
+                                    <div class="hidden absolute right-0 z-10 mt-1 w-48 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
+                                        {% for status in orderStatuse.getOrderStatuse %}
+                                            <a href="{{ path("psc_shop_order_backend_list_switchstatus", {order: order.uuid, status: status.code}) }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">{{ status.internalName|trans({}, 'status') }}</a>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+                                <div class="flex gap-1">
+                                    <a href="{{ path("psc_shop_order_backend_detail_package_download", {uuid: order.uuid}) }}" target="_blank" class="flex-1 inline-flex items-center justify-center gap-1 px-2 py-1.5 text-xs font-medium text-white bg-green-600 hover:bg-green-700 rounded-sm">
+                                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-3 h-3">
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3" />
+                                        </svg>
+                                        Package
+                                    </a>
+                                    <a href="{{ path("psc_shop_order_backend_detail_show", {uuid: order.uuid}) }}" class="flex-1 inline-flex items-center justify-center gap-1 px-2 py-1.5 text-xs font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-sm">
+                                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-3 h-3">
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" />
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                                        </svg>
+                                        Details
+                                    </a>
+                                </div>
+                                <a href="{{ path("psc_shop_order_backend_upload_deleteAll", {uuid: order.uuid}) }}" class="inline-flex items-center justify-center gap-1 px-2 py-1.5 text-xs font-medium text-white bg-red-600 hover:bg-red-700 rounded-sm">
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-3 h-3">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
+                                    </svg>
+                                    Uploads löschen
+                                </a>
                             </div>
-                        </div>
-                        <a href="{{ path("psc_shop_order_backend_detail_package_download", {uuid: order.uuid}) }}" target="_blank" class="btn btn-success btn-sm  w-50 float-start"><span class="fa fa-download"></span> Package</a>
-                        <a href="{{ path("psc_shop_order_backend_detail_show", {uuid: order.uuid}) }}" class="btn btn-info btn-sm  w-50"><span class="fa fa-edit"></span> {{'details'|trans}}</a>
-                        <a href="{{ path("psc_shop_order_backend_upload_deleteAll", {uuid: order.uuid}) }}" class="btn btn-danger btn-sm  w-100 mt-1"><span class="fa fa-trash"></span> Uploads löschen</a>
-
-                    </div>
-                    <span id="rows-{{ order.uuid }}"></span>
-                </div>
+                        </td>
+                    </tr>
+                    <tr id="rows-{{ order.uuid }}"></tr>
                 {% endfor %}
+                </tbody>
+            </table>
+        </div>
 
-                <div class="navigation">
-                    {{ knp_pagination_render(pagination) }}
-                </div>
-            </div>
+        <div class="mt-4 px-4">
+            {{ knp_pagination_render(pagination, 'tailwind_pagination.html.twig', {}, {
+                'sortableTemplate': 'tailwind_sortable.html.twig'
+            }) }}
         </div>
     </div>
+</div>
 {% endblock %}
\ No newline at end of file
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/create.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/create.html.twig
index e64df353a..b87876d29 100644
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/create.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/create.html.twig
@@ -1,77 +1,74 @@
-{% extends 'backend_base.html.twig' %}
-{% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa fa-question-circle"></i>
-                    Hilfetext <span>>
-                    anlegen </span>
-                </h3>
-            </div>
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 text-end">
-                <a href="{{ path("psc_system_help_list") }}" class="btn btn-default btn-sm"><i class="fa fa-lg fa-fw fa-arrow-left"></i> Zurück</a>
-            </div>
-        </div>
+{% extends 'backend_tailwind_base.html.twig' %}
+{% form_theme form 'tailwind_formtheme.html.twig' %}
+
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+            </svg>
+            Hilfetext <span class="text-gray-500">Anlegen</span>
+        </h1>
     </div>
-
-    <div class="body">
-        {{ form_start(form, { 'attr': {'class': ''}}) }}
-        <div class="panel">
-            <div class="header">
-                <h4>Anlegen</h4>
-            </div>
-            <div class="body">
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.name) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.name) }}
-                        </div>
-                        {{ form_errors(form.name) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.internName) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.internName) }}
-                        </div>
-                        {{ form_errors(form.internName) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.helpTitle) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.helpTitle) }}
-                        </div>
-                        {{ form_errors(form.helpTitle) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.helpText) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.helpText, {attr: {'class': 'form-control summernote'}}) }}
-                        </div>
-                        {{ form_errors(form.helpText) }}
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="panel">
-            <div class="body">
-                <div class="row mb-3">
-                    <div class="col-md-offset-1 col-md-11">
-                        <button class="btn btn-primary btn-sm">Speichern</button>
-                    </div>
-                </div>
-            </div>
-        </div>
-        {{ form_end(form) }}
+    <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
+        <a href="{{ path("psc_system_help_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />
+            </svg>
+            Zurück
+        </a>
     </div>
-
-
+{% endblock %}
+
+{% block body %}
+<div class="w-full flex flex-col gap-6">
+    {{ form_start(form, {attr: {class: ''}}) }}
+
+    <div class="tab-group flex-none md:flex w-full" data-dui-orientation="vertical">
+        <div role="tablist" class="relative mr-5 rounded-sm flex flex-col p-1 w-full md:w-2/12">
+            <div class="tab-indicator absolute left-0 w-1 bg-psc-500 transition-transform duration-300"></div>
+            <a href="#" class="tab-link flex items-center text-sm active px-4 py-2 relative" data-dui-tab-target="details">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+                </svg>
+                Details
+            </a>
+        </div>
+
+        <div class="rounded-sm w-full border bg-white p-5 shadow-lg dark:border-strokedark dark:bg-boxdark">
+            <div id="details" class="tab-content w-full text-stone-500 text-sm block">
+                <h6 class="text-sm mt-3 mb-6 font-bold uppercase">Details</h6>
+                <div class="flex flex-wrap">
+                    <div class="w-full lg:w-6/12 px-4">
+                        {{ form_row(form.name) }}
+                    </div>
+                    <div class="w-full lg:w-6/12 px-4">
+                        {{ form_row(form.internName) }}
+                    </div>
+                </div>
+                <div class="flex flex-wrap">
+                    <div class="w-full px-4">
+                        {{ form_row(form.helpTitle) }}
+                    </div>
+                </div>
+                <div class="flex flex-wrap">
+                    <div class="w-full px-4">
+                        {{ form_row(form.helpText, {attr: {class: 'summernote'}}) }}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="text-end my-2">
+        <button type="submit" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+            </svg>
+            Speichern
+        </button>
+    </div>
+
+    {{ form_end(form) }}
+</div>
 {% endblock %}
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/delete.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/delete.html.twig
index 89acf5058..e46d4af7a 100644
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/delete.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/delete.html.twig
@@ -1,40 +1,65 @@
-{% extends 'backend_base.html.twig' %}
+{% extends 'backend_tailwind_base.html.twig' %}
 
-{% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa-fw fa fa-question-circle"></i>
-                    Helptext <span>>
-                    Löschen</span>
-                </h3>
-            </div>
-        </div>
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+            </svg>
+            Hilfetext <span class="text-gray-500">Löschen</span>
+        </h1>
     </div>
-
-    <div class="body">
-        <div class="panel">
-            <div class="header">
-                <h4>Helptext löschen?</h4>
-            </div>
-            <div class="body">
-
-                <h5>{{ help.name }}</h5>
-
-
-                {{ form_start(form, { 'attr': {'class': ''}}) }}
-                <div class="row mb-3">
-                    <label class="col-md-1 form-control-label"></label>
-                    <div class="col-md-1">
-                        {{ form_widget(form.yes, {attr: {class: 'btn btn-lg btn-warning btn-sm'}}) }}
-                    </div>
-                    <div class="col-md-1">
-                        {{ form_widget(form.no, {attr: {class: 'btn btn-lg btn-primary btn-sm'}}) }}
-                    </div>
-                </div>
-                {{ form_end(form) }}
-            </div>
-        </div>
+    <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
+        <a href="{{ path("psc_system_help_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />
+            </svg>
+            Zurück
+        </a>
     </div>
 {% endblock %}
+
+{% block body %}
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-7">
+            <h4 class="text-lg font-semibold text-gray-900 mb-4">Hilfetext löschen?</h4>
+            <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+                        </svg>
+                    </div>
+                    <div class="ml-3">
+                        <p class="text-sm text-yellow-700 font-medium">
+                            {{ help.name }}
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        {{ form_start(form, {attr: {class: ''}}) }}
+        <div class="flex gap-4 px-7 items-center">
+            <button type="submit" name="{{ form.yes.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+                Ja, löschen
+            </button>
+            <button type="submit" name="{{ form.no.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem] border border-gray-300">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
+                </svg>
+                Nein, abbrechen
+            </button>
+        </div>
+        <div class="hidden">
+            {{ form_widget(form.yes) }}
+            {{ form_widget(form.no) }}
+        </div>
+        {{ form_end(form) }}
+    </div>
+</div>
+{% endblock %}
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/edit.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/edit.html.twig
index 0da21d3a8..b91b8f372 100644
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/edit.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/edit.html.twig
@@ -1,77 +1,74 @@
-{% extends 'backend_base.html.twig' %}
-{% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa fa-question-circle"></i>
-                    Hilfetext <span>>
-                    bearbeiten </span>
-                </h3>
-            </div>
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 text-end">
-                <a href="{{ path("psc_system_help_list") }}" class="btn btn-default btn-sm"><i class="fa fa-lg fa-fw fa-arrow-left"></i> Zurück</a>
-            </div>
-        </div>
+{% extends 'backend_tailwind_base.html.twig' %}
+{% form_theme form 'tailwind_formtheme.html.twig' %}
+
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+            </svg>
+            Hilfetext <span class="text-gray-500">Bearbeiten</span>
+        </h1>
     </div>
-
-    <div class="body">
-        {{ form_start(form, { 'attr': {'class': ''}}) }}
-        <div class="panel">
-            <div class="header">
-                <h4>Anlegen</h4>
-            </div>
-            <div class="body">
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.name) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.name) }}
-                        </div>
-                        {{ form_errors(form.name) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.internName) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.internName) }}
-                        </div>
-                        {{ form_errors(form.internName) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.helpTitle) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.helpTitle) }}
-                        </div>
-                        {{ form_errors(form.helpTitle) }}
-                    </div>
-                </div>
-                <div class="col-md-12">
-                    <div class="row mb-3">
-                        {{ form_label(form.helpText) }}
-                        <div class="col-md-8">
-                            {{ form_widget(form.helpText, {attr: {'class': 'form-control summernote'}}) }}
-                        </div>
-                        {{ form_errors(form.helpText) }}
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="panel">
-            <div class="body">
-                <div class="row mb-3">
-                    <div class="col-md-offset-1 col-md-11">
-                        <button class="btn btn-primary btn-sm">Speichern</button>
-                    </div>
-                </div>
-            </div>
-        </div>
-        {{ form_end(form) }}
+    <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
+        <a href="{{ path("psc_system_help_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />
+            </svg>
+            Zurück
+        </a>
     </div>
-
-
+{% endblock %}
+
+{% block body %}
+<div class="w-full flex flex-col gap-6">
+    {{ form_start(form, {attr: {class: ''}}) }}
+
+    <div class="tab-group flex-none md:flex w-full" data-dui-orientation="vertical">
+        <div role="tablist" class="relative mr-5 rounded-sm flex flex-col p-1 w-full md:w-2/12">
+            <div class="tab-indicator absolute left-0 w-1 bg-psc-500 transition-transform duration-300"></div>
+            <a href="#" class="tab-link flex items-center text-sm active px-4 py-2 relative" data-dui-tab-target="details">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+                </svg>
+                Details
+            </a>
+        </div>
+
+        <div class="rounded-sm w-full border bg-white p-5 shadow-lg dark:border-strokedark dark:bg-boxdark">
+            <div id="details" class="tab-content w-full text-stone-500 text-sm block">
+                <h6 class="text-sm mt-3 mb-6 font-bold uppercase">Details</h6>
+                <div class="flex flex-wrap">
+                    <div class="w-full lg:w-6/12 px-4">
+                        {{ form_row(form.name) }}
+                    </div>
+                    <div class="w-full lg:w-6/12 px-4">
+                        {{ form_row(form.internName) }}
+                    </div>
+                </div>
+                <div class="flex flex-wrap">
+                    <div class="w-full px-4">
+                        {{ form_row(form.helpTitle) }}
+                    </div>
+                </div>
+                <div class="flex flex-wrap">
+                    <div class="w-full px-4">
+                        {{ form_row(form.helpText, {attr: {class: 'summernote'}}) }}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="text-end my-2">
+        <button type="submit" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+            </svg>
+            Speichern
+        </button>
+    </div>
+
+    {{ form_end(form) }}
+</div>
 {% endblock %}
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/index.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/index.html.twig
index a98f54048..58c17652e 100644
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/index.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/help/index.html.twig
@@ -1,55 +1,64 @@
-{% extends 'backend_base.html.twig' %}
+{% extends 'backend_tailwind_base.html.twig' %}
 
-{% block body %}
-    <div class="header">
-        <div class="row">
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
-                <h3>
-                    <i class="fa-fw fa fa-question-circle"></i>
-                    Text <span>>
-                    Liste </span>
-                </h3>
-            </div>
-            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 text-end">
-
-            </div>
-        </div>
+{% block header %}
+    <div>
+        <h1 class="text-psc text-2xl font-medium flex flex-row gap-1">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-8">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+            </svg>
+            Hilfetexte <span class="text-gray-500">Liste</span>
+        </h1>
     </div>
-    <div class="body">
-        <div class="panel">
-            <div class="body">
-                <a class="btn btn-info btn-sm" href="{{ path("psc_system_help_create") }}">Hilfetext
-                    hinzufügen</a>
-            </div>
-        </div>
-
-        <div class="panel">
-            <div class="body">
-                <h2>Hilfetexte</h2>
-                <table class="table">
-                    <thead class="thead-dark">
-                    <tr>
-                        <th>Name</th>
-                        <th>Interner Name</th>
-                        <th>Hilfetext</th>
-                        <th></th>
-                    </tr>
-                    </thead>
-                    <tbody>
-                    {% for help in helpItems %}
-                        <tr {% if loop.index is odd %}class="color"{% endif %}>
-                            <td>{{ help.name }}</td>
-                            <td>{{ help.internName }}</td>
-                            <td>{{ help.helpText }}</td>
-                            <td class="text-end">
-                                <a href="{{ path("psc_system_help_edit", {uuid: help.id}) }}" class="btn btn-info btn-sm"><span class="fa fa-edit"></span></a>
-                                <a href="{{ path("psc_system_help_delete", {uuid: help.id}) }}" class="btn btn-danger btn-sm"><span class="fa fa-trash"></span></a>
-                            </td>
-                        </tr>
-                    {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-        </div>
+    <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
+        <a href="{{ path("psc_system_help_create") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+            </svg>
+            Hilfetext hinzufügen
+        </a>
     </div>
 {% endblock %}
+
+{% block body %}
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="">
+            <div class="w-full grid grid-cols-12 border-t border-stroke px-4 bg-slate-100 py-4.5 dark:border-strokedark md:px-6 2xl:px-7.5">
+                <div class="col-span-3 px-2 py-3">
+                    <p class="font-medium">Name</p>
+                </div>
+                <div class="col-span-3 px-2 py-3">
+                    <p class="font-medium">Interner Name</p>
+                </div>
+                <div class="col-span-5 px-2 py-3">
+                    <p class="font-medium">Hilfetext</p>
+                </div>
+                <div class="col-span-1 px-2 py-3"></div>
+            </div>
+            {% for help in helpItems %}
+                <div class="w-full grid grid-cols-12 border-t border-stroke px-4 py-4.5 dark:border-strokedark md:px-6 2xl:px-7.5">
+                    <div class="col-span-3 px-2 py-3">{{ help.name }}</div>
+                    <div class="col-span-3 px-2 py-3">{{ help.internName }}</div>
+                    <div class="col-span-5 px-2 py-3">
+                        <div class="truncate">
+                            {{ help.helpText|striptags }}
+                        </div>
+                    </div>
+                    <div class="col-span-1 px-2 py-3 text-end flex flex-row gap-2 justify-end">
+                        <a href="{{ path("psc_system_help_edit", {uuid: help.id}) }}" class="">
+                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="table-icon">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
+                            </svg>
+                        </a>
+                        <a href="{{ path("psc_system_help_delete", {uuid: help.id}) }}" class="">
+                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="table-icon">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                            </svg>
+                        </a>
+                    </div>
+                </div>
+            {% endfor %}
+        </div>
+    </div>
+</div>
+{% endblock %}
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/paper/delete.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/paper/delete.html.twig
index c816ddbe7..740bf6f06 100755
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/paper/delete.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/paper/delete.html.twig
@@ -10,7 +10,7 @@
         </h1>
     </div>
     <div class="flex flex-wrap items-center gap-4 justify-start shrink-0">
-        <a href="{{ path("psc_system_paper_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-meta-3 hover:bg-meta-3/90 hover:ring-2 hover:ring-meta-3 hover:ring-offset-2 min-h-[2.25rem]">
+        <a href="{{ path("psc_system_paper_list") }}" class="inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]">
             <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
                 <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />
             </svg>
@@ -20,18 +20,46 @@
 {% endblock %}
 
 {% block body %}
-<div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
-    <h2 class="text-psc text-xl font-medium mb-4">Papier löschen?</h2>
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-7">
+            <h4 class="text-lg font-semibold text-gray-900 mb-4">Papier löschen?</h4>
+            <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+                        </svg>
+                    </div>
+                    <div class="ml-3">
+                        <p class="text-sm text-yellow-700 font-medium">
+                            {{ paper.description1 }}
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
 
-    <div class="mb-6">
-        <p class="text-lg font-medium">{{ paper.description1 }}</p>
+        {{ form_start(form, {attr: {class: ''}}) }}
+        <div class="flex gap-4 px-7 items-center">
+            <button type="submit" name="{{ form.yes.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+                Ja, löschen
+            </button>
+            <button type="submit" name="{{ form.no.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem] border border-gray-300">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
+                </svg>
+                Nein, abbrechen
+            </button>
+        </div>
+        <div class="hidden">
+            {{ form_widget(form.yes) }}
+            {{ form_widget(form.no) }}
+        </div>
+        {{ form_end(form) }}
     </div>
-
-    {{ form_start(form, { 'attr': {'class': ''}}) }}
-    <div class="flex gap-4">
-        {{ form_widget(form.yes, {attr: {class: 'inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-warning hover:bg-warning/90 hover:ring-2 hover:ring-warning hover:ring-offset-2 min-h-[2.25rem]'}}) }}
-        {{ form_widget(form.no, {attr: {class: 'inline-flex items-center justify-center py-1 gap-1 font-medium rounded-sm px-4 text-sm text-white shadow-lg bg-psc-500 hover:bg-psc-600 hover:ring-2 hover:ring-psc-500 hover:ring-offset-2 min-h-[2.25rem]'}}) }}
-    </div>
-    {{ form_end(form) }}
 </div>
 {% endblock %}
\ No newline at end of file
diff --git a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/status/delete.html.twig b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/status/delete.html.twig
index 520e2f9df..6e1762ed3 100755
--- a/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/status/delete.html.twig
+++ b/src/new/src/PSC/System/SettingsBundle/Resources/views/backend/status/delete.html.twig
@@ -20,40 +20,46 @@
 {% endblock %}
 
 {% block body %}
-<div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
-    <div class="mb-6">
-        <h4 class="text-lg font-semibold text-gray-900 mb-4">Status löschen?</h4>
-        <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
-            <div class="flex">
-                <div class="flex-shrink-0">
-                    <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
-                        <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
-                    </svg>
-                </div>
-                <div class="ml-3">
-                    <p class="text-sm text-yellow-700 font-medium">
-                        {{ status.internalName }}
-                    </p>
+<div class="flex flex-col gap-6">
+    <div class="rounded-sm border bg-white px-7.5 py-6 shadow-lg dark:border-strokedark dark:bg-boxdark">
+        <div class="mb-6 px-7">
+            <h4 class="text-lg font-semibold text-gray-900 mb-4">Status löschen?</h4>
+            <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+                        </svg>
+                    </div>
+                    <div class="ml-3">
+                        <p class="text-sm text-yellow-700 font-medium">
+                            {{ status.internalName }}
+                        </p>
+                    </div>
                 </div>
             </div>
         </div>
-    </div>
 
-    {{ form_start(form, {attr: {class: ''}}) }}
-    <div class="flex gap-4 items-center">
-        <button type="submit" name="yes" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
-                <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
-            </svg>
-            Ja, löschen
-        </button>
-        <button type="submit" name="no" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem]">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
-                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
-            </svg>
-            Nein, abbrechen
-        </button>
+        {{ form_start(form, {attr: {class: ''}}) }}
+        <div class="flex gap-4 px-7 items-center">
+            <button type="submit" name="{{ form.yes.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-white shadow-lg bg-red-500 hover:bg-red-600 hover:ring-2 hover:ring-red-500 hover:ring-offset-2 min-h-[2.25rem]">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+                Ja, löschen
+            </button>
+            <button type="submit" name="{{ form.no.vars.full_name }}" value="1" class="inline-flex items-center justify-center py-2 gap-1 font-medium rounded-sm px-6 text-sm text-gray-700 shadow-lg bg-white hover:bg-gray-50 hover:ring-2 hover:ring-gray-300 hover:ring-offset-2 min-h-[2.25rem] border border-gray-300">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="button-icon">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
+                </svg>
+                Nein, abbrechen
+            </button>
+        </div>
+        <div class="hidden">
+            {{ form_widget(form.yes) }}
+            {{ form_widget(form.no) }}
+        </div>
+        {{ form_end(form) }}
     </div>
-    {{ form_end(form) }}
 </div>
 {% endblock %}
\ No newline at end of file
diff --git a/src/new/var/tailwind/backend.built.css b/src/new/var/tailwind/backend.built.css
index ba1756f31..27ca332eb 100644
--- a/src/new/var/tailwind/backend.built.css
+++ b/src/new/var/tailwind/backend.built.css
@@ -922,6 +922,14 @@ html {
   grid-column: span 2 / span 2;
 }
 
+.col-span-3{
+  grid-column: span 3 / span 3;
+}
+
+.col-span-5{
+  grid-column: span 5 / span 5;
+}
+
 .col-span-6{
   grid-column: span 6 / span 6;
 }
@@ -1057,10 +1065,6 @@ html {
   margin-top: 1.5rem;
 }
 
-.mt-8{
-  margin-top: 2rem;
-}
-
 .block{
   display: block;
 }
@@ -1157,6 +1161,10 @@ html {
   height: 0.5rem;
 }
 
+.h-3{
+  height: 0.75rem;
+}
+
 .h-4{
   height: 1rem;
 }
@@ -1209,6 +1217,10 @@ html {
   width: 2.75rem;
 }
 
+.w-3{
+  width: 0.75rem;
+}
+
 .w-4{
   width: 1rem;
 }
@@ -1241,19 +1253,27 @@ html {
   width: 100vw;
 }
 
-.min-w-0{
-  min-width: 0px;
+.min-w-\[180px\]{
+  min-width: 180px;
 }
 
 .min-w-\[2\.5rem\]{
   min-width: 2.5rem;
 }
 
+.min-w-\[300px\]{
+  min-width: 300px;
+}
+
 .min-w-fit{
   min-width: -moz-fit-content;
   min-width: fit-content;
 }
 
+.min-w-full{
+  min-width: 100%;
+}
+
 .max-w-7xl{
   max-width: 80rem;
 }
@@ -1266,10 +1286,6 @@ html {
   max-width: 20em;
 }
 
-.max-w-md{
-  max-width: 28rem;
-}
-
 .max-w-xl{
   max-width: 36rem;
 }
@@ -1390,6 +1406,10 @@ html {
   grid-template-columns: repeat(10, minmax(0, 1fr));
 }
 
+.grid-cols-12{
+  grid-template-columns: repeat(12, minmax(0, 1fr));
+}
+
 .grid-cols-4{
   grid-template-columns: repeat(4, minmax(0, 1fr));
 }
@@ -1703,6 +1723,11 @@ html {
   border-color: rgb(250 204 21 / var(--tw-border-opacity));
 }
 
+.bg-blue-600{
+  --tw-bg-opacity: 1;
+  background-color: rgb(37 99 235 / var(--tw-bg-opacity));
+}
+
 .bg-blue-700{
   --tw-bg-opacity: 1;
   background-color: rgb(29 78 216 / var(--tw-bg-opacity));
@@ -1737,6 +1762,11 @@ html {
   background-color: rgb(220 252 231 / var(--tw-bg-opacity));
 }
 
+.bg-green-600{
+  --tw-bg-opacity: 1;
+  background-color: rgb(22 163 74 / var(--tw-bg-opacity));
+}
+
 .bg-indigo-500{
   --tw-bg-opacity: 1;
   background-color: rgb(99 102 241 / var(--tw-bg-opacity));
@@ -1767,6 +1797,11 @@ html {
   background-color: rgb(239 68 68 / var(--tw-bg-opacity));
 }
 
+.bg-red-600{
+  --tw-bg-opacity: 1;
+  background-color: rgb(220 38 38 / var(--tw-bg-opacity));
+}
+
 .bg-slate-100{
   --tw-bg-opacity: 1;
   background-color: rgb(241 245 249 / var(--tw-bg-opacity));
@@ -1791,6 +1826,11 @@ html {
   background-color: rgb(255 255 255 / 0.5);
 }
 
+.bg-yellow-100{
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 249 195 / var(--tw-bg-opacity));
+}
+
 .bg-yellow-50{
   --tw-bg-opacity: 1;
   background-color: rgb(254 252 232 / var(--tw-bg-opacity));
@@ -1895,6 +1935,11 @@ html {
   padding-bottom: 0.25rem;
 }
 
+.py-1\.5{
+  padding-top: 0.375rem;
+  padding-bottom: 0.375rem;
+}
+
 .py-12{
   padding-top: 3rem;
   padding-bottom: 3rem;
@@ -1941,10 +1986,6 @@ html {
   padding-top: 0.5rem;
 }
 
-.pt-6{
-  padding-top: 1.5rem;
-}
-
 .text-left{
   text-align: left;
 }
@@ -1953,6 +1994,10 @@ html {
   text-align: center;
 }
 
+.text-right{
+  text-align: right;
+}
+
 .text-justify{
   text-align: justify;
 }
@@ -2137,6 +2182,11 @@ html {
   color: rgb(250 204 21 / var(--tw-text-opacity));
 }
 
+.text-yellow-600{
+  --tw-text-opacity: 1;
+  color: rgb(202 138 4 / var(--tw-text-opacity));
+}
+
 .text-yellow-700{
   --tw-text-opacity: 1;
   color: rgb(161 98 7 / var(--tw-text-opacity));
@@ -2239,10 +2289,19 @@ html {
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.ring-black{
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));
+}
+
 .ring-black\/5{
   --tw-ring-color: rgb(0 0 0 / 0.05);
 }
 
+.ring-opacity-5{
+  --tw-ring-opacity: 0.05;
+}
+
 .blur{
   --tw-blur: blur(8px);
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -2605,6 +2664,11 @@ html {
   background-color: rgb(107 114 128 / 0.05);
 }
 
+.hover\:bg-green-700:hover{
+  --tw-bg-opacity: 1;
+  background-color: rgb(21 128 61 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-indigo-600:hover{
   --tw-bg-opacity: 1;
   background-color: rgb(79 70 229 / var(--tw-bg-opacity));
@@ -2629,9 +2693,9 @@ html {
   background-color: rgb(220 38 38 / var(--tw-bg-opacity));
 }
 
-.hover\:bg-slate-200:hover{
+.hover\:bg-red-700:hover{
   --tw-bg-opacity: 1;
-  background-color: rgb(226 232 240 / var(--tw-bg-opacity));
+  background-color: rgb(185 28 28 / var(--tw-bg-opacity));
 }
 
 .hover\:bg-white:hover{
@@ -2659,11 +2723,20 @@ html {
   color: rgb(17 24 39 / var(--tw-text-opacity));
 }
 
+.hover\:text-psc-500:hover{
+  --tw-text-opacity: 1;
+  color: rgb(234 100 27 / var(--tw-text-opacity));
+}
+
 .hover\:text-white:hover{
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+.hover\:underline:hover{
+  text-decoration-line: underline;
+}
+
 .hover\:shadow-lg:hover{
   --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
@@ -3185,10 +3258,6 @@ html {
     width: 16.666667%;
   }
 
-  .md\:w-48{
-    width: 12rem;
-  }
-
   .md\:w-5\/12{
     width: 41.666667%;
   }
@@ -3222,14 +3291,6 @@ html {
     flex-direction: row;
   }
 
-  .md\:flex-col{
-    flex-direction: column;
-  }
-
-  .md\:overflow-x-visible{
-    overflow-x: visible;
-  }
-
   .md\:px-6{
     padding-left: 1.5rem;
     padding-right: 1.5rem;