@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@500;600;700&display=swap');
/* @import "tailwindcss"; */

@theme {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
  --font-display: "Space Grotesk", sans-serif;

  /* Custom palette of modern minimalist colors */
  --color-brand-50: #f5f3ff;
  --color-brand-100: #ede9fe;
  --color-brand-500: #8b5cf6;
  --color-brand-600: #7c3aed;
  --color-brand-700: #6d28d9;
}

/* Custom scrollbar for modern looks */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(156, 163, 175, 0.3);
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(156, 163, 175, 0.5);
}

/* Base resets */
body {
  font-family: var(--font-sans);
  background-color: #fafafa;
  color: #1a1a1a;
  overflow: hidden;
}

/* Pulsing effect for points */
@keyframes pin-pulsate {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4);
  }

  70% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(16, 185, 129, 0);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}

.pin-pulse-green {
  animation: pin-pulsate 2s infinite;
}

@keyframes pin-pulsate-red {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
  }

  70% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
  }
}

.pin-pulse-red {
  animation: pin-pulsate-red 2s infinite;
}

@keyframes pin-pulsate-amber {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.45);
  }

  70% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(245, 158, 11, 0);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0);
  }
}

.pin-pulse-amber,
.pin-pulse-orange {
  animation: pin-pulsate-amber 2s infinite;
}

@keyframes pin-pulsate-purple {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(147, 51, 234, 0.45);
  }

  70% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(147, 51, 234, 0);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(147, 51, 234, 0);
  }
}

.pin-pulse-purple {
  animation: pin-pulsate-purple 2s infinite;
}

/* Illuminazione simultanea attività collegata: Principale e Secondari */
@keyframes activity-primary-glow {
  0% {
    transform: scale(1.22);
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 7px #4f46e5, 0 0 24px 6px rgba(79, 70, 229, 0.7);
  }
  50% {
    transform: scale(1.36);
    box-shadow: 0 0 0 4px #ffffff, 0 0 0 13px rgba(79, 70, 229, 0.45), 0 0 32px 10px rgba(79, 70, 229, 0.85);
  }
  100% {
    transform: scale(1.22);
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 7px #4f46e5, 0 0 24px 6px rgba(79, 70, 229, 0.7);
  }
}

@keyframes activity-secondary-glow {
  0% {
    transform: scale(1.15);
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 6px #06b6d4, 0 0 18px 4px rgba(6, 182, 212, 0.65);
  }
  50% {
    transform: scale(1.26);
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 10px rgba(6, 182, 212, 0.4), 0 0 25px 8px rgba(6, 182, 212, 0.75);
  }
  100% {
    transform: scale(1.15);
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 6px #06b6d4, 0 0 18px 4px rgba(6, 182, 212, 0.65);
  }
}

.pin-activity-primary {
  z-index: 99995 !important;
}

.pin-activity-primary .marker-badge {
  animation: activity-primary-glow 1.4s infinite ease-in-out !important;
  border-color: #ffffff !important;
  outline: 2px solid #fbbf24 !important;
}

.pin-activity-secondary {
  z-index: 99990 !important;
}

.pin-activity-secondary .marker-badge {
  animation: activity-secondary-glow 1.4s infinite ease-in-out !important;
  border-color: #ffffff !important;
  outline: 2px solid #67e8f9 !important;
}

/* Evidenziazione dinamica e animata quando un pin viene cliccato nell'elenco */
@keyframes pin-focused-pulse {
  0% {
    transform: scale(1.2);
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 6px #6366f1, 0 10px 20px -3px rgba(0, 0, 0, 0.4);
  }

  50% {
    transform: scale(1.4);
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 14px rgba(99, 102, 241, 0.35), 0 15px 30px -5px rgba(0, 0, 0, 0.55);
  }

  100% {
    transform: scale(1.2);
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 6px #6366f1, 0 10px 20px -3px rgba(0, 0, 0, 0.4);
  }
}

.pin-focused-active {
  z-index: 99999 !important;
}

.pin-focused-active .marker-badge {
  animation: pin-focused-pulse 1.3s infinite ease-in-out !important;
  border-color: #ffffff !important;
}

.building-map-label {
  text-shadow:
    -1px -1px 0 #fff,
    1px -1px 0 #fff,
    -1px 1px 0 #fff,
    1px 1px 0 #fff;
  pointer-events: none;
}

/* Tooltip Edificio Selezionato (Mesh Picking) */
.selected-building-tooltip {
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.45), 0 8px 10px -6px rgba(0, 0, 0, 0.35);
  animation: building-pop 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes building-pop {
  0% {
    opacity: 0;
    transform: translateY(4px) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Badge zoom forzato oltre limite */
#overzoom-indicator {
  animation: overzoom-slide 0.25s ease-out forwards;
}

@keyframes overzoom-slide {
  from {
    opacity: 0;
    transform: translate(-50%, -10px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}