/* Selector mode styles */
.selector-hover {
  outline: 2px solid rgba(59, 130, 246, 0.5) !important;
  outline-offset: -2px !important;
  cursor: pointer !important;
}
.selector-selected {
  outline: 2px solid #ff7500 !important;
  outline-offset: -2px !important;
  box-shadow: inset 0 0 0 1000px rgba(255, 117, 0, 0.25) !important;
}
img.selector-hover {
  filter: brightness(0.95) !important;
}
img.selector-selected {
  filter: brightness(0.8) sepia(0.4) hue-rotate(-10deg) !important;
}
/* 画像オーバーレイ用スタイル */
.img-overlay-border {
  pointer-events: none;
  z-index: 9998;
}
.img-overlay-border.hover-blue {
  border: 2px solid rgba(59, 130, 246, 0.7);
  background: rgba(59, 130, 246, 0.1);
}
.img-overlay-border.selected-orange {
  border: 2px solid #ff7500;
  background: rgba(255, 117, 0, 0.15);
}

/* CSS edit mode styles */
.css-edit-hover {
  outline: 2px dashed #3b82f6 !important;
  outline-offset: -2px !important;
  cursor: pointer !important;
}
.css-edit-selected {
  outline: 3px solid #3b82f6 !important;
  outline-offset: -3px !important;
  box-shadow: inset 0 0 0 1000px rgba(59, 130, 246, 0.25) !important;
}
img.css-edit-hover {
  filter: brightness(0.95) !important;
}
img.css-edit-selected {
  filter: brightness(0.85) saturate(1.3) !important;
}