feat(dees-pdf-preview): enhance hover functionality and page indicator display

feat(dees-pdf-viewer): improve input handling and remove unused variables

ts_web/elements/dees-pdf-preview/styles.ts

@@ -36,18 +36,25 @@ export const previewStyles = [
       position: relative;
       width: 100%;
       height: 100%;
-      padding: 20px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: 16px;
       box-sizing: border-box;
     }
 
     .preview-canvas {
-      position: absolute;
+      position: relative;
       background: white;
       border: 1px solid ${cssManager.bdTheme('hsl(214 31% 88%)', 'hsl(217 25% 30%)')};
       border-radius: 4px;
       display: block;
+      max-width: 100%;
+      max-height: 100%;
+      object-fit: contain;
       image-rendering: -webkit-optimize-contrast;
       image-rendering: crisp-edges;
+      box-shadow: 0 2px 8px ${cssManager.bdTheme('rgba(0, 0, 0, 0.08)', 'rgba(0, 0, 0, 0.2)')};
     }
 
     .preview-info {
@@ -153,6 +160,35 @@ export const previewStyles = [
       font-size: 32px;
     }
 
+    .preview-page-indicator {
+      position: absolute;
+      top: 12px;
+      left: 12px;
+      right: 12px;
+      padding: 6px 10px;
+      background: ${cssManager.bdTheme('hsl(0 0% 0% / 0.75)', 'hsl(0 0% 100% / 0.85)')};
+      color: ${cssManager.bdTheme('white', 'hsl(215 20% 12%)')};
+      border-radius: 6px;
+      font-size: 12px;
+      font-weight: 600;
+      text-align: center;
+      backdrop-filter: blur(8px);
+      z-index: 15;
+      pointer-events: none;
+      animation: fadeIn 0.2s ease;
+    }
+
+    @keyframes fadeIn {
+      from {
+        opacity: 0;
+        transform: translateY(-4px);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0);
+      }
+    }
+
     /* Responsive sizes */
     :host([size="small"]) .preview-container {
       width: 150px;