/* ============================================================
   ArcheoMap — longpress.css v304.3
   Feedback visivo per long-press (4s) sulla mappa.
   Ripristinato: progress ring SVG + icona 📍 + testo progressivo
   + snap al 100% + pin pulsante sul drop + badge coordinate.
   Il JS (js/longpress-report.js) crea un div con id
   "longpressFeedback" posizionato al punto di pressione e
   animato tramite classi .lp-active / .lp-complete.
   ============================================================ */

/* ── Container principale del feedback ─────────────────────── */
#longpressFeedback{
  position:fixed;
  left:0; top:0;
  width:120px; height:120px;
  margin-left:-60px; margin-top:-60px;
  pointer-events:none;
  z-index:10060;
  display:none;
  align-items:center;
  justify-content:center;
  opacity:0;
  transform:scale(.55);
  transition:opacity .12s ease-out, transform .16s cubic-bezier(.2,.7,.3,1);
  will-change:opacity,transform;
}

#longpressFeedback.lp-active{
  opacity:1;
  transform:scale(1);
}

#longpressFeedback.lp-complete{
  transform:scale(1.12);
}

/* ── Progress ring SVG (circonferenza 2π·54 = 339.292) ─────── */
.lp-ring-svg{
  position:absolute;
  inset:0;
  width:120px; height:120px;
  transform:rotate(-90deg);
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.45));
}

.lp-ring-bg{
  fill:rgba(20,23,28,.72);
  stroke:rgba(240,192,64,.18);
  stroke-width:6;
}

.lp-ring-progress{
  fill:none;
  stroke:#f0c040;
  stroke-width:6;
  stroke-linecap:round;
  stroke-dasharray:339.292;
  stroke-dashoffset:339.292;
  /* Nota: JS pilota dashoffset direttamente (no transition CSS)
     per sincronia perfetta con il timer di longpress-report.js. */
}

#longpressFeedback.lp-complete .lp-ring-progress{
  stroke:#4CAF50;
  filter:drop-shadow(0 0 8px rgba(76,175,80,.6));
}

/* ── Icona centrale 📍 ─────────────────────────────────────── */
.lp-icon{
  position:relative;
  font-size:38px;
  line-height:1;
  animation:lpIconPulse 1.4s ease-in-out infinite;
  text-shadow:0 2px 6px rgba(0,0,0,.5);
  z-index:1;
}
@keyframes lpIconPulse{
  0%,100%{ transform:scale(1) }
  50%   { transform:scale(1.12) }
}
#longpressFeedback.lp-complete .lp-icon{
  animation:lpIconBoom .45s ease-out forwards;
}
@keyframes lpIconBoom{
  0%  { transform:scale(1) }
  50% { transform:scale(1.55) }
  100%{ transform:scale(1.2) }
}

/* ── Testo sotto il ring ──────────────────────────────────── */
.lp-text{
  position:absolute;
  left:50%;
  top:100%;
  transform:translate(-50%, 10px);
  white-space:nowrap;
  font:600 12.5px -apple-system,system-ui,BlinkMacSystemFont,sans-serif;
  color:#f5e6c8;
  background:rgba(20,23,28,.88);
  padding:5px 12px;
  border-radius:14px;
  border:1px solid rgba(240,192,64,.28);
  box-shadow:0 4px 14px rgba(0,0,0,.4);
  letter-spacing:.2px;
}
#longpressFeedback.lp-complete .lp-text{
  color:#baf0c0;
  border-color:rgba(76,175,80,.5);
  background:rgba(20,32,24,.9);
}

/* ── Pin temporaneo drop-animation dopo il completamento ──── */
.lp-temp-marker{ background:transparent !important; border:0 !important; }

.lp-pin-drop{
  position:relative;
  width:48px; height:48px;
  animation:lpPinDrop .55s cubic-bezier(.2,1.3,.3,1) both;
  transform-origin:center bottom;
}
@keyframes lpPinDrop{
  0%  { transform:translateY(-60px) scale(.4); opacity:0 }
  60% { transform:translateY(0)     scale(1.12); opacity:1 }
  80% { transform:translateY(-6px)  scale(.97) }
  100%{ transform:translateY(0)     scale(1);   opacity:1 }
}

.lp-pin-head{
  position:absolute;
  left:50%; top:0;
  transform:translateX(-50%);
  font-size:38px;
  line-height:1;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.55));
  z-index:2;
}

