added purple overlay to iframes

homepage-system/homepage-orsi.yaml

@@ -274,18 +274,33 @@ data:
       object-fit: contain !important;
     }
 
-    .calcom-iframe {
+    /* Iframe container sizing and positioning for overlay */
-    height: 600px !important;
+    .calcom-iframe,
-    }
-
     .calendar-iframe {
-    height: 600px !important;
+      height: 600px !important;
+      position: relative !important;
     }
 
+    /* Purple filter on iframes */
     iframe[src*="calendar.google.com"],
     iframe[src*="booking.dooplex.hu"] {
-    filter: sepia(25%) saturate(130%) hue-rotate(230deg) brightness(0.93) !important;
+      filter: sepia(0.25) saturate(3) hue-rotate(250deg) brightness(1.02) !important;
-    border-radius: 8px;
+      border-radius: 8px !important;
+    }
+
+    /* Purple overlay on iframe containers */
+    .calcom-iframe::after,
+    .calendar-iframe::after {
+      content: "" !important;
+      position: absolute !important;
+      top: 0 !important;
+      left: 0 !important;
+      right: 0 !important;
+      bottom: 0 !important;
+      background: rgba(226, 146, 255, 0.18) !important;
+      pointer-events: none !important;
+      z-index: 10 !important;
+      border-radius: 8px !important;
     }
 
   # Custom JS