From 52774769215882901964c915a9b4e2ba564fbeea Mon Sep 17 00:00:00 2001
From: Yiannis Christodoulou <yiannis@web357.com>
Date: Tue, 30 Sep 2025 10:18:47 +0300
Subject: [PATCH] fix: Apply rounded corners only when useRoundedCorners is
 true

---
 .../components/overlays/EndScreenOverlay.css   | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend-tools/video-js/src/components/overlays/EndScreenOverlay.css b/frontend-tools/video-js/src/components/overlays/EndScreenOverlay.css
index 34c33fde..7bf04727 100644
--- a/frontend-tools/video-js/src/components/overlays/EndScreenOverlay.css
+++ b/frontend-tools/video-js/src/components/overlays/EndScreenOverlay.css
@@ -71,7 +71,6 @@
 .vjs-related-video-item {
     position: relative;
     cursor: pointer;
-    border-radius: 8px;
     overflow: hidden;
     transition:
         transform 0.2s ease,
@@ -83,6 +82,11 @@
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
 }
 
+/* Apply rounded corners only when useRoundedCorners is true */
+.video-js.video-js-rounded-corners .vjs-related-video-item {
+    border-radius: 8px;
+}
+
 .vjs-related-video-item:hover {
     transform: translateY(-2px);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
@@ -140,18 +144,18 @@
 
 .vjs-related-video-author {
     font-size: 12px;
-    color: #ccc;
+    color: #fff;
 }
 
 .vjs-related-video-views {
     font-size: 12px;
-    color: #aaa;
+    color: #fff;
 }
 
 .vjs-related-video-author::after {
     content: "•";
     margin-left: 8px;
-    color: #666;
+    color: #fff;
 }
 
 .vjs-related-video-duration {
@@ -163,11 +167,15 @@
     padding: 2px 6px;
     font-size: 11px;
     font-weight: bold;
-    border-radius: 2px;
     opacity: 0;
     transition: opacity 0.3s ease;
 }
 
+/* Apply rounded corners to duration badge only when useRoundedCorners is true */
+.video-js.video-js-rounded-corners .vjs-related-video-duration {
+    border-radius: 2px;
+}
+
 .vjs-related-video-item:hover .vjs-related-video-duration {
     opacity: 1;
 }