.lp-pin-pulse{
  position:absolute;
  left:50%; bottom:-2px;
  width:28px; height:28px;
  margin-left:-14px;
  border-radius:50%;
  background:rgba(240,192,64,.45);
  animation:lpPinPulse 1.4s ease-out infinite;
  z-index:1;
}
@keyframes lpPinPulse{
  0%  { transform:scale(.6); opacity:.9 }
  70% { transform:scale(2.1); opacity:0 }
  100%{ transform:scale(2.1); opacity:0 }
}

/* ── Badge coordinate nel wizard "Segnala" ───────────────── */
.lp-coords-badge{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  margin:6px 0 14px;
  background:linear-gradient(135deg,rgba(240,192,64,.14),rgba(232,115,74,.12));
  border:1px solid rgba(240,192,64,.4);
  border-radius:12px;
  color:#f5e6c8;
  font-size:13px;
  box-shadow:0 4px 16px rgba(0,0,0,.35);
}
.lp-coords-icon{
  font-size:22px;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.45));
}
.lp-coords-info{ flex:1; min-width:0 }
.lp-coords-label{
  font-size:11px;
  opacity:.75;
  text-transform:uppercase;
  letter-spacing:.4px;
  margin-bottom:2px;
}
.lp-coords-value{
  font:700 13.5px ui-monospace,Menlo,Consolas,monospace;
  color:#ffd060;
}

/* ── Hint zoom insufficiente ──────────────────────────────── */
.lp-zoom-hint{
  position:fixed;
  left:50%;
  bottom:max(100px, calc(env(safe-area-inset-bottom,0px) + 100px));
  transform:translate(-50%, 20px);
  background:rgba(20,23,28,.94);
  color:#f5e6c8;
  padding:11px 18px;
  border-radius:22px;
  border:1px solid rgba(240,192,64,.35);
  font:600 13px -apple-system,system-ui,sans-serif;
  box-shadow:0 8px 26px rgba(0,0,0,.5);
  backdrop-filter:blur(10px);
  opacity:0;
  pointer-events:none;
  z-index:10055;
  transition:opacity .25s ease, transform .3s cubic-bezier(.2,1.3,.3,1);
  white-space:nowrap;
}
.lp-zoom-hint.lp-hint-show{
  opacity:1;
  transform:translate(-50%, 0);
}

/* ── Retro-compat: .lp-ring (v302 originale, non usato da
   longpress-report.js ma lo preservo per altri consumatori). */
.lp-ring{
  position:fixed;
  pointer-events:none;
  width:60px; height:60px;
  margin-left:-30px; margin-top:-30px;
  border-radius:50%;
  border:3px solid #e6891a;
  box-shadow:0 0 0 0 rgba(230,137,26,.55);
  z-index:10060;
  animation:lpRing .75s cubic-bezier(.2,.7,.3,1) forwards;
}
@keyframes lpRing{
  0%  { transform:scale(.2);  opacity:.9; box-shadow:0 0 0 0  rgba(230,137,26,.6) }
  60% { transform:scale(1.05);opacity:.8; box-shadow:0 0 0 20px rgba(230,137,26,0) }
  100%{ transform:scale(1.4); opacity:0 }
}
.lp-ring.success{ border-color:#4CAF50; box-shadow:0 0 0 0 rgba(76,175,80,.55) }
.lp-ring.error  { border-color:#E53935; box-shadow:0 0 0 0 rgba(229,57,53,.55) }

/* ── Report panel (v302 legacy, conservato) ──────────────── */
.lp-report-panel{
  position:fixed;inset:auto 10px 80px 10px;
  background:#14171c;color:#e8e6e3;
  border:1px solid #2a2f36;border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);
  z-index:10070;padding:14px;
  max-width:500px;margin:0 auto;
}
.lp-report-panel h3{margin:0 0 10px;color:#f0c040;font-size:16px}
.lp-report-panel textarea,
.lp-report-panel input{
  width:100%;box-sizing:border-box;
  background:#1a1f2e;color:#e8e6e3;
  border:1px solid #2a2f36;border-radius:8px;
  padding:10px;font:14px -apple-system,system-ui,sans-serif;
  margin:4px 0 8px;
}
.lp-report-panel textarea{min-height:80px;resize:vertical}
.lp-report-panel .lp-actions{display:flex;gap:8px;justify-content:flex-end}
.lp-btn{
  background:#e6891a;color:#fff;border:0;
  border-radius:8px;padding:8px 14px;font-weight:700;cursor:pointer;
}
.lp-btn.ghost{background:transparent;color:#8899aa;border:1px solid #2a2f36}