/* ====================================================================
 * TargetCaptcha – styles
 * Badge invisible-first, fallback slider modal, dark-mode-aware.
 * ==================================================================== */

.tc-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 999px;
  background: rgba(16,185,129,.08);
  border: 1px solid rgba(16,185,129,.22);
  font-size: 12px; font-weight: 500; color: #047857;
  font-family: -apple-system, system-ui, 'Geist', sans-serif;
  line-height: 1;
  transition: all .25s cubic-bezier(.4,0,.2,1);
  user-select: none;
}
.tc-badge:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(16,185,129,.10); }
.tc-badge .tc-shield {
  display:inline-grid; place-items:center;
  width:18px; height:18px; border-radius:5px;
  background: currentColor;
  position: relative; overflow:hidden;
}
.tc-badge .tc-shield::before {
  content:''; position:absolute; inset:2px;
  border-radius:3px;
  background: #fff;
  clip-path: polygon(50% 0,100% 18%,100% 56%,50% 100%,0 56%,0 18%);
}
.tc-badge .tc-shield::after {
  content:''; position:absolute;
  width:6px; height:3px; left:6px; top:8px;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  opacity: 0;
  transition: opacity .2s;
}
.tc-badge.solved .tc-shield::after { opacity: 1; }

.tc-badge.processing {
  background: rgba(245,158,11,.08);
  border-color: rgba(245,158,11,.28);
  color: #b45309;
}
.tc-badge.processing .tc-shield {
  animation: tc-pulse 1.4s ease-in-out infinite;
}
.tc-badge.solved {
  background: rgba(16,185,129,.1);
  border-color: rgba(16,185,129,.35);
  color: #047857;
}
.tc-badge.failed {
  background: rgba(239,68,68,.08);
  border-color: rgba(239,68,68,.25);
  color: #b91c1c;
}
.tc-badge .tc-text { font-variant-numeric: tabular-nums; }

@keyframes tc-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(.88); opacity: .7; }
}
@keyframes tc-spin { to { transform: rotate(360deg); } }
@keyframes tc-fadein { from { opacity:0; transform: translateY(4px); } to { opacity:1; transform: translateY(0); } }
.tc-badge { animation: tc-fadein .35s cubic-bezier(.4,0,.2,1); }

