Bug somewhere

static/sass/components/_modals.scss

@@ -0,0 +1,43 @@
+// Variables
+$modal-bg: rgba(0, 0, 0, 0.3);
+$modal-blur: 8px;
+$modal-z-index: 999999;
+$modal-content-z-index: 50000;
+$modal-content-bg: #fff;
+$modal-content-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
+
+// Modal background with blur effect
+.modal {
+  display: none; // Hidden by default
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: $modal-bg; // Semi-transparent dark background
+  backdrop-filter: blur($modal-blur); // Blurs everything behind the modal
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: $modal-z-index; // Ensure it stays on top
+}
+
+// Modal content
+.modal-content {
+  background-color: $modal-content-bg;
+  padding: 20px;
+  border-radius: 5px;
+  box-shadow: $modal-content-shadow;
+  width: 400px;
+  text-align: center;
+  z-index: $modal-content-z-index; // Content stays above the blurred overlay
+}
+
+// Rotating buttons
+.open {
+  transform: rotate(15deg); // Rotates button 15 degrees clockwise
+}
+
+.open_inv {
+  transform: rotate(-15deg); // Rotates button 15 degrees counterclockwise
+}