/* ignore-list-generator — generated by scripts/tools-v2/build-tool-css.js from
   views/v1-backup/tools-ignore-list-generator.ejs. DO NOT EDIT BY HAND: npm run test:tools-page-v2
   regenerates it and fails if this file has drifted.

   The shared vocabulary (.btn-primary, .form-input, .tool-card, .badge-*,
   .toast-*, #map, headings) is NOT here — public/css/tools-page-v2.css
   declares it once for every tool page. What is left is this tool's own,
   with its colour literals resolved to theme tokens and every selector
   scoped to the tool body so nothing reaches the shared header. */

.tpv2-body .modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  z-index: 9999;
  padding: 3rem 1rem 1rem 1rem;
  overflow-y: auto;
}

.tpv2-body .modal-backdrop.hidden {
  display: none;
}

.tpv2-body .custom-scrollbar::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.tpv2-body .custom-scrollbar::-webkit-scrollbar-track {
  background-color: var(--sk-surface);
  border-radius: 10px;
}

.tpv2-body .custom-scrollbar::-webkit-scrollbar-thumb {
  background: var(--sk-border);
  border-radius: 10px;
}

.tpv2-body .custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--sk-border);
}

.tpv2-body .item-card {
  transition: all 0.15s ease;
  position: relative;
}

.tpv2-body .item-card:hover {
  background-color: var(--sk-surface);
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.tpv2-body .item-selected {
  background-color: var(--sk-border);
  border-color: var(--sk-info);
}

.tpv2-body .item-image {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border-radius: 6px;
  background-color: var(--sk-surface);
  border: 1px solid var(--sk-border);
}

.tpv2-body .item-image-placeholder {
  width: 48px;
  height: 48px;
  background-color: var(--sk-surface);
  border: 1px solid var(--sk-border);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--sk-muted);
  font-size: 12px;
}

.tpv2-body .item-image-loading {
  width: 48px;
  height: 48px;
  background-color: var(--sk-surface);
  border: 1px solid var(--sk-border);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}

.tpv2-body .selected-item-image {
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 4px;
  background-color: var(--sk-surface);
  border: 1px solid var(--sk-border);
}

.tpv2-body .selected-item-placeholder {
  width: 32px;
  height: 32px;
  background-color: var(--sk-surface);
  border: 1px solid var(--sk-border);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--sk-muted);
  font-size: 10px;
}

.tpv2-body .has-attachments::after {
  content: '';
  position: absolute;
  top: 8px;
  right: 8px;
  width: 8px;
  height: 8px;
  background-color: var(--sk-success);
  border-radius: 50%;
  border: 2px solid white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.tpv2-body .item-card.selected-elsewhere {
  background-color: var(--sk-bg) !important;
  border-color: var(--sk-info) !important;
  opacity: 0.8;
}

.tpv2-body .attachment-item {
  transition: all 0.15s ease;
}

.tpv2-body .attachment-item:hover {
  background-color: var(--sk-surface);
  transform: translateY(-1px);
}

.tpv2-body .attachment-item.selected {
  background-color: var(--sk-border);
  border-color: var(--sk-info);
}

.tpv2-body .attachment-item.selected .font-medium {
  color: var(--sk-info-text);
}

.tpv2-body .already-selected-indicator {
  color: var(--sk-success-text);
  font-size: 10px;
}

.tpv2-body .modal-enter {
  animation: modalEnter 0.3s ease-out;
}

@keyframes modalEnter {
  from { opacity: 0;
        transform: scale(0.9); }
  to { opacity: 1;
        transform: scale(1); }
}