/* Dark mode */
[data-theme="dark"] .tc-badge,
.dark .tc-badge { background: rgba(16,185,129,.12); color:#6ee7b7; border-color: rgba(16,185,129,.35); }
[data-theme="dark"] .tc-badge.processing,
.dark .tc-badge.processing { background: rgba(245,158,11,.15); color:#fcd34d; border-color: rgba(245,158,11,.4); }
[data-theme="dark"] .tc-badge.failed,
.dark .tc-badge.failed { background: rgba(239,68,68,.15); color:#fca5a5; border-color: rgba(239,68,68,.4); }

/* Honeypot (invisibile sia a vista che a screen reader “sensato”, ma resta nel DOM) */
.tc-honeypot {
  position:absolute !important; left:-9999px !important;
  width:1px !important; height:1px !important;
  opacity:0 !important; pointer-events:none !important;
  tab-index:-1 !important;
}

/* ===== Fallback slider (modale) ===== */
.tc-modal {
  position:fixed; inset:0; z-index:9999;
  background: rgba(15,23,42,.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display:none; align-items:center; justify-content:center;
  animation: tc-fade .2s ease;
}
@keyframes tc-fade { from{opacity:0} to{opacity:1} }
.tc-modal.show { display:flex; }

.tc-modal-card {
  background:#fff; border-radius:18px;
  padding:28px;
  max-width: 420px; width: 92%;
  box-shadow: 0 30px 80px -10px rgba(15,23,42,.35), 0 10px 30px -5px rgba(15,23,42,.2);
  animation: tc-pop .35s cubic-bezier(.4, 1.4, .4, 1);
}
@keyframes tc-pop {
  from { opacity:0; transform: translateY(20px) scale(.96); }
  to   { opacity:1; transform: translateY(0) scale(1); }
}
[data-theme="dark"] .tc-modal-card,
.dark .tc-modal-card { background: #142545; color:#e2e8f0; }

.tc-modal-icon {
  width:48px; height:48px; border-radius:14px;
  background: linear-gradient(135deg, #ecfdf5, #d1fae5);
  display:grid; place-items:center;
  font-size: 22px; color:#059669;
  margin-bottom: 14px;
}
[data-theme="dark"] .tc-modal-icon,
.dark .tc-modal-icon { background: linear-gradient(135deg, rgba(16,185,129,.2), rgba(16,185,129,.05)); color:#6ee7b7; }

.tc-modal-title {
  font-weight: 600; font-size: 17px;
  margin-bottom: 6px; color:#0f172a;
  font-family: 'Space Grotesk', 'Geist', system-ui, sans-serif;
}
[data-theme="dark"] .tc-modal-title,
.dark .tc-modal-title { color:#f1f5f9; }

.tc-modal-desc {
  font-size:13.5px; color:#64748b;
  margin-bottom:20px; line-height:1.5;
}
[data-theme="dark"] .tc-modal-desc,
.dark .tc-modal-desc { color:#94a3b8; }

.tc-slider {
  position:relative; height:54px;
  background: #f1f5f9; border-radius:14px;
  border: 1px solid #e2e8f0;
  cursor: grab; user-select: none;
  overflow: hidden;
  touch-action: none;
}
[data-theme="dark"] .tc-slider,
.dark .tc-slider { background:#0f1e36; border-color:#1e3a5f; }

.tc-slider-track {
  position:absolute; inset:0;
  display:grid; place-items:center;
  font-size: 13px; font-weight: 500; color: #64748b;
  letter-spacing: .04em;
  pointer-events:none;
  text-transform: uppercase;
}
[data-theme="dark"] .tc-slider-track,
.dark .tc-slider-track { color:#64748b; }

.tc-slider-fill {
  position:absolute; left:0; top:0; bottom:0;
  width:0;
  background: linear-gradient(135deg, #10b981, #059669);
  border-radius: 14px 0 0 14px;
  transition: width .12s ease;
  pointer-events:none;
}
.tc-slider.solved .tc-slider-fill {
  border-radius: 14px;
  width: 100% !important;
}

.tc-slider-handle {
  position:absolute; left:3px; top:3px;
  width: 48px; height: 48px;
  background:#fff; border-radius: 11px;
  display:grid; place-items:center;
  box-shadow: 0 2px 10px rgba(15,23,42,.12), 0 0 0 1px rgba(15,23,42,.04);
  color: #94a3b8;
  font-size: 14px;
  transition: left .12s ease, box-shadow .15s, transform .15s;
  z-index: 2;
}
.tc-slider-handle:hover { box-shadow: 0 4px 14px rgba(15,23,42,.15); transform: scale(1.02); }
.tc-slider-handle.dragging { cursor: grabbing; transition: none; }

.tc-slider.solved .tc-slider-handle {
  left: calc(100% - 51px);
  background: #fff;
  color: #059669;
}
.tc-slider.solved .tc-slider-track { color: transparent; }
[data-theme="dark"] .tc-slider-handle,
.dark .tc-slider-handle { background:#1e3a5f; color:#94a3b8; }

.tc-modal-foot {
  display:flex; align-items:center; justify-content:space-between;
  margin-top: 14px; font-size: 11.5px; color:#94a3b8;
}
.tc-modal-foot a { color:#059669; text-decoration:none; }
.tc-modal-foot a:hover { text-decoration:underline; }
.tc-modal-brand { display:inline-flex; align-items:center; gap:5px; font-weight:500; }

/* Accessibility */
.tc-badge[aria-busy="true"] .tc-shield { animation: tc-pulse 1.4s ease-in-out infinite; }
.tc-slider:focus-visible { outline: 2px solid #10b981; outline-offset: 2px; }