react-pdf-highlighter-plus 1.0.4 → 1.0.6

package/dist/esm/index.css

@@ -1,1221 +0,0 @@
-/* src/style/PdfHighlighter.css */
-.PdfHighlighter {
-  position: absolute;
-  overflow: auto;
-  width: 100%;
-  height: 100%;
-  background-color: #333;
-}
-.PdfHighlighter::-webkit-scrollbar {
-  width: 10px;
-  height: 10px;
-}
-.PdfHighlighter::-webkit-scrollbar-thumb {
-  background-color: #9f9f9f;
-  border-radius: 5px;
-}
-.PdfHighlighter::-webkit-scrollbar-thumb:hover {
-  background-color: #d1d1d1;
-}
-.PdfHighlighter::-webkit-scrollbar-track {
-  background-color: #2c2c2c;
-  border-radius: 5px;
-}
-.PdfHighlighter::-webkit-scrollbar-track-piece {
-  background-color: #2c2c2c;
-}
-.PdfHighlighter__tip-container {
-  z-index: 6;
-  position: absolute;
-}
-.PdfHighlighter--disable-selection {
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-  pointer-events: none;
-}
-.PdfHighlighter--freetext-mode {
-  cursor: crosshair;
-}
-.PdfHighlighter--freetext-mode .pdfViewer,
-.PdfHighlighter--freetext-mode .textLayer {
-  cursor: crosshair;
-}
-.PdfHighlighter--image-mode {
-  cursor: crosshair;
-}
-.PdfHighlighter--image-mode .pdfViewer,
-.PdfHighlighter--image-mode .textLayer {
-  cursor: crosshair;
-}
-.PdfHighlighter--drawing-mode {
-  cursor: crosshair;
-}
-.PdfHighlighter--drawing-mode .pdfViewer,
-.PdfHighlighter--drawing-mode .textLayer {
-  cursor: crosshair;
-}
-.PdfHighlighter--area-mode {
-  cursor: crosshair;
-}
-.PdfHighlighter--area-mode .pdfViewer,
-.PdfHighlighter--area-mode .textLayer {
-  cursor: crosshair;
-}
-
-/* src/style/pdf_viewer.css */
-.textLayer {
-  z-index: 2;
-  opacity: 1;
-  mix-blend-mode: multiply;
-  display: flex;
-}
-.annotationLayer {
-  position: absolute;
-  top: 0;
-  z-index: 3;
-}
-html body .textLayer > div:not(.PdfHighlighter__highlight-layer):not(.TextHighlight):not(.TextHighlight-icon) {
-  opacity: 1;
-  mix-blend-mode: multiply;
-}
-.textLayer ::-moz-selection {
-  mix-blend-mode: multiply;
-}
-.textLayer ::selection {
-  mix-blend-mode: multiply;
-}
-@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-  .textLayer {
-    opacity: 0.5;
-  }
-}
-@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-  .textLayer {
-    opacity: 0.5;
-  }
-}
-@supports (-ms-ime-align:auto) {
-  .textLayer {
-    opacity: 0.5;
-  }
-}
-
-/* src/style/DrawingCanvas.css */
-.DrawingCanvas {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 5;
-  cursor: crosshair;
-  touch-action: none;
-}
-.DrawingCanvas__controls {
-  position: fixed;
-  bottom: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  display: flex;
-  gap: 10px;
-  padding: 10px 20px;
-  background-color: rgba(43, 46, 51, 0.95);
-  border-radius: 8px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
-  z-index: 10;
-}
-.DrawingCanvas__controls button {
-  padding: 8px 16px;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  transition: background-color 0.2s, transform 0.1s;
-}
-.DrawingCanvas__controls button:hover {
-  transform: scale(1.02);
-}
-.DrawingCanvas__doneButton {
-  background-color: #4CAF50;
-  color: white;
-}
-.DrawingCanvas__doneButton:hover {
-  background-color: #45a049;
-}
-.DrawingCanvas__cancelButton {
-  background-color: #f44336;
-  color: white;
-}
-.DrawingCanvas__cancelButton:hover {
-  background-color: #da190b;
-}
-.DrawingCanvas__clearButton {
-  background-color: #ff9800;
-  color: white;
-}
-.DrawingCanvas__clearButton:hover {
-  background-color: #e68a00;
-}
-
-/* src/style/MouseSelection.css */
-.MouseSelection {
-  position: absolute;
-  border: 1px dashed #333;
-  background: rgba(153, 193, 218, 255);
-  mix-blend-mode: multiply;
-}
-@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-  .MouseSelection {
-    opacity: 0.5;
-  }
-}
-@supports (-ms-ime-align:auto) {
-  .MouseSelection {
-    opacity: 0.5;
-  }
-}
-
-/* src/style/ShapeCanvas.css */
-.ShapeCanvas {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  cursor: crosshair;
-  z-index: 1000;
-  background: rgba(0, 0, 0, 0.1);
-}
-.ShapeCanvas__controls {
-  position: fixed;
-  bottom: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 12px;
-  z-index: 1002;
-}
-.ShapeCanvas__hint {
-  background: rgba(0, 0, 0, 0.8);
-  color: white;
-  padding: 8px 16px;
-  border-radius: 6px;
-  font-size: 14px;
-  white-space: nowrap;
-}
-.ShapeCanvas__cancelButton {
-  padding: 8px 20px;
-  background: #f44336;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  font-weight: 500;
-  transition: background 0.2s;
-}
-.ShapeCanvas__cancelButton:hover {
-  background: #d32f2f;
-}
-
-/* src/style/TextHighlight.css */
-.TextHighlight {
-  position: absolute;
-}
-.TextHighlight__parts {
-  opacity: 1;
-}
-.TextHighlight__part {
-  cursor: pointer;
-  position: absolute;
-  background: rgba(255, 226, 143, 1);
-  transition: background 0.3s;
-}
-.TextHighlight--scrolledTo .TextHighlight__part {
-  background: #ff4141;
-}
-.TextHighlight__toolbar-wrapper {
-  z-index: 10;
-}
-.TextHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.7);
-  border-radius: 4px;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.2s ease;
-}
-.TextHighlight__toolbar--visible {
-  opacity: 1;
-  pointer-events: auto;
-}
-.TextHighlight__style-button,
-.TextHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.TextHighlight__style-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.TextHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-.TextHighlight__style-panel {
-  margin-top: 4px;
-  background: rgba(0, 0, 0, 0.9);
-  border-radius: 6px;
-  padding: 8px;
-  min-width: 180px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-.TextHighlight__style-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 8px;
-}
-.TextHighlight__style-row:last-child {
-  margin-bottom: 0;
-}
-.TextHighlight__style-row label {
-  color: #ccc;
-  font-size: 11px;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  margin-right: 8px;
-}
-.TextHighlight__style-buttons {
-  display: flex;
-  gap: 4px;
-}
-.TextHighlight__style-type-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  padding: 0;
-  background: transparent;
-  border: 1px solid #666;
-  border-radius: 4px;
-  cursor: pointer;
-  color: #f5f5f5;
-  transition: all 0.2s;
-}
-.TextHighlight__style-type-button:hover {
-  border-color: #b958ff;
-}
-.TextHighlight__style-type-button.active {
-  color: #b958ff;
-  border-color: #b958ff;
-  background: rgba(185, 88, 255, 0.2);
-}
-.TextHighlight__color-options {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-.TextHighlight__color-presets {
-  display: flex;
-  gap: 4px;
-}
-.TextHighlight__color-preset {
-  width: 18px;
-  height: 18px;
-  border: 2px solid transparent;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: transform 0.2s, border-color 0.2s;
-  padding: 0;
-}
-.TextHighlight__color-preset:hover {
-  transform: scale(1.15);
-}
-.TextHighlight__color-preset.active {
-  border-color: #b958ff;
-}
-.TextHighlight__color-options input[type=color] {
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  background: transparent;
-}
-.TextHighlight__color-options input[type=color]::-webkit-color-swatch-wrapper {
-  padding: 0;
-}
-.TextHighlight__color-options input[type=color]::-webkit-color-swatch {
-  border: 1px solid #666;
-  border-radius: 4px;
-}
-.TextHighlight__part--underline {
-  background: transparent !important;
-  border-bottom: 2px solid currentColor;
-}
-.TextHighlight__part.TextHighlight__part--strikethrough {
-  background: transparent !important;
-  overflow: visible;
-}
-.TextHighlight__part.TextHighlight__part--strikethrough::after {
-  content: "";
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 50%;
-  height: 2px;
-  background-color: currentColor;
-  transform: translateY(-50%);
-  pointer-events: none;
-  z-index: 1;
-}
-
-/* src/style/AreaHighlight.css */
-.AreaHighlight {
-  position: absolute;
-}
-.AreaHighlight__part {
-  cursor: pointer;
-  position: absolute;
-  background: rgba(255, 226, 143, 1);
-  transition: background 0.3s;
-}
-.AreaHighlight--scrolledTo .AreaHighlight__part {
-  background: #ff4141;
-}
-.AreaHighlight__toolbar-wrapper {
-  z-index: 10;
-}
-.AreaHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.7);
-  border-radius: 4px;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.2s ease;
-}
-.AreaHighlight__toolbar--visible {
-  opacity: 1;
-  pointer-events: auto;
-}
-.AreaHighlight__style-button,
-.AreaHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.AreaHighlight__style-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.AreaHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-.AreaHighlight__style-panel {
-  margin-top: 4px;
-  background: rgba(0, 0, 0, 0.9);
-  border-radius: 6px;
-  padding: 8px;
-  min-width: 160px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-.AreaHighlight__style-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.AreaHighlight__style-row label {
-  color: #ccc;
-  font-size: 11px;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  margin-right: 8px;
-}
-.AreaHighlight__color-options {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-.AreaHighlight__color-presets {
-  display: flex;
-  gap: 4px;
-}
-.AreaHighlight__color-preset {
-  width: 18px;
-  height: 18px;
-  border: 2px solid transparent;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: transform 0.2s, border-color 0.2s;
-  padding: 0;
-}
-.AreaHighlight__color-preset:hover {
-  transform: scale(1.15);
-}
-.AreaHighlight__color-preset.active {
-  border-color: #b958ff;
-}
-.AreaHighlight__color-options input[type=color] {
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  background: transparent;
-}
-.AreaHighlight__color-options input[type=color]::-webkit-color-swatch-wrapper {
-  padding: 0;
-}
-.AreaHighlight__color-options input[type=color]::-webkit-color-swatch {
-  border: 1px solid #666;
-  border-radius: 4px;
-}
-
-/* src/style/FreetextHighlight.css */
-.FreetextHighlight {
-  position: absolute;
-}
-.FreetextHighlight__container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  border-radius: 4px;
-  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
-  overflow: visible;
-  transition: box-shadow 0.2s ease;
-}
-.FreetextHighlight__container:hover {
-  box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
-}
-.FreetextHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.6);
-  border-radius: 4px;
-  position: absolute;
-  top: 4px;
-  left: 4px;
-  z-index: 10;
-  opacity: 0;
-  transition: opacity 0.2s ease;
-}
-.FreetextHighlight__container:hover .FreetextHighlight__toolbar {
-  opacity: 1;
-}
-.FreetextHighlight__drag-handle {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  cursor: grab;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-  color: white;
-  border-radius: 3px;
-  transition: background 0.2s;
-}
-.FreetextHighlight__drag-handle:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.FreetextHighlight__drag-handle:active {
-  cursor: grabbing;
-}
-.FreetextHighlight__edit-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.FreetextHighlight__edit-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.FreetextHighlight__content {
-  flex: 1;
-  padding: 8px;
-  overflow: hidden;
-  position: relative;
-  z-index: 1;
-}
-.FreetextHighlight__text {
-  width: 100%;
-  height: 100%;
-  cursor: text;
-  overflow: auto;
-  word-wrap: break-word;
-  white-space: pre-wrap;
-}
-.FreetextHighlight__input {
-  width: 100%;
-  height: 100%;
-  border: none;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  resize: none;
-  outline: none;
-  padding: 0;
-  margin: 0;
-}
-.FreetextHighlight--scrolledTo .FreetextHighlight__container {
-  box-shadow: 0 0 0 3px #ff4141, 2px 2px 8px rgba(0, 0, 0, 0.2);
-}
-.FreetextHighlight--editing .FreetextHighlight__container {
-  box-shadow: 0 0 0 2px #4a90d9, 2px 2px 8px rgba(0, 0, 0, 0.2);
-}
-.FreetextHighlight__style-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.FreetextHighlight__style-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.FreetextHighlight__style-panel {
-  position: absolute;
-  top: 100%;
-  left: 0;
-  right: 0;
-  background: white;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 4px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
-  padding: 8px;
-  z-index: 9999;
-  margin-top: 2px;
-}
-.FreetextHighlight__style-row {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 4px;
-  margin-bottom: 8px;
-}
-.FreetextHighlight__style-row:last-child {
-  margin-bottom: 0;
-}
-.FreetextHighlight__style-row label {
-  font-size: 11px;
-  color: #555;
-  white-space: nowrap;
-}
-.FreetextHighlight__style-row input[type=color] {
-  width: 28px;
-  height: 24px;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 3px;
-  padding: 0;
-  cursor: pointer;
-}
-.FreetextHighlight__style-row select {
-  padding: 4px 6px;
-  font-size: 11px;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 3px;
-  background: white;
-  cursor: pointer;
-  min-width: 80px;
-}
-.FreetextHighlight__color-options {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  flex-wrap: wrap;
-  width: 100%;
-}
-.FreetextHighlight__color-presets {
-  display: flex;
-  gap: 4px;
-  flex-wrap: wrap;
-}
-.FreetextHighlight__color-preset {
-  width: 20px;
-  height: 20px;
-  border: 2px solid rgba(0, 0, 0, 0.15);
-  border-radius: 3px;
-  cursor: pointer;
-  padding: 0;
-  transition: transform 0.15s, border-color 0.15s;
-}
-.FreetextHighlight__color-preset:hover {
-  transform: scale(1.15);
-  border-color: rgba(0, 0, 0, 0.3);
-}
-.FreetextHighlight__color-preset.active {
-  border-color: #333;
-  box-shadow: 0 0 0 1px white, 0 0 0 2px #333;
-}
-.FreetextHighlight__color-preset--transparent {
-  background:
-    linear-gradient(
-      45deg,
-      #ccc 25%,
-      transparent 25%),
-    linear-gradient(
-      -45deg,
-      #ccc 25%,
-      transparent 25%),
-    linear-gradient(
-      45deg,
-      transparent 75%,
-      #ccc 75%),
-    linear-gradient(
-      -45deg,
-      transparent 75%,
-      #ccc 75%);
-  background-size: 8px 8px;
-  background-position:
-    0 0,
-    0 4px,
-    4px -4px,
-    -4px 0px;
-  background-color: white;
-}
-.FreetextHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.FreetextHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-
-/* src/style/ImageHighlight.css */
-.ImageHighlight {
-  position: absolute;
-}
-.ImageHighlight__container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  border-radius: 4px;
-  overflow: visible;
-  transition: box-shadow 0.2s ease;
-}
-.ImageHighlight__container:hover {
-  box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
-}
-.ImageHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.6);
-  border-radius: 4px;
-  position: absolute;
-  top: 4px;
-  left: 4px;
-  z-index: 10;
-  opacity: 0;
-  transition: opacity 0.2s ease;
-}
-.ImageHighlight__container:hover .ImageHighlight__toolbar {
-  opacity: 1;
-}
-.ImageHighlight__drag-handle {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  cursor: grab;
-  color: white;
-  border-radius: 3px;
-  transition: background 0.2s;
-}
-.ImageHighlight__drag-handle:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.ImageHighlight__drag-handle:active {
-  cursor: grabbing;
-}
-.ImageHighlight__content {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: white;
-  overflow: hidden;
-  border-radius: 4px;
-}
-.ImageHighlight__image {
-  width: 100%;
-  height: 100%;
-  -o-object-fit: fill;
-  object-fit: fill;
-  pointer-events: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-}
-.ImageHighlight--scrolledTo .ImageHighlight__container {
-  box-shadow: 0 0 0 3px #ff4141, 2px 2px 8px rgba(0, 0, 0, 0.2);
-}
-.ImageHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.ImageHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-
-/* src/style/SignaturePad.css */
-.SignaturePad__overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 10000;
-}
-.SignaturePad__modal {
-  background: white;
-  border-radius: 8px;
-  padding: 16px;
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
-}
-.SignaturePad__title {
-  margin: 0 0 12px 0;
-  font-size: 16px;
-  font-weight: 600;
-  color: #333;
-}
-.SignaturePad__canvas {
-  display: block;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  cursor: crosshair;
-  touch-action: none;
-  background: white;
-}
-.SignaturePad__buttons {
-  display: flex;
-  gap: 8px;
-  margin-top: 12px;
-  justify-content: flex-end;
-}
-.SignaturePad__button {
-  padding: 8px 16px;
-  font-size: 14px;
-  border-radius: 4px;
-  cursor: pointer;
-  transition: background-color 0.2s, border-color 0.2s;
-}
-.SignaturePad__button--clear {
-  background: white;
-  border: 1px solid #ccc;
-  color: #666;
-}
-.SignaturePad__button--clear:hover {
-  background: #f5f5f5;
-  border-color: #999;
-}
-.SignaturePad__button--cancel {
-  background: white;
-  border: 1px solid #ccc;
-  color: #666;
-}
-.SignaturePad__button--cancel:hover {
-  background: #f5f5f5;
-  border-color: #999;
-}
-.SignaturePad__button--done {
-  background: #2196f3;
-  border: 1px solid #2196f3;
-  color: white;
-}
-.SignaturePad__button--done:hover {
-  background: #1976d2;
-  border-color: #1976d2;
-}
-
-/* src/style/DrawingHighlight.css */
-.DrawingHighlight {
-  position: absolute;
-}
-.DrawingHighlight__container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  border-radius: 4px;
-  overflow: visible;
-  transition: box-shadow 0.2s ease;
-}
-.DrawingHighlight__container:hover {
-  box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
-}
-.DrawingHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.6);
-  border-radius: 4px;
-  position: absolute;
-  top: 4px;
-  left: 4px;
-  z-index: 10;
-  opacity: 0;
-  transition: opacity 0.2s ease;
-}
-.DrawingHighlight__container:hover .DrawingHighlight__toolbar {
-  opacity: 1;
-}
-.DrawingHighlight__drag-handle {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  cursor: grab;
-  color: white;
-  border-radius: 3px;
-  transition: background 0.2s;
-}
-.DrawingHighlight__drag-handle:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.DrawingHighlight__drag-handle:active {
-  cursor: grabbing;
-}
-.DrawingHighlight__content {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
-  border-radius: 4px;
-  background: transparent;
-}
-.DrawingHighlight__image {
-  max-width: 100%;
-  max-height: 100%;
-  -o-object-fit: contain;
-  object-fit: contain;
-  pointer-events: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-}
-.DrawingHighlight--scrolledTo .DrawingHighlight__container {
-  box-shadow: 0 0 0 3px #ff4141, 2px 2px 8px rgba(0, 0, 0, 0.2);
-}
-.DrawingHighlight__style-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  padding: 0;
-  background: transparent;
-  border: none;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  transition: background 0.2s;
-}
-.DrawingHighlight__style-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.DrawingHighlight__style-controls {
-  position: absolute;
-  top: 28px;
-  left: 4px;
-  background: rgba(0, 0, 0, 0.85);
-  border-radius: 6px;
-  padding: 8px;
-  z-index: 20;
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  min-width: 120px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-.DrawingHighlight__color-picker {
-  display: flex;
-  gap: 4px;
-  flex-wrap: wrap;
-}
-.DrawingHighlight__color-button {
-  width: 20px;
-  height: 20px;
-  border: 2px solid transparent;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: transform 0.2s, border-color 0.2s;
-  padding: 0;
-}
-.DrawingHighlight__color-button:hover {
-  transform: scale(1.15);
-}
-.DrawingHighlight__color-button.active {
-  border-color: #b958ff;
-}
-.DrawingHighlight__width-picker {
-  display: flex;
-  gap: 4px;
-}
-.DrawingHighlight__width-button {
-  background: transparent;
-  color: #f5f5f5;
-  border: 1px solid #666;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 10px;
-  padding: 2px 6px;
-  transition:
-    color 0.2s,
-    border-color 0.2s,
-    background-color 0.2s;
-}
-.DrawingHighlight__width-button:hover {
-  border-color: #b958ff;
-}
-.DrawingHighlight__width-button.active {
-  color: #b958ff;
-  border-color: #b958ff;
-  background-color: rgba(185, 88, 255, 0.2);
-}
-.DrawingHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.DrawingHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-
-/* src/style/ShapeHighlight.css */
-.ShapeHighlight {
-  position: absolute;
-}
-.ShapeHighlight__rnd {
-  cursor: move;
-}
-.ShapeHighlight__container {
-  width: 100%;
-  height: 100%;
-  position: relative;
-}
-.ShapeHighlight__svg {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
-.ShapeHighlight--scrolledTo .ShapeHighlight__svg rect,
-.ShapeHighlight--scrolledTo .ShapeHighlight__svg ellipse,
-.ShapeHighlight--scrolledTo .ShapeHighlight__svg line {
-  stroke: #ff4141 !important;
-}
-.ShapeHighlight--scrolledTo .ShapeHighlight__svg polygon {
-  fill: #ff4141 !important;
-}
-.ShapeHighlight__toolbar-wrapper {
-  z-index: 10;
-}
-.ShapeHighlight__toolbar {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 2px 4px;
-  background: rgba(0, 0, 0, 0.7);
-  border-radius: 4px;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.2s ease;
-}
-.ShapeHighlight__toolbar--visible {
-  opacity: 1;
-  pointer-events: auto;
-}
-.ShapeHighlight__style-button,
-.ShapeHighlight__delete-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  color: white;
-  border-radius: 3px;
-  padding: 0;
-  transition: background 0.2s;
-}
-.ShapeHighlight__style-button:hover {
-  background: rgba(255, 255, 255, 0.2);
-}
-.ShapeHighlight__delete-button:hover {
-  background: rgba(255, 100, 100, 0.6);
-}
-.ShapeHighlight__style-panel {
-  margin-top: 4px;
-  background: rgba(0, 0, 0, 0.9);
-  border-radius: 6px;
-  padding: 8px;
-  min-width: 180px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-.ShapeHighlight__style-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 8px;
-}
-.ShapeHighlight__style-row:last-child {
-  margin-bottom: 0;
-}
-.ShapeHighlight__style-row label {
-  color: #ccc;
-  font-size: 11px;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  margin-right: 8px;
-}
-.ShapeHighlight__color-options {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-.ShapeHighlight__color-presets {
-  display: flex;
-  gap: 4px;
-}
-.ShapeHighlight__color-preset {
-  width: 18px;
-  height: 18px;
-  border: 2px solid transparent;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: transform 0.2s, border-color 0.2s;
-  padding: 0;
-}
-.ShapeHighlight__color-preset:hover {
-  transform: scale(1.15);
-}
-.ShapeHighlight__color-preset.active {
-  border-color: #b958ff;
-}
-.ShapeHighlight__color-options input[type=color] {
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  background: transparent;
-}
-.ShapeHighlight__color-options input[type=color]::-webkit-color-swatch-wrapper {
-  padding: 0;
-}
-.ShapeHighlight__color-options input[type=color]::-webkit-color-swatch {
-  border: 1px solid #666;
-  border-radius: 4px;
-}
-.ShapeHighlight__width-options {
-  display: flex;
-  gap: 4px;
-}
-.ShapeHighlight__width-button {
-  padding: 4px 8px;
-  background: transparent;
-  border: 1px solid #666;
-  border-radius: 4px;
-  cursor: pointer;
-  color: #ccc;
-  font-size: 11px;
-  transition: all 0.2s;
-}
-.ShapeHighlight__width-button:hover {
-  border-color: #b958ff;
-  color: white;
-}
-.ShapeHighlight__width-button.active {
-  background: rgba(185, 88, 255, 0.2);
-  border-color: #b958ff;
-  color: #b958ff;
-}
-/*# sourceMappingURL=index.css.map */