diff --git a/components/lib/autocomplete/style/AutoCompleteStyle.js b/components/lib/autocomplete/style/AutoCompleteStyle.js
index 9c1cb7f20..8b240dad3 100644
--- a/components/lib/autocomplete/style/AutoCompleteStyle.js
+++ b/components/lib/autocomplete/style/AutoCompleteStyle.js
@@ -111,7 +111,7 @@ const classes = {
         {
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-focus': instance.focused,
             'p-autocomplete-dd': props.dropdown,
             'p-autocomplete-multiple': props.multiple,
diff --git a/components/lib/calendar/style/CalendarStyle.js b/components/lib/calendar/style/CalendarStyle.js
index 95c5c731d..7691ad1ca 100644
--- a/components/lib/calendar/style/CalendarStyle.js
+++ b/components/lib/calendar/style/CalendarStyle.js
@@ -167,7 +167,7 @@ const classes = {
             'p-calendar-timeonly': props.timeOnly,
             'p-calendar-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': state.focused,
             'p-focus': state.focused || state.overlayVisible
diff --git a/components/lib/cascadeselect/style/CascadeSelectStyle.js b/components/lib/cascadeselect/style/CascadeSelectStyle.js
index d851e4294..d0eb38711 100644
--- a/components/lib/cascadeselect/style/CascadeSelectStyle.js
+++ b/components/lib/cascadeselect/style/CascadeSelectStyle.js
@@ -104,7 +104,7 @@ const classes = {
         {
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
diff --git a/components/lib/checkbox/style/CheckboxStyle.js b/components/lib/checkbox/style/CheckboxStyle.js
index 78caf15ae..a7fdf1b78 100644
--- a/components/lib/checkbox/style/CheckboxStyle.js
+++ b/components/lib/checkbox/style/CheckboxStyle.js
@@ -28,7 +28,7 @@ const classes = {
             'p-highlight': instance.checked,
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ],
     box: 'p-checkbox-box',
diff --git a/components/lib/chips/style/ChipsStyle.js b/components/lib/chips/style/ChipsStyle.js
index 367d20050..5e2c5a4d4 100644
--- a/components/lib/chips/style/ChipsStyle.js
+++ b/components/lib/chips/style/ChipsStyle.js
@@ -56,7 +56,7 @@ const classes = {
         {
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-focus': instance.focused,
             'p-inputwrapper-filled': (props.modelValue && props.modelValue.length) || (instance.inputValue && instance.inputValue.length),
             'p-inputwrapper-focus': instance.focused
diff --git a/components/lib/dropdown/style/DropdownStyle.js b/components/lib/dropdown/style/DropdownStyle.js
index e2733cbee..c1a7b471a 100644
--- a/components/lib/dropdown/style/DropdownStyle.js
+++ b/components/lib/dropdown/style/DropdownStyle.js
@@ -105,7 +105,7 @@ const classes = {
         {
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-dropdown-clearable': props.showClear,
             'p-focus': state.focused,
             'p-inputwrapper-filled': instance.hasSelectedOption,
diff --git a/components/lib/inputmask/style/InputMaskStyle.js b/components/lib/inputmask/style/InputMaskStyle.js
index c3ab1eb32..b29b9c334 100644
--- a/components/lib/inputmask/style/InputMaskStyle.js
+++ b/components/lib/inputmask/style/InputMaskStyle.js
@@ -6,7 +6,7 @@ const classes = {
         {
             'p-filled': instance.filled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ]
 };
diff --git a/components/lib/inputnumber/style/InputNumberStyle.js b/components/lib/inputnumber/style/InputNumberStyle.js
index 0614a7730..f5ecd8111 100644
--- a/components/lib/inputnumber/style/InputNumberStyle.js
+++ b/components/lib/inputnumber/style/InputNumberStyle.js
@@ -115,7 +115,7 @@ const classes = {
             'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',
             'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical',
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ],
     input: 'p-inputnumber-input',
diff --git a/components/lib/inputtext/style/InputTextStyle.js b/components/lib/inputtext/style/InputTextStyle.js
index b6abf9e2a..e0924c4b4 100644
--- a/components/lib/inputtext/style/InputTextStyle.js
+++ b/components/lib/inputtext/style/InputTextStyle.js
@@ -8,7 +8,7 @@ const classes = {
             'p-inputtext-sm': props.size === 'small',
             'p-inputtext-lg': props.size === 'large',
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ]
 };
diff --git a/components/lib/multiselect/style/MultiSelectStyle.js b/components/lib/multiselect/style/MultiSelectStyle.js
index 632c75c61..38aa5709f 100644
--- a/components/lib/multiselect/style/MultiSelectStyle.js
+++ b/components/lib/multiselect/style/MultiSelectStyle.js
@@ -121,7 +121,7 @@ const classes = {
             'p-multiselect-chip': props.display === 'chip',
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue && props.modelValue.length,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
diff --git a/components/lib/password/style/PasswordStyle.js b/components/lib/password/style/PasswordStyle.js
index 522caf2a0..5fb2ea87e 100644
--- a/components/lib/password/style/PasswordStyle.js
+++ b/components/lib/password/style/PasswordStyle.js
@@ -43,7 +43,7 @@ const classes = {
             'p-inputwrapper-focus': instance.focused,
             'p-input-icon-right': props.toggleMask,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ],
     input: ({ props }) => [
diff --git a/components/lib/radiobutton/style/RadioButtonStyle.js b/components/lib/radiobutton/style/RadioButtonStyle.js
index 86c0f32fe..7828ddf90 100644
--- a/components/lib/radiobutton/style/RadioButtonStyle.js
+++ b/components/lib/radiobutton/style/RadioButtonStyle.js
@@ -41,7 +41,7 @@ const classes = {
             'p-highlight': instance.checked,
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ],
     box: 'p-radiobutton-box',
diff --git a/components/lib/textarea/style/TextareaStyle.js b/components/lib/textarea/style/TextareaStyle.js
index d809a3ca5..62e890609 100644
--- a/components/lib/textarea/style/TextareaStyle.js
+++ b/components/lib/textarea/style/TextareaStyle.js
@@ -20,7 +20,7 @@ const classes = {
             'p-filled': instance.filled,
             'p-inputtextarea-resizable ': props.autoResize,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ]
 };
diff --git a/components/lib/treeselect/style/TreeSelectStyle.js b/components/lib/treeselect/style/TreeSelectStyle.js
index 32532cf12..ae9605184 100644
--- a/components/lib/treeselect/style/TreeSelectStyle.js
+++ b/components/lib/treeselect/style/TreeSelectStyle.js
@@ -66,7 +66,7 @@ const classes = {
             'p-treeselect-chip': props.display === 'chip',
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled',
+            'p-variant-filled': props.variant === 'filled',
             'p-focus': instance.focused,
             'p-inputwrapper-filled': !instance.emptyValue,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible
diff --git a/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
index 057fc8f3a..795ed659f 100644
--- a/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
+++ b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
@@ -28,7 +28,7 @@ const classes = {
             'p-highlight': instance.active,
             'p-disabled': props.disabled,
             'p-invalid': props.invalid,
-            'p-variant': props.variant === 'filled'
+            'p-variant-filled': props.variant === 'filled'
         }
     ],
     box: 'p-checkbox-box',
diff --git a/doc/inputtext/FilledDoc.vue b/doc/inputtext/FilledDoc.vue
new file mode 100644
index 000000000..d15136a27
--- /dev/null
+++ b/doc/inputtext/FilledDoc.vue
@@ -0,0 +1,55 @@
+<template>
+    <DocSectionText v-bind="$attrs">
+        <p>Specify the <i>variant</i> property as <i>filled</i> to display the component with a higher visual emphasis than the default <i>outlined</i> style.</p>
+    </DocSectionText>
+    <div class="card flex justify-content-center">
+        <InputText v-model="value" type="text" variant="filled" />
+    </div>
+    <DocSectionCode :code="code" />
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            value: null,
+            code: {
+                basic: `
+<InputText type="text" v-model="value" />
+`,
+                options: `
+<template>
+    <div class="card flex justify-content-center">
+        <InputText v-model="value" type="text" variant="filled" />
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            value: null
+        }
+    }
+}
+<\/script>
+        
+`,
+                composition: `
+<template>
+    <div class="card flex justify-content-center">
+        <InputText v-model="value" type="text" variant="filled" />
+    </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const value = ref(null);
+<\/script>
+        `
+            }
+        };
+    }
+};
+</script>
diff --git a/layouts/AppConfigurator.vue b/layouts/AppConfigurator.vue
index 1710d0c54..0225807dd 100755
--- a/layouts/AppConfigurator.vue
+++ b/layouts/AppConfigurator.vue
@@ -11,11 +11,6 @@
                 </div>
             </section>
 
-            <section class="py-4 flex align-items-center justify-content-between border-bottom-1 surface-border">
-                <span class="text-xl font-semibold">Input Style</span>
-                <SelectButton :modelValue="inputStyle" @update:modelValue="onInputStyleChange" :options="inputStyles" optionLabel="label" optionValue="value" :allowEmpty="false" />
-            </section>
-
             <section class="py-4 flex align-items-center justify-content-between border-bottom-1 surface-border">
                 <span class="text-xl font-semibold">Ripple Effect</span>
                 <InputSwitch :modelValue="rippleActive" @update:modelValue="onRippleChange" />
@@ -359,10 +354,6 @@ export default {
             visible: false,
             scale: 14,
             scales: [12, 13, 14, 15, 16],
-            inputStyles: [
-                { label: 'Outlined', value: 'outlined' },
-                { label: 'Filled', value: 'filled' }
-            ],
             primaryFocusRing: true,
             compactMaterial: false
         };
@@ -420,9 +411,6 @@ export default {
         applyScale() {
             document.documentElement.style.fontSize = this.scale + 'px';
         },
-        onInputStyleChange(value) {
-            this.$primevue.config.inputStyle = value;
-        },
         onRippleChange(value) {
             this.$appState.ripple = value;
         },
@@ -464,9 +452,6 @@ export default {
         }
     },
     computed: {
-        inputStyle() {
-            return this.$primevue.config.inputStyle;
-        },
         darkMode() {
             return this.$appState.darkTheme;
         },
diff --git a/pages/inputtext/index.vue b/pages/inputtext/index.vue
index b4a205afa..48df76c3f 100755
--- a/pages/inputtext/index.vue
+++ b/pages/inputtext/index.vue
@@ -14,6 +14,7 @@
 import AccessibilityDoc from '@/doc/inputtext/AccessibilityDoc.vue';
 import BasicDoc from '@/doc/inputtext/BasicDoc.vue';
 import DisabledDoc from '@/doc/inputtext/DisabledDoc.vue';
+import FilledDoc from '@/doc/inputtext/FilledDoc.vue';
 import FloatLabelDoc from '@/doc/inputtext/FloatLabelDoc.vue';
 import HelpTextDoc from '@/doc/inputtext/HelpTextDoc.vue';
 import IconsDoc from '@/doc/inputtext/IconsDoc.vue';
@@ -57,6 +58,11 @@ export default {
                     label: 'Float Label',
                     component: FloatLabelDoc
                 },
+                {
+                    id: 'filled',
+                    label: 'Filled',
+                    component: FilledDoc
+                },
                 {
                     id: 'invalid',
                     label: 'Invalid',
diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
index f7dbcd5d0..83b92fd9d 100644
--- a/public/themes/arya-blue/theme.css
+++ b/public/themes/arya-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #383838;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #64B5F6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #2396f2;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #383838;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #383838;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #383838;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #64B5F6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #2396f2;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #64B5F6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
index 247d64dab..42f2ef874 100644
--- a/public/themes/arya-green/theme.css
+++ b/public/themes/arya-green/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #383838;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #81C784;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #54b358;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #383838;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #383838;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #383838;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #81C784;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #54b358;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #81C784;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
index 6e3c83dea..377e37d5a 100644
--- a/public/themes/arya-orange/theme.css
+++ b/public/themes/arya-orange/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #383838;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #FFD54F;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #ffc50c;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #383838;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #383838;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #383838;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #FFD54F;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffc50c;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #FFD54F;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
index 7f4ef0909..1f3f28a8b 100644
--- a/public/themes/arya-purple/theme.css
+++ b/public/themes/arya-purple/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #383838;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #383838;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #383838;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #BA68C8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #383838;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #a241b2;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #383838;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #383838;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #383838;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #383838;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #383838;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #383838;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #BA68C8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #383838;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #a241b2;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #BA68C8;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #383838;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #383838;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #383838;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #383838;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/aura-dark-amber/theme.css b/public/themes/aura-dark-amber/theme.css
index 808f82294..a02543d85 100644
--- a/public/themes/aura-dark-amber/theme.css
+++ b/public/themes/aura-dark-amber/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #fbbf24;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #fcd34d;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-blue/theme.css b/public/themes/aura-dark-blue/theme.css
index 818c25eae..b36364bde 100644
--- a/public/themes/aura-dark-blue/theme.css
+++ b/public/themes/aura-dark-blue/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #60a5fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #93c5fd;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-cyan/theme.css b/public/themes/aura-dark-cyan/theme.css
index bb842be44..977e17ed5 100644
--- a/public/themes/aura-dark-cyan/theme.css
+++ b/public/themes/aura-dark-cyan/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #22d3ee;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #67e8f9;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-green/theme.css b/public/themes/aura-dark-green/theme.css
index 0c692e1c8..5553c4223 100644
--- a/public/themes/aura-dark-green/theme.css
+++ b/public/themes/aura-dark-green/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #34d399;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #6ee7b7;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-indigo/theme.css b/public/themes/aura-dark-indigo/theme.css
index 360d05eb7..3fa96b518 100644
--- a/public/themes/aura-dark-indigo/theme.css
+++ b/public/themes/aura-dark-indigo/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #818cf8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #a5b4fc;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-lime/theme.css b/public/themes/aura-dark-lime/theme.css
index 1688727a1..dbbbd82ac 100644
--- a/public/themes/aura-dark-lime/theme.css
+++ b/public/themes/aura-dark-lime/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #a3e635;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #bef264;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-noir/theme.css b/public/themes/aura-dark-noir/theme.css
index 2d775febf..a1d1076dc 100644
--- a/public/themes/aura-dark-noir/theme.css
+++ b/public/themes/aura-dark-noir/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #fafafa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #f4f4f5;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-pink/theme.css b/public/themes/aura-dark-pink/theme.css
index efbe0e6aa..7119a887d 100644
--- a/public/themes/aura-dark-pink/theme.css
+++ b/public/themes/aura-dark-pink/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #f472b6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #f9a8d4;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-purple/theme.css b/public/themes/aura-dark-purple/theme.css
index e42c24768..3aed01712 100644
--- a/public/themes/aura-dark-purple/theme.css
+++ b/public/themes/aura-dark-purple/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #a78bfa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #c4b5fd;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-dark-teal/theme.css b/public/themes/aura-dark-teal/theme.css
index b5d25c0e3..e00683295 100644
--- a/public/themes/aura-dark-teal/theme.css
+++ b/public/themes/aura-dark-teal/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #27272a;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #27272a;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #2dd4bf;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #27272a;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #5eead4;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #27272a;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #27272a;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #27272a;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #020617;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #27272a;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #020617;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #27272a;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #27272a;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: none;
     border-color: #52525b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #27272a;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #27272a;
   }
   .p-treeselect .p-treeselect-label {
@@ -6787,8 +6788,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6886,7 +6887,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7055,8 +7056,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-amber/theme.css b/public/themes/aura-light-amber/theme.css
index 754625056..878cb0b6b 100644
--- a/public/themes/aura-light-amber/theme.css
+++ b/public/themes/aura-light-amber/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #f59e0b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #d97706;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-blue/theme.css b/public/themes/aura-light-blue/theme.css
index 9b48f6eba..f54ee8188 100644
--- a/public/themes/aura-light-blue/theme.css
+++ b/public/themes/aura-light-blue/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #3B82F6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #2563eb;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-cyan/theme.css b/public/themes/aura-light-cyan/theme.css
index 7b75c8689..1ca4db523 100644
--- a/public/themes/aura-light-cyan/theme.css
+++ b/public/themes/aura-light-cyan/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #06b6d4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0891b2;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-green/theme.css b/public/themes/aura-light-green/theme.css
index a1de152f0..068b7e1db 100644
--- a/public/themes/aura-light-green/theme.css
+++ b/public/themes/aura-light-green/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #10b981;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #059669;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-indigo/theme.css b/public/themes/aura-light-indigo/theme.css
index 7e0b902d3..231cbdbcb 100644
--- a/public/themes/aura-light-indigo/theme.css
+++ b/public/themes/aura-light-indigo/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #6366F1;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #4F46E5;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-lime/theme.css b/public/themes/aura-light-lime/theme.css
index bc386279b..57dd16244 100644
--- a/public/themes/aura-light-lime/theme.css
+++ b/public/themes/aura-light-lime/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #84cc16;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #65a30d;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-noir/theme.css b/public/themes/aura-light-noir/theme.css
index f5433e04c..dea6c3449 100644
--- a/public/themes/aura-light-noir/theme.css
+++ b/public/themes/aura-light-noir/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #020617;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0f172a;
   }
 
@@ -908,13 +909,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -984,16 +985,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1182,13 +1183,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1272,13 +1273,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1459,13 +1460,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1605,13 +1606,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1695,16 +1696,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1842,13 +1843,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1868,13 +1869,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6797,8 +6798,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6896,7 +6897,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7065,8 +7066,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-pink/theme.css b/public/themes/aura-light-pink/theme.css
index ca3cd9a40..6ad160401 100644
--- a/public/themes/aura-light-pink/theme.css
+++ b/public/themes/aura-light-pink/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #ec4899;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #db2777;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-purple/theme.css b/public/themes/aura-light-purple/theme.css
index deb12e941..0ec149622 100644
--- a/public/themes/aura-light-purple/theme.css
+++ b/public/themes/aura-light-purple/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #8B5CF6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #7C3AED;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/aura-light-teal/theme.css b/public/themes/aura-light-teal/theme.css
index b6d6d1405..bbbc73c7a 100644
--- a/public/themes/aura-light-teal/theme.css
+++ b/public/themes/aura-light-teal/theme.css
@@ -414,13 +414,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -477,13 +477,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -673,7 +673,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -726,13 +727,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -869,16 +870,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f87171;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #14b8a6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8fafc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0d9488;
   }
 
@@ -904,13 +905,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -980,16 +981,16 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1178,13 +1179,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1268,13 +1269,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f87171;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1455,13 +1456,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1601,13 +1602,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f87171;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1691,16 +1692,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f87171;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8fafc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1834,13 +1835,13 @@
     border-color: transparent;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8fafc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1860,13 +1861,13 @@
     box-shadow: none;
     border-color: #94a3b8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8fafc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
@@ -6789,8 +6790,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-selectbutton .p-button.p-highlight::before {
@@ -6888,7 +6889,7 @@
     margin-top: calc(-1rem + 1px);
   }
   .p-steps .p-steps-item:first-child::before {
-    width: calc(50% + math.div($stepsItemNumberWidth,2));
+    width: calc(50% + 1rem);
     transform: translateX(100%);
   }
   .p-steps .p-steps-item:last-child::before {
@@ -7057,8 +7058,8 @@
     position: absolute;
     left: 0.25rem;
     top: 0.25rem;
-    width: calc(100% - .5rem);
-    height: calc(100% - .5rem);
+    width: calc(100% - 0.5rem);
+    height: calc(100% - 0.5rem);
     border-radius: 4px;
   }
   .p-togglebutton.p-highlight .p-button::before {
diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css
index 7212a36a6..e12103d18 100644
--- a/public/themes/bootstrap4-dark-blue/theme.css
+++ b/public/themes/bootstrap4-dark-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #3f4b5b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #3f4b5b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #3f4b5b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f19ea6;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #3f4b5b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #8dd0ff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #3f4b5b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #1dadff;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #3f4b5b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #3f4b5b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f19ea6;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #3f4b5b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #3f4b5b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f19ea6;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #3f4b5b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #8dd0ff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #3f4b5b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #1dadff;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #56bdff;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #3f4b5b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 1px #e3f3fe;
     border-color: #8dd0ff;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css
index add1d0e47..a577b9618 100644
--- a/public/themes/bootstrap4-dark-purple/theme.css
+++ b/public/themes/bootstrap4-dark-purple/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #3f4b5b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #3f4b5b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #3f4b5b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f19ea6;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #3f4b5b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #c298d8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #3f4b5b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #9954bb;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #3f4b5b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #3f4b5b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f19ea6;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #3f4b5b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #3f4b5b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f19ea6;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #3f4b5b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f19ea6;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #3f4b5b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #c298d8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #3f4b5b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #9954bb;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #aa70c7;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #3f4b5b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #3f4b5b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #3f4b5b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 1px #f0e6f5;
     border-color: #c298d8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #3f4b5b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3f4b5b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3f4b5b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css
index 9b557ef83..374cab71d 100644
--- a/public/themes/bootstrap4-light-blue/theme.css
+++ b/public/themes/bootstrap4-light-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #efefef;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #efefef;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #efefef;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #efefef;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #efefef;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #efefef;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #efefef;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #efefef;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #efefef;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #dc3545;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #efefef;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #007bff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #efefef;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0062cc;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #efefef;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #efefef;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #efefef;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #efefef;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #efefef;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #dc3545;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #efefef;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #efefef;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #efefef;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #efefef;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #dc3545;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #efefef;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #007bff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #efefef;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #0062cc;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #0069d9;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #efefef;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #efefef;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
     border-color: #007bff;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #efefef;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css
index 0cf0efa85..8258e1fb1 100644
--- a/public/themes/bootstrap4-light-purple/theme.css
+++ b/public/themes/bootstrap4-light-purple/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #efefef;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #efefef;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #efefef;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #efefef;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #efefef;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #efefef;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #efefef;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #efefef;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #efefef;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #dc3545;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #efefef;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #883cae;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #efefef;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #68329e;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #efefef;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #efefef;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #efefef;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #efefef;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #efefef;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #dc3545;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #efefef;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #efefef;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #efefef;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #dc3545;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #efefef;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #dc3545;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #efefef;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #883cae;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #efefef;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #68329e;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #7a38a7;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #efefef;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #efefef;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #efefef;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
     border-color: #883cae;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #efefef;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #efefef;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #efefef;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/fluent-light/theme.css b/public/themes/fluent-light/theme.css
index 6997e9298..0a7b119dd 100644
--- a/public/themes/fluent-light/theme.css
+++ b/public/themes/fluent-light/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #a4252c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #faf9f8;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #faf9f8;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #faf9f8;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #faf9f8;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #faf9f8;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #faf9f8;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #a4252c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #faf9f8;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #0078d4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #faf9f8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #005a9e;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #faf9f8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #faf9f8;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #faf9f8;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #faf9f8;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #faf9f8;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #a4252c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #faf9f8;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #faf9f8;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #a4252c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #faf9f8;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #faf9f8;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #faf9f8;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #faf9f8;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #faf9f8;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #a4252c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #faf9f8;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #faf9f8;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #faf9f8;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #a4252c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #faf9f8;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #faf9f8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #005a9e;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #faf9f8;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #faf9f8;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #faf9f8;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: inset 0 0 0 1px #605e5c;
     border-color: #0078d4;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #faf9f8;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #faf9f8;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #faf9f8;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-amber/theme.css b/public/themes/lara-dark-amber/theme.css
index 4210b729a..4a867bca8 100644
--- a/public/themes/lara-dark-amber/theme.css
+++ b/public/themes/lara-dark-amber/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #fbbf24;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #fde68a;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #fbbf24;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #fde68a;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #fbbf24;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.2);
     border-color: #fbbf24;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
index ca4c7e8db..8865f09ed 100644
--- a/public/themes/lara-dark-blue/theme.css
+++ b/public/themes/lara-dark-blue/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #60a5fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #bfdbfe;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #60a5fa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #bfdbfe;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #60a5fa;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2);
     border-color: #60a5fa;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-cyan/theme.css b/public/themes/lara-dark-cyan/theme.css
index 68a41ebf4..1e53a4140 100644
--- a/public/themes/lara-dark-cyan/theme.css
+++ b/public/themes/lara-dark-cyan/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #22d3ee;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #a5f3fc;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #22d3ee;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #a5f3fc;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #22d3ee;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(34, 211, 238, 0.2);
     border-color: #22d3ee;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-green/theme.css b/public/themes/lara-dark-green/theme.css
index d5f9fbe56..161bc8cdd 100644
--- a/public/themes/lara-dark-green/theme.css
+++ b/public/themes/lara-dark-green/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #34d399;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #a7f3d0;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #34d399;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #a7f3d0;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #34d399;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(52, 211, 153, 0.2);
     border-color: #34d399;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
index bd2acd375..5ffd2378e 100644
--- a/public/themes/lara-dark-indigo/theme.css
+++ b/public/themes/lara-dark-indigo/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #818cf8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #c7d2fe;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #818cf8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #c7d2fe;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #818cf8;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.2);
     border-color: #818cf8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-pink/theme.css b/public/themes/lara-dark-pink/theme.css
index 04ac664ea..62c6663ea 100644
--- a/public/themes/lara-dark-pink/theme.css
+++ b/public/themes/lara-dark-pink/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #f472b6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #fbcfe8;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #f472b6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #fbcfe8;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #f472b6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(244, 114, 182, 0.2);
     border-color: #f472b6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-purple/theme.css b/public/themes/lara-dark-purple/theme.css
index cd63870f8..2345cf7e9 100644
--- a/public/themes/lara-dark-purple/theme.css
+++ b/public/themes/lara-dark-purple/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #a78bfa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #ddd6fe;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #a78bfa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ddd6fe;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #a78bfa;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(167, 139, 250, 0.2);
     border-color: #a78bfa;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-dark-teal/theme.css b/public/themes/lara-dark-teal/theme.css
index 750b0fd38..3f7a4fcc8 100644
--- a/public/themes/lara-dark-teal/theme.css
+++ b/public/themes/lara-dark-teal/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #424b57;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #424b57;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #FCA5A5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #2dd4bf;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #424b57;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #99f6e4;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #424b57;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #424b57;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #FCA5A5;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #424b57;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #FCA5A5;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #FCA5A5;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #2dd4bf;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #424b57;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #99f6e4;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #2dd4bf;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #424b57;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #424b57;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.2);
     border-color: #2dd4bf;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #424b57;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #424b57;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-amber/theme.css b/public/themes/lara-light-amber/theme.css
index 8ea03c796..51ee56483 100644
--- a/public/themes/lara-light-amber/theme.css
+++ b/public/themes/lara-light-amber/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #f59e0b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #b45309;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #f59e0b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #b45309;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #f59e0b;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #fef08a;
     border-color: #f59e0b;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index cf11b506e..96c5c3982 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #3B82F6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #1D4ED8;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #3B82F6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #1D4ED8;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #3B82F6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #BFDBFE;
     border-color: #3B82F6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-cyan/theme.css b/public/themes/lara-light-cyan/theme.css
index 3cc1ec9b0..00697190e 100644
--- a/public/themes/lara-light-cyan/theme.css
+++ b/public/themes/lara-light-cyan/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #06b6d4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0e7490;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #06b6d4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #0e7490;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #06b6d4;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #a5f3fc;
     border-color: #06b6d4;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-green/theme.css b/public/themes/lara-light-green/theme.css
index b57947ded..4ac05f08a 100644
--- a/public/themes/lara-light-green/theme.css
+++ b/public/themes/lara-light-green/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #10b981;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #047857;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #10b981;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #047857;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #10b981;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #a7f3d0;
     border-color: #10b981;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index 86cabcf2d..604648f01 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #6366F1;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #4338CA;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #6366F1;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #4338CA;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #6366F1;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #C7D2FE;
     border-color: #6366F1;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-pink/theme.css b/public/themes/lara-light-pink/theme.css
index b9de9d057..209dfebc8 100644
--- a/public/themes/lara-light-pink/theme.css
+++ b/public/themes/lara-light-pink/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #ec4899;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #be185d;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ec4899;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #be185d;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #ec4899;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #fbcfe8;
     border-color: #ec4899;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-purple/theme.css b/public/themes/lara-light-purple/theme.css
index 156454835..4444d20bc 100644
--- a/public/themes/lara-light-purple/theme.css
+++ b/public/themes/lara-light-purple/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #8B5CF6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #6D28D9;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #8B5CF6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #6D28D9;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #8B5CF6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #DDD6FE;
     border-color: #8B5CF6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index bd824d7c2..15da5160f 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -412,13 +412,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -475,13 +475,13 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -671,7 +671,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -724,13 +725,13 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -867,16 +868,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e24c4c;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #14b8a6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f3f4f6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0f766e;
   }
 
@@ -902,13 +903,13 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -978,16 +979,16 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1176,13 +1177,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1266,13 +1267,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e24c4c;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1453,13 +1454,13 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1599,13 +1600,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e24c4c;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1689,16 +1690,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e24c4c;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #14b8a6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f3f4f6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #0f766e;
   }
 
@@ -1832,13 +1833,13 @@
     border-color: #14b8a6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f3f4f6;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1858,13 +1859,13 @@
     box-shadow: 0 0 0 0.2rem #99f6e4;
     border-color: #14b8a6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f3f4f6;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css
index 2dec3efe9..43af43347 100644
--- a/public/themes/luna-amber/theme.css
+++ b/public/themes/luna-amber/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e57373;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #FFE082;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #FFCA28;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e57373;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e57373;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #FFE082;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #FFCA28;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #FFE082;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #FFE082;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/luna-blue/theme.css b/public/themes/luna-blue/theme.css
index ebe9f9f13..4ae3f4a82 100644
--- a/public/themes/luna-blue/theme.css
+++ b/public/themes/luna-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e57373;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #81D4FA;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #29B6F6;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e57373;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e57373;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #81D4FA;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #29B6F6;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #81D4FA;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #81D4FA;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css
index 8dcfecf00..13cb22556 100644
--- a/public/themes/luna-green/theme.css
+++ b/public/themes/luna-green/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e57373;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #C5E1A5;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #9CCC65;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e57373;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e57373;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #C5E1A5;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #9CCC65;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #C5E1A5;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #C5E1A5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css
index d383ad245..1b06fa1a4 100644
--- a/public/themes/luna-pink/theme.css
+++ b/public/themes/luna-pink/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e57373;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #F48FB1;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #4b4b4b;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #EC407A;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e57373;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #4b4b4b;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e57373;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e57373;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #F48FB1;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #4b4b4b;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #EC407A;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #F48FB1;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #4b4b4b;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #4b4b4b;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.1rem white;
     border-color: #F48FB1;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #4b4b4b;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #4b4b4b;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css
index 6c964fc29..9c6c2e29e 100644
--- a/public/themes/md-dark-deeppurple/theme.css
+++ b/public/themes/md-dark-deeppurple/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44435;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #CE93D8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #CE93D8;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44435;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44435;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #121212;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #121212;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #121212;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(206, 147, 216, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #CE93D8;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #1e1e1e;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #1e1e1e;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #CE93D8;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(206, 147, 216, 0.12), 0px 3px 1px -2px rgba(255, 255, 255, 0.2), 0px 2px 2px 0px rgba(255, 255, 255, 0.14), 0px 1px 5px 0px rgba(255, 255, 255, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(206, 147, 216, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css
index 0ee8f0728..994801ace 100644
--- a/public/themes/md-dark-indigo/theme.css
+++ b/public/themes/md-dark-indigo/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44435;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #9FA8DA;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #9FA8DA;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44435;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44435;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #121212;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #121212;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #121212;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(159, 168, 218, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #9FA8DA;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #1e1e1e;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #1e1e1e;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #9FA8DA;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(159, 168, 218, 0.12), 0px 3px 1px -2px rgba(255, 255, 255, 0.2), 0px 2px 2px 0px rgba(255, 255, 255, 0.14), 0px 1px 5px 0px rgba(255, 255, 255, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(159, 168, 218, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css
index c72a80cd3..6e8cd11ab 100644
--- a/public/themes/md-light-deeppurple/theme.css
+++ b/public/themes/md-light-deeppurple/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f5f5f5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f5f5f5;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #B00020;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f5f5f5;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #673AB7;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #ececec;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #673AB7;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f5f5f5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #ececec;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f5f5f5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #B00020;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f5f5f5;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f5f5f5;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #B00020;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f5f5f5;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #ececec;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #ffffff;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(103, 58, 183, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #673AB7;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #ffffff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #ffffff;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #673AB7;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(103, 58, 183, 0.12), 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(103, 58, 183, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css
index 707ae2b6a..5a7c1a44a 100644
--- a/public/themes/md-light-indigo/theme.css
+++ b/public/themes/md-light-indigo/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f5f5f5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f5f5f5;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #B00020;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f5f5f5;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #3F51B5;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #ececec;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #3F51B5;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f5f5f5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #ececec;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f5f5f5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #B00020;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f5f5f5;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f5f5f5;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #B00020;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f5f5f5;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #ececec;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #ffffff;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(63, 81, 181, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #3F51B5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #ffffff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #ffffff;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #3F51B5;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(63, 81, 181, 0.12), 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(63, 81, 181, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css
index a968dbe71..89017c4d2 100644
--- a/public/themes/mdc-dark-deeppurple/theme.css
+++ b/public/themes/mdc-dark-deeppurple/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44435;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #CE93D8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #CE93D8;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44435;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44435;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #121212;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #121212;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #CE93D8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #121212;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(206, 147, 216, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #CE93D8;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #1e1e1e;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #1e1e1e;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #CE93D8;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(206, 147, 216, 0.12), 0px 3px 1px -2px rgba(255, 255, 255, 0.2), 0px 2px 2px 0px rgba(255, 255, 255, 0.14), 0px 1px 5px 0px rgba(255, 255, 255, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(206, 147, 216, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8, inset 0 0 0 1px #CE93D8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #CE93D8, #CE93D8), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css
index 710d39480..3e26303e0 100644
--- a/public/themes/mdc-dark-indigo/theme.css
+++ b/public/themes/mdc-dark-indigo/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44435;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #9FA8DA;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #9FA8DA;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44435;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44435;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44435;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #121212;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #121212;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: rgba(255, 255, 255, 0.06);
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #9FA8DA;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: rgba(255, 255, 255, 0.06);
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: rgba(255, 255, 255, 0.1);
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #121212;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(159, 168, 218, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #9FA8DA;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #1e1e1e;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #1e1e1e;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #9FA8DA;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(159, 168, 218, 0.12), 0px 3px 1px -2px rgba(255, 255, 255, 0.2), 0px 2px 2px 0px rgba(255, 255, 255, 0.14), 0px 1px 5px 0px rgba(255, 255, 255, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435, inset 0 0 0 1px #f44435;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(159, 168, 218, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA, inset 0 0 0 1px #9FA8DA;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: rgba(255, 255, 255, 0.08);
     border-color: transparent;
     background-image: linear-gradient(to bottom, #9FA8DA, #9FA8DA), linear-gradient(to bottom, rgba(255, 255, 255, 0.87), rgba(255, 255, 255, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #f44435, #f44435), linear-gradient(to bottom, #f44435, #f44435);
   }
diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css
index 5ce6f0ff6..ef62da469 100644
--- a/public/themes/mdc-light-deeppurple/theme.css
+++ b/public/themes/mdc-light-deeppurple/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f5f5f5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f5f5f5;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #B00020;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f5f5f5;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #673AB7;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #ececec;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #673AB7;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f5f5f5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #ececec;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f5f5f5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #B00020;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f5f5f5;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f5f5f5;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #B00020;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f5f5f5;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #ececec;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #673AB7;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #ffffff;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(103, 58, 183, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #673AB7;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #ffffff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #ffffff;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #673AB7;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(103, 58, 183, 0.12), 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(103, 58, 183, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7, inset 0 0 0 1px #673AB7;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #673AB7, #673AB7), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css
index 702e28ff3..834cf6fdd 100644
--- a/public/themes/mdc-light-indigo/theme.css
+++ b/public/themes/mdc-light-indigo/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f5f5f5;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f5f5f5;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #B00020;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f5f5f5;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #3F51B5;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #ececec;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #3F51B5;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f5f5f5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #ececec;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f5f5f5;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #B00020;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f5f5f5;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #dcdcdc;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #B00020;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f5f5f5;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #B00020;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f5f5f5;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #ececec;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffffff;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: 0 none;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f5f5f5;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #ececec;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #dcdcdc;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: none;
     border-color: #3F51B5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f5f5f5;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #dcdcdc;
   }
   .p-treeselect .p-treeselect-label {
@@ -5996,7 +5997,7 @@
   .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6006,30 +6007,30 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:hover {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-autocomplete.p-variant .p-autocomplete-input.p-invalid.p-component:enabled:focus {
+  .p-autocomplete.p-variant-filled .p-autocomplete-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6039,22 +6040,22 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:hover, .p-autocomplete.p-variant-filled.p-autocomplete-multiple .p-autocomplete-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
@@ -6089,14 +6090,14 @@
     background: transparent;
   }
 
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token {
     padding-top: 0;
     padding-bottom: 0;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
     font-size: 75%;
   }
-  .p-float-label .p-autocomplete.p-variant .p-autocomplete-multiple-container .p-autocomplete-input-token {
+  .p-float-label .p-autocomplete.p-variant-filled .p-autocomplete-multiple-container .p-autocomplete-input-token {
     padding: 0;
   }
   .p-float-label .p-autocomplete-multiple-container .p-autocomplete-token {
@@ -6523,7 +6524,7 @@
   .p-calendar.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6533,26 +6534,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus, .p-calendar.p-variant-filled > .p-inputtext:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant > .p-inputtext .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:hover, .p-calendar.p-variant-filled > .p-inputtext .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-calendar-w-btn {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6562,52 +6563,52 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled):not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:hover, .p-calendar.p-variant-filled.p-calendar-w-btn:not(.p-calendar-disabled) .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-calendar.p-variant.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-calendar-w-btn .p-inputtext {
     border: 0 none;
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled.p-invalid .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-focus, .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-calendar.p-variant.p-invalid.p-calendar-w-btn .p-inputtext {
+  .p-calendar.p-variant-filled.p-invalid.p-calendar-w-btn .p-inputtext {
     border: 0 none;
     background-image: none;
   }
@@ -6677,7 +6678,8 @@
     color: #ffffff;
   }
 
-  .p-cascadeselect .p-cascadeselect-label, .p-cascadeselect .p-dropdown-trigger {
+  .p-cascadeselect .p-cascadeselect-label,
+.p-cascadeselect .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -6692,7 +6694,7 @@
     background-color: rgba(63, 81, 181, 0.16);
   }
 
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6702,37 +6704,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-cascadeselect.p-variant .p-inputtext {
+  .p-cascadeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-cascadeselect.p-variant:not(.p-disabled).p-focus, .p-cascadeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-cascadeselect.p-variant .p-inputtext:enabled:hover, .p-cascadeselect.p-variant .p-inputtext:enabled:focus {
+  .p-cascadeselect.p-variant-filled .p-inputtext:enabled:hover, .p-cascadeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant .p-cascadeselect-label:hover {
+  .p-cascadeselect.p-variant-filled .p-cascadeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-cascadeselect.p-variant.p-invalid {
+  .p-cascadeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-cascadeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -6839,10 +6841,10 @@
   .p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible).p-highlight .p-checkbox-box {
     border-color: #3F51B5;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #ffffff;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) {
     background-color: #ffffff;
   }
 
@@ -6875,7 +6877,7 @@
   .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-chips.p-variant .p-chips-multiple-container {
+  .p-chips.p-variant-filled .p-chips-multiple-container {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -6885,33 +6887,33 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant .p-chips-multiple-container .p-inputtext:enabled:focus {
+  .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:hover, .p-chips.p-variant-filled .p-chips-multiple-container .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
+  .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-focus, .p-chips.p-variant-filled.p-invalid .p-chips-multiple-container:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7003,7 +7005,8 @@
     box-shadow: inset 0 -2px 0 0 #3F51B5;
   }
 
-  .p-dropdown .p-inputtext, .p-dropdown .p-dropdown-trigger {
+  .p-dropdown .p-inputtext,
+.p-dropdown .p-dropdown-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7013,7 +7016,7 @@
   .p-dropdown:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7023,36 +7026,36 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus, .p-dropdown.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-dropdown.p-variant .p-inputtext:enabled:hover, .p-dropdown.p-variant .p-inputtext:enabled:focus {
+  .p-dropdown.p-variant-filled .p-inputtext:enabled:hover, .p-dropdown.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-dropdown.p-variant .p-inputtext {
+  .p-dropdown.p-variant-filled .p-inputtext {
     border: 0 none;
   }
-  .p-dropdown.p-variant.p-invalid {
+  .p-dropdown.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-dropdown.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7192,7 +7195,7 @@
     border-bottom-right-radius: 0;
   }
 
-  .p-inputmask.p-variant {
+  .p-inputmask.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7202,26 +7205,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputmask.p-variant:enabled:hover {
+  .p-inputmask.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputmask.p-variant:enabled:focus {
+  .p-inputmask.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputmask.p-variant.p-invalid.p-component {
+  .p-inputmask.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputmask.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputmask.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7229,19 +7232,19 @@
   .p-inputnumber.p-invalid .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-invalid.p-variant .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-invalid.p-variant-filled .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7251,26 +7254,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7305,7 +7308,7 @@
     box-shadow: 0 0 1px 10px rgba(63, 81, 181, 0.12), 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   }
 
-  .p-inputtext.p-variant {
+  .p-inputtext.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7315,26 +7318,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-inputtext.p-variant:enabled:hover {
+  .p-inputtext.p-variant-filled:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-inputtext.p-variant:enabled:focus {
+  .p-inputtext.p-variant-filled:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-inputtext.p-variant.p-invalid.p-component {
+  .p-inputtext.p-variant-filled.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-inputtext.p-variant.p-invalid.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7419,7 +7422,8 @@
     line-height: 1rem;
   }
 
-  .p-multiselect .p-multiselect-label, .p-multiselect .p-multiselect-trigger {
+  .p-multiselect .p-multiselect-label,
+.p-multiselect .p-multiselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7429,7 +7433,7 @@
   .p-multiselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7439,37 +7443,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-multiselect.p-variant .p-inputtext {
+  .p-multiselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus, .p-multiselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-multiselect.p-variant .p-inputtext:enabled:hover, .p-multiselect.p-variant .p-inputtext:enabled:focus {
+  .p-multiselect.p-variant-filled .p-inputtext:enabled:hover, .p-multiselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant .p-multiselect-label:hover {
+  .p-multiselect.p-variant-filled .p-multiselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-multiselect.p-variant.p-invalid {
+  .p-multiselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-multiselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
@@ -7597,19 +7601,19 @@
   .p-password.p-invalid > .p-inputtext:enabled:focus {
     box-shadow: inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020, inset 0 0 0 1px #B00020;
   }
-  .p-password.p-invalid.p-variant > .p-inputtext {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-invalid.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-invalid.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -7619,26 +7623,26 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-password.p-variant > .p-inputtext:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-password.p-variant > .p-inputtext:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext:enabled:focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:hover {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:hover {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-password.p-variant > .p-inputtext.p-invalid.p-component:enabled:focus {
+  .p-password.p-variant-filled > .p-inputtext.p-invalid.p-component:enabled:focus {
     box-shadow: none;
     border-color: transparent;
   }
@@ -7985,7 +7989,8 @@
     background: rgba(63, 81, 181, 0.24);
   }
 
-  .p-treeselect .p-treeselect-label, .p-treeselect .p-treeselect-trigger {
+  .p-treeselect .p-treeselect-label,
+.p-treeselect .p-treeselect-trigger {
     background-image: none;
     background: transparent;
   }
@@ -7995,7 +8000,7 @@
   .p-treeselect:not(.p-disabled).p-focus {
     box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5, inset 0 0 0 1px #3F51B5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     border: 1px solid transparent;
@@ -8005,37 +8010,37 @@
     background-position: 50% 100%, 50% 100%;
     background-origin: border-box;
   }
-  .p-treeselect.p-variant .p-inputtext {
+  .p-treeselect.p-variant-filled .p-inputtext {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ececec;
     border-color: transparent;
     background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, rgba(0, 0, 0, 0.87), rgba(0, 0, 0, 0.87));
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus, .p-treeselect.p-variant:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-color: #dcdcdc;
     border-color: transparent;
     background-size: 100% 2px, 100% 1px;
   }
-  .p-treeselect.p-variant .p-inputtext:enabled:hover, .p-treeselect.p-variant .p-inputtext:enabled:focus {
+  .p-treeselect.p-variant-filled .p-inputtext:enabled:hover, .p-treeselect.p-variant-filled .p-inputtext:enabled:focus {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant .p-treeselect-label:hover {
+  .p-treeselect.p-variant-filled .p-treeselect-label:hover {
     background-image: none;
     background: transparent;
   }
-  .p-treeselect.p-variant.p-invalid {
+  .p-treeselect.p-variant-filled.p-invalid {
     border-color: transparent;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled):hover {
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
-  .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant.p-invalid:not(.p-disabled).p-inputwrapper-focus {
+  .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-focus, .p-treeselect.p-variant-filled.p-invalid:not(.p-disabled).p-inputwrapper-focus {
     box-shadow: none;
     background-image: linear-gradient(to bottom, #B00020, #B00020), linear-gradient(to bottom, #B00020, #B00020);
   }
diff --git a/public/themes/mira/theme.css b/public/themes/mira/theme.css
index 49cfe048c..7a689a069 100644
--- a/public/themes/mira/theme.css
+++ b/public/themes/mira/theme.css
@@ -421,13 +421,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #BF616A;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #ECEFF4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -484,13 +484,13 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #ECEFF4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -680,7 +680,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -733,13 +734,13 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #ECEFF4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -876,16 +877,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #BF616A;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #ECEFF4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #5E81AC;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #ECEFF4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #81A1C1;
   }
 
@@ -911,13 +912,13 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #ECEFF4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -987,16 +988,16 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #ECEFF4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #ECEFF4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1185,13 +1186,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #BF616A;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #ECEFF4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1275,13 +1276,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #BF616A;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #ECEFF4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1462,13 +1463,13 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #ECEFF4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ECEFF4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1608,13 +1609,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #BF616A;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #ECEFF4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #ECEFF4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1698,16 +1699,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #BF616A;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #ECEFF4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #5E81AC;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #ECEFF4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #81A1C1;
   }
 
@@ -1841,13 +1842,13 @@
     border-color: #5E81AC;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #ECEFF4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #ECEFF4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1867,13 +1868,13 @@
     box-shadow: 0 0 0 0.2rem #C0D0E0;
     border-color: #81A1C1;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #ECEFF4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #ECEFF4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/nano/theme.css b/public/themes/nano/theme.css
index 2ff14baf0..6f14363b8 100644
--- a/public/themes/nano/theme.css
+++ b/public/themes/nano/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #d8222f;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f2f4f8;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f2f4f8;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f2f4f8;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #d8222f;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f2f4f8;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #1174c0;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f2f4f8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0e5d9a;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f2f4f8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f2f4f8;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f4f8;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #d8222f;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f2f4f8;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #d8222f;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f2f4f8;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f2f4f8;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f4f8;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #d8222f;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f2f4f8;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f2f4f8;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #d8222f;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f2f4f8;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #1174c0;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f2f4f8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #0e5d9a;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #1174c0;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f2f4f8;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f2f4f8;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #90c9f5;
     border-color: #1174c0;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f2f4f8;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f4f8;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/nova-accent/theme.css b/public/themes/nova-accent/theme.css
index bffc00650..3846f0fce 100644
--- a/public/themes/nova-accent/theme.css
+++ b/public/themes/nova-accent/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #a80000;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #007ad9;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #005b9f;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #a80000;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #a80000;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #007ad9;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #005b9f;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #007ad9;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/nova-alt/theme.css b/public/themes/nova-alt/theme.css
index 5c69f8d2f..962c2581e 100644
--- a/public/themes/nova-alt/theme.css
+++ b/public/themes/nova-alt/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #a80000;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #007ad9;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #005b9f;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #a80000;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #a80000;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #007ad9;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #005b9f;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #007ad9;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/nova-vue/theme.css b/public/themes/nova-vue/theme.css
index 9bf021295..b94304915 100644
--- a/public/themes/nova-vue/theme.css
+++ b/public/themes/nova-vue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #a80000;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #41b883;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #246749;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #a80000;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #a80000;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #41b883;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #246749;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #41b883;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.2rem #c2e9d8;
     border-color: #41b883;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/nova/theme.css b/public/themes/nova/theme.css
index 929aa796c..94e7c3374 100644
--- a/public/themes/nova/theme.css
+++ b/public/themes/nova/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #a80000;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #007ad9;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #005b9f;
   }
 
@@ -887,13 +888,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-chips .p-chips-multiple-container {
@@ -963,16 +964,16 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1161,13 +1162,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1251,13 +1252,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #a80000;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1438,13 +1439,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-multiselect .p-multiselect-label {
@@ -1584,13 +1585,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #a80000;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
 
@@ -1674,16 +1675,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #a80000;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #007ad9;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #005b9f;
   }
 
@@ -1825,13 +1826,13 @@
     border-color: #007ad9;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1851,13 +1852,13 @@
     box-shadow: 0 0 0 0.2rem #8dcdff;
     border-color: #007ad9;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css
index 2e3ccebfd..6aedf5146 100644
--- a/public/themes/rhea/theme.css
+++ b/public/themes/rhea/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #e7a3a3;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0.25rem;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #e7a3a3;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #7B95A3;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f4f4f4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #617c8a;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #e7a3a3;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #e7a3a3;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f4f4f4;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #e7a3a3;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #e7a3a3;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #7B95A3;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f4f4f4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #617c8a;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #7B95A3;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f4f4f4;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f4f4f4;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #e4e9ec;
     border-color: #7B95A3;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f4f4f4;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f4f4f4;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css
index 2338930d0..ca2f11f98 100644
--- a/public/themes/saga-blue/theme.css
+++ b/public/themes/saga-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44336;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #2196F3;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #0b7ad1;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44336;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44336;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #2196F3;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #0b7ad1;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #2196F3;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #a6d5fa;
     border-color: #2196F3;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css
index 78a99618b..322db071c 100644
--- a/public/themes/saga-green/theme.css
+++ b/public/themes/saga-green/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44336;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #4CAF50;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #3d8c40;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44336;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44336;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #4CAF50;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #3d8c40;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #4CAF50;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #b7e0b8;
     border-color: #4CAF50;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css
index 01d6582ba..e2b416811 100644
--- a/public/themes/saga-orange/theme.css
+++ b/public/themes/saga-orange/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44336;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #FFC107;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #d29d00;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44336;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44336;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #FFC107;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #d29d00;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #FFC107;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #ffe69c;
     border-color: #FFC107;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css
index 583362c9b..22cda63fe 100644
--- a/public/themes/saga-purple/theme.css
+++ b/public/themes/saga-purple/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f44336;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #9C27B0;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f8f9fa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #7d1f8d;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f44336;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f44336;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f44336;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #9C27B0;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f8f9fa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #7d1f8d;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #9C27B0;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f8f9fa;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 0.2rem #df9eea;
     border-color: #9C27B0;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f8f9fa;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/soho-dark/theme.css b/public/themes/soho-dark/theme.css
index 5fe5276da..71786bce1 100644
--- a/public/themes/soho-dark/theme.css
+++ b/public/themes/soho-dark/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ff9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #3e4053;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #3e4053;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #3e4053;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #3e4053;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #3e4053;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #3e4053;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #3e4053;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #3e4053;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #3e4053;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ff9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #3e4053;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #b19df7;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #3e4053;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #9378f4;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #3e4053;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #3e4053;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #3e4053;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #3e4053;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #3e4053;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3e4053;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ff9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #3e4053;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #3e4053;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #3e4053;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ff9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #3e4053;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #3e4053;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #3e4053;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #3e4053;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3e4053;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3e4053;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ff9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #3e4053;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #3e4053;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #3e4053;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ff9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #3e4053;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #b19df7;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #3e4053;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #9378f4;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: #b19df7;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #3e4053;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #3e4053;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #3e4053;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: 0 0 0 1px #e0d8fc;
     border-color: #b19df7;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #3e4053;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #3e4053;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #3e4053;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/soho-light/theme.css b/public/themes/soho-light/theme.css
index 82e20e8ef..e6ad6a71f 100644
--- a/public/themes/soho-light/theme.css
+++ b/public/themes/soho-light/theme.css
@@ -417,13 +417,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ff6767;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f6f9fc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -480,13 +480,13 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f6f9fc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -676,7 +676,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -729,13 +730,13 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f6f9fc;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -872,16 +873,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ff6767;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f6f9fc;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #7254f3;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f6f9fc;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #5935f1;
   }
 
@@ -907,13 +908,13 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f6f9fc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -983,16 +984,16 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f6f9fc;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f6f9fc;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1181,13 +1182,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ff6767;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f6f9fc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1271,13 +1272,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ff6767;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f6f9fc;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1458,13 +1459,13 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f6f9fc;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f6f9fc;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1604,13 +1605,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ff6767;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f6f9fc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f6f9fc;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1694,16 +1695,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ff6767;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f6f9fc;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #7254f3;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f6f9fc;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #5935f1;
   }
 
@@ -1837,13 +1838,13 @@
     border-color: #7254f3;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f6f9fc;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f6f9fc;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1863,13 +1864,13 @@
     box-shadow: 0 0 0 1px #c7bbfa;
     border-color: #7254f3;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f6f9fc;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f6f9fc;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/tailwind-light/theme.css b/public/themes/tailwind-light/theme.css
index 822156822..47e2faf29 100644
--- a/public/themes/tailwind-light/theme.css
+++ b/public/themes/tailwind-light/theme.css
@@ -428,13 +428,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f0a9a7;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #fafafa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #fafafa;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -491,13 +491,13 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #fafafa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #fafafa;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -687,7 +687,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -740,13 +741,13 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #fafafa;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #fafafa;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -883,16 +884,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f0a9a7;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #fafafa;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #4F46E5;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #fafafa;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #4F46E5;
   }
 
@@ -918,13 +919,13 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #fafafa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #fafafa;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #ffffff;
   }
   .p-chips .p-chips-multiple-container {
@@ -994,16 +995,16 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #fafafa;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #fafafa;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1192,13 +1193,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f0a9a7;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #fafafa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #fafafa;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1282,13 +1283,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f0a9a7;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #fafafa;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #fafafa;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #ffffff;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1469,13 +1470,13 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #fafafa;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #fafafa;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-multiselect .p-multiselect-label {
@@ -1615,13 +1616,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f0a9a7;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #fafafa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #fafafa;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
 
@@ -1705,16 +1706,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f0a9a7;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #fafafa;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #4F46E5;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #fafafa;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #4F46E5;
   }
 
@@ -1848,13 +1849,13 @@
     border-color: #4F46E5;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #fafafa;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #fafafa;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #ffffff;
   }
 
@@ -1874,13 +1875,13 @@
     box-shadow: 0 0 0 1px #6366F1;
     border-color: #4F46E5;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #fafafa;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #fafafa;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #ffffff;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css
index 68b7bc8ba..fddc692e8 100644
--- a/public/themes/vela-blue/theme.css
+++ b/public/themes/vela-blue/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #304562;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #64B5F6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #2396f2;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #304562;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #304562;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #304562;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #64B5F6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #2396f2;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #64B5F6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #93cbf9;
     border-color: #64B5F6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css
index 91ee92119..ba0fd5f2f 100644
--- a/public/themes/vela-green/theme.css
+++ b/public/themes/vela-green/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #304562;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #81C784;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #54b358;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #304562;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #304562;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #304562;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #81C784;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #54b358;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #81C784;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #a7d8a9;
     border-color: #81C784;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css
index 159cd6357..eb7cc057b 100644
--- a/public/themes/vela-orange/theme.css
+++ b/public/themes/vela-orange/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #304562;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #FFD54F;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #ffc50c;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #304562;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #304562;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #304562;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #FFD54F;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #ffc50c;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #FFD54F;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #ffe284;
     border-color: #FFD54F;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css
index bdeef4edc..28e83481d 100644
--- a/public/themes/vela-purple/theme.css
+++ b/public/themes/vela-purple/theme.css
@@ -393,13 +393,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #304562;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -456,13 +456,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #304562;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #304562;
   }
 
@@ -652,7 +652,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -705,13 +706,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -848,16 +849,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #ef9a9a;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #BA68C8;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #304562;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #a241b2;
   }
 
@@ -883,13 +884,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #304562;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #304562;
   }
   .p-chips .p-chips-multiple-container {
@@ -959,16 +960,16 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1157,13 +1158,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #304562;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #304562;
   }
 
@@ -1247,13 +1248,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #ef9a9a;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #304562;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1434,13 +1435,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-multiselect .p-multiselect-label {
@@ -1580,13 +1581,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #ef9a9a;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #304562;
   }
 
@@ -1670,16 +1671,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #ef9a9a;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #BA68C8;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #304562;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #a241b2;
   }
 
@@ -1813,13 +1814,13 @@
     border-color: #BA68C8;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #304562;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #304562;
   }
 
@@ -1839,13 +1840,13 @@
     box-shadow: 0 0 0 1px #cf95d9;
     border-color: #BA68C8;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #304562;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #304562;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/viva-dark/theme.css b/public/themes/viva-dark/theme.css
index 36234c50d..9c3d6c5f8 100644
--- a/public/themes/viva-dark/theme.css
+++ b/public/themes/viva-dark/theme.css
@@ -425,13 +425,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f78c79;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #263238;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #263238;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #263238;
   }
 
@@ -488,13 +488,13 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #263238;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #263238;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #263238;
   }
 
@@ -684,7 +684,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -737,13 +738,13 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #263238;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #263238;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #263238;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -880,16 +881,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f78c79;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #263238;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #9eade6;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #263238;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #7f93de;
   }
 
@@ -915,13 +916,13 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #263238;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #263238;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #263238;
   }
   .p-chips .p-chips-multiple-container {
@@ -991,16 +992,16 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #263238;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #263238;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #263238;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1189,13 +1190,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f78c79;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #263238;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #263238;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #263238;
   }
 
@@ -1279,13 +1280,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f78c79;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #263238;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #263238;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #263238;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1466,13 +1467,13 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #263238;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #263238;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #263238;
   }
   .p-multiselect .p-multiselect-label {
@@ -1612,13 +1613,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f78c79;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #263238;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #263238;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #263238;
   }
 
@@ -1702,16 +1703,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f78c79;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #263238;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #9eade6;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #263238;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #7f93de;
   }
 
@@ -1845,13 +1846,13 @@
     border-color: #9eade6;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #263238;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #263238;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #263238;
   }
 
@@ -1871,13 +1872,13 @@
     box-shadow: 0 0 0 1px #9eade6;
     border-color: #9eade6;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #263238;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #263238;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #263238;
   }
   .p-treeselect .p-treeselect-label {
diff --git a/public/themes/viva-light/theme.css b/public/themes/viva-light/theme.css
index 1f1c73ccb..61bc248c8 100644
--- a/public/themes/viva-light/theme.css
+++ b/public/themes/viva-light/theme.css
@@ -425,13 +425,13 @@
   .p-autocomplete.p-invalid.p-component > .p-inputtext {
     border-color: #f88c79;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input {
     background-color: #f2f2f2;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:hover {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-autocomplete.p-variant.p-component > .p-autocomplete-input:enabled:focus {
+  .p-autocomplete.p-variant-filled.p-component > .p-autocomplete-input:enabled:focus {
     background-color: #f2f2f2;
   }
 
@@ -488,13 +488,13 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-calendar.p-variant > .p-inputtext {
+  .p-calendar.p-variant-filled > .p-inputtext {
     background-color: #f2f2f2;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:hover {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-calendar.p-variant > .p-inputtext:enabled:focus {
+  .p-calendar.p-variant-filled > .p-inputtext:enabled:focus {
     background-color: #f2f2f2;
   }
 
@@ -684,7 +684,8 @@
   .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
     padding-right: 0;
   }
-  .p-datepicker.p-datepicker-mobile table th, .p-datepicker.p-datepicker-mobile table td {
+  .p-datepicker.p-datepicker-mobile table th,
+.p-datepicker.p-datepicker-mobile table td {
     padding: 0;
   }
   .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled) {
@@ -737,13 +738,13 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-cascadeselect.p-variant {
+  .p-cascadeselect.p-variant-filled {
     background-color: #f2f2f2;
   }
-  .p-cascadeselect.p-variant:enabled:hover {
+  .p-cascadeselect.p-variant-filled:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-cascadeselect.p-variant:enabled:focus {
+  .p-cascadeselect.p-variant-filled:enabled:focus {
     background-color: #f2f2f2;
   }
   .p-cascadeselect .p-cascadeselect-label {
@@ -880,16 +881,16 @@
   .p-checkbox.p-invalid > .p-checkbox-box {
     border-color: #f88c79;
   }
-  .p-checkbox.p-variant .p-checkbox-box {
+  .p-checkbox.p-variant-filled .p-checkbox-box {
     background-color: #f2f2f2;
   }
-  .p-checkbox.p-variant.p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled.p-highlight .p-checkbox-box {
     background: #5472d4;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {
     background-color: #f2f2f2;
   }
-  .p-checkbox.p-variant:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
+  .p-checkbox.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover).p-highlight .p-checkbox-box {
     background: #3c5ece;
   }
 
@@ -915,13 +916,13 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-chips.p-variant > .p-chips-multiple-container {
+  .p-chips.p-variant-filled > .p-chips-multiple-container {
     background-color: #f2f2f2;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:hover {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-chips.p-variant > .p-chips-multiple-container:enabled:focus {
+  .p-chips.p-variant-filled > .p-chips-multiple-container:enabled:focus {
     background-color: #f2f2f2;
   }
   .p-chips .p-chips-multiple-container {
@@ -991,16 +992,16 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-dropdown.p-variant {
+  .p-dropdown.p-variant-filled {
     background: #f2f2f2;
   }
-  .p-dropdown.p-variant:not(.p-disabled):hover {
+  .p-dropdown.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f2f2;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f2f2f2;
   }
-  .p-dropdown.p-variant:not(.p-disabled).p-focus .p-inputtext {
+  .p-dropdown.p-variant-filled:not(.p-disabled).p-focus .p-inputtext {
     background-color: transparent;
   }
   .p-dropdown.p-dropdown-clearable .p-dropdown-label {
@@ -1189,13 +1190,13 @@
   .p-inputnumber.p-invalid.p-component > .p-inputtext {
     border-color: #f88c79;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input {
     background-color: #f2f2f2;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:hover {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-inputnumber.p-variant > .p-inputnumber-input:enabled:focus {
+  .p-inputnumber.p-variant-filled > .p-inputnumber-input:enabled:focus {
     background-color: #f2f2f2;
   }
 
@@ -1279,13 +1280,13 @@
   .p-inputtext.p-invalid.p-component {
     border-color: #f88c79;
   }
-  .p-inputtext.p-variant.p-component {
+  .p-inputtext.p-variant-filled.p-component {
     background-color: #f2f2f2;
   }
-  .p-inputtext.p-variant.p-component:enabled:hover {
+  .p-inputtext.p-variant-filled.p-component:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-inputtext.p-variant.p-component:enabled:focus {
+  .p-inputtext.p-variant-filled.p-component:enabled:focus {
     background-color: #f2f2f2;
   }
   .p-inputtext.p-inputtext-sm {
@@ -1466,13 +1467,13 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-multiselect.p-variant {
+  .p-multiselect.p-variant-filled {
     background: #f2f2f2;
   }
-  .p-multiselect.p-variant:not(.p-disabled):hover {
+  .p-multiselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f2f2;
   }
-  .p-multiselect.p-variant:not(.p-disabled).p-focus {
+  .p-multiselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f2f2f2;
   }
   .p-multiselect .p-multiselect-label {
@@ -1612,13 +1613,13 @@
   .p-password.p-invalid.p-component > .p-inputtext {
     border-color: #f88c79;
   }
-  .p-password.p-variant > .p-inputtext {
+  .p-password.p-variant-filled > .p-inputtext {
     background: #f2f2f2;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled):hover {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled):hover {
     background-color: #f2f2f2;
   }
-  .p-password.p-variant > .p-inputtext:not(.p-disabled).p-focus {
+  .p-password.p-variant-filled > .p-inputtext:not(.p-disabled).p-focus {
     background-color: #f2f2f2;
   }
 
@@ -1702,16 +1703,16 @@
   .p-radiobutton.p-invalid > .p-radiobutton-box {
     border-color: #f88c79;
   }
-  .p-radiobutton.p-variant .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled .p-radiobutton-box {
     background-color: #f2f2f2;
   }
-  .p-radiobutton.p-variant.p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled.p-highlight .p-radiobutton-box {
     background: #5472d4;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {
     background-color: #f2f2f2;
   }
-  .p-radiobutton.p-variant:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
+  .p-radiobutton.p-variant-filled:not(.p-disabled):has(.p-radiobutton-input:hover).p-highlight .p-radiobutton-box {
     background: #3c5ece;
   }
 
@@ -1845,13 +1846,13 @@
     border-color: #5472d4;
   }
 
-  .p-inputtextarea.p-variant {
+  .p-inputtextarea.p-variant-filled {
     background-color: #f2f2f2;
   }
-  .p-inputtextarea.p-variant:enabled:hover {
+  .p-inputtextarea.p-variant-filled:enabled:hover {
     background-color: #f2f2f2;
   }
-  .p-inputtextarea.p-variant:enabled:focus {
+  .p-inputtextarea.p-variant-filled:enabled:focus {
     background-color: #f2f2f2;
   }
 
@@ -1871,13 +1872,13 @@
     box-shadow: 0 0 0 0.1rem #bbc7ee;
     border-color: #91a4e3;
   }
-  .p-treeselect.p-variant {
+  .p-treeselect.p-variant-filled {
     background: #f2f2f2;
   }
-  .p-treeselect.p-variant:not(.p-disabled):hover {
+  .p-treeselect.p-variant-filled:not(.p-disabled):hover {
     background-color: #f2f2f2;
   }
-  .p-treeselect.p-variant:not(.p-disabled).p-focus {
+  .p-treeselect.p-variant-filled:not(.p-disabled).p-focus {
     background-color: #f2f2f2;
   }
   .p-treeselect .p-treeselect-label {