feat: theme toasts and move elements styling to their js

frontend/src/js/_tooltip.js

@@ -1,21 +1,11 @@
-import { delegate } from 'tippy.js';
+import {delegate} from 'tippy.js';
 import 'tippy.js/dist/tippy.css';
-import 'tippy.js/themes/light-border.css';
-
+import '../styles/_toasts.scss'
 
 function initiateTooltips() {
-    const currentDataTheme = document.documentElement.getAttribute('data-theme') || '';
-    let theme;
-
-    if (currentDataTheme.endsWith('_dark')) {
-        theme = 'light-border';
-    } else if (currentDataTheme.endsWith('_light')) {
-        theme = 'dark';
-    }
-
     delegate(document.body, {
         target: '[data-tippy-content]',
-        theme: theme,
+        theme: "wygiwyh",
         zIndex: 1089,
         content(reference) {
             return reference.getAttribute('data-tippy-content');

frontend/src/js/datepicker.js

@@ -1,5 +1,6 @@
 import AirDatepicker from 'air-datepicker';
 import {createPopper} from '@popperjs/core';
+import '../styles/_datepicker.scss'
 
 // --- Static Locale Imports ---
 // We import all locales statically to ensure Vite transforms them correctly.

frontend/src/js/select.js

@@ -1,7 +1,6 @@
-// import 'tom-select/dist/css/tom-select.default.min.css';
-
 import TomSelect from "tom-select";
 import * as Popper from "@popperjs/core";
+import '../styles/_tom-select.scss'
 
 
 window.TomSelect = function createDynamicTomSelect(element) {