/* Custom Webkit scrollbar for premium theme */
.scroll-thin::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.scroll-thin::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.5);
  border-radius: 4px;
}

.scroll-thin::-webkit-scrollbar-thumb {
  background: rgba(79, 70, 229, 0.3);
  border-radius: 4px;
}

.scroll-thin::-webkit-scrollbar-thumb:hover {
  background: rgba(79, 70, 229, 0.5);
}

/* Custom styles for page elements */
.pdf-page-wrapper {
  position: relative;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.6);
  border: 1px border-slate-800;
  border-radius: 4px;
  background-color: #ffffff;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pdf-page-wrapper:hover {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.8), 0 10px 10px -5px rgba(0, 0, 0, 0.8);
}

/* Text overlay container */
.text-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  z-index: 10;
}

/* Individual text elements */
.text-item {
  position: absolute;
  pointer-events: auto;
  cursor: text;
  color: transparent; /* Text is transparent by default so you see the underlying canvas */
  user-select: text;
  white-space: nowrap;
  line-height: 1;
  font-family: inherit;
  border: 1px solid transparent;
  transition: background-color 0.15s, border-color 0.15s;
}

/* Editable text block hover indicator */
.text-item:hover {
  background-color: rgba(79, 70, 229, 0.12);
  border-color: rgba(79, 70, 229, 0.4);
  border-radius: 2px;
}

/* Active text block indicator */
.text-item.active {
  background-color: rgba(79, 70, 229, 0.2);
  border-color: #4f46e5;
  border-radius: 2px;
  box-shadow: 0 0 4px rgba(79, 70, 229, 0.4);
}

/* Inline text replacement overlay on canvas */
.canvas-edit-overlay {
  position: absolute;
  z-index: 5;
  pointer-events: none;
}

/* Thumbnail specific styling */
.thumbnail-wrapper {
  position: relative;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 6px;
  overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
  background-color: #ffffff;
}

.thumbnail-wrapper:hover {
  transform: translateY(-2px);
  border-color: rgba(79, 70, 229, 0.4);
}

.thumbnail-wrapper.active {
  border-color: #4f46e5;
  box-shadow: 0 0 10px rgba(79, 70, 229, 0.3);
}

/* Find & Replace Highlight Style */
.text-item.highlight-match {
  background-color: rgba(234, 179, 8, 0.25);
  border-color: rgba(234, 179, 8, 0.8);
}

.text-item.highlight-match-current {
  background-color: rgba(234, 179, 8, 0.5);
  border-color: rgba(234, 179, 8, 1);
  box-shadow: 0 0 8px rgba(234, 179, 8, 0.6);
}

/* Masked region visual preview (renders on the HTML side in real-time) */
.masked-region-preview {
  position: absolute;
  pointer-events: none;
  z-index: 8;
  display: flex;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
}