colors and filters

front/sass/_preview.scss

@@ -3,7 +3,7 @@
   align-items: center;
   justify-content: space-between;
   gap: 10px;
-  background: var(--background-2);
+  background: var(--p10);
   border-radius: 12px;
   .image{
 
@@ -18,19 +18,38 @@
   }
 
   &:hover{
-    background: var(--background-3);
+    background: var(--p30);
     .trash-action{
       display: block;
     }
   }
 }
-.preview-reference{
-  background: var(--background-2);
-  padding: 10px 20px;
-  margin-bottom: 4px;
+
+.file-preview-small{
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 2px;
+  border-radius: 12px;
+  padding: 4px;
+  //background: var(--p10);
 }
+
+
+.preview-reference{
+  background: var(--p10);
+  padding: 10px 20px;
+}
+
+.sortable-container {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+}
+
 .sortable-ghost{
-  border: 2px dashed var(--primary);
+  border: 2px dashed var(--p60);
 }
 
 .sortable-drag { opacity: 0 !important; } .sortable-ghost { opacity: 1 !important; }