/*
 * Sign-up sheet, gated buttons and the soft prompt (Part B).
 * Injected on every page by performance.php. Item pages set
 * `* { font-family: Lora !important }`, so every rule is anchored on an id or
 * a tj- class and font rules are !important.
 */

/* ── Gated price / photos ─────────────────────────────────────────────── */
.tj-price-lock {
  display: inline-flex !important; align-items: center !important; gap: .4em !important;
  padding: .35em .85em !important; border-radius: 999px !important;
  border: 1px solid #18181b !important; background: #fff !important; color: #18181b !important;
  font: 600 .8em/1.2 "Poppins","Segoe UI",system-ui,sans-serif !important; letter-spacing: .01em !important;
  cursor: pointer !important; white-space: nowrap !important; vertical-align: middle !important;
  transition: background .2s, color .2s !important;
}
.tj-price-lock:hover { background: #18181b !important; color: #fff !important; }
.tj-price-lock svg { width: 1em !important; height: 1em !important; fill: currentColor !important; flex: 0 0 auto !important; }
.tj-photo-lock {
  display: flex !important; align-items: center !important; justify-content: center !important;
  background: #18181b !important; color: #fff !important; cursor: pointer !important; padding: 8px !important;
  text-align: center !important;
}
.tj-photo-lock span { font: 500 .72rem/1.35 "Poppins","Segoe UI",system-ui,sans-serif !important; opacity: .9; }
.tj-photo-lock b { display: block !important; font: 700 1.05rem/1.2 "Poppins","Segoe UI",system-ui,sans-serif !important; margin-bottom: 2px !important; }

/* ── Sheet ────────────────────────────────────────────────────────────── */
#tj-sheet-wrap {
  position: fixed !important; inset: 0 !important; z-index: 2147483000 !important;
  display: flex !important; align-items: flex-end !important; justify-content: center !important;
  background: rgba(10,10,12,.55) !important; opacity: 0; transition: opacity .2s ease;
}
#tj-sheet-wrap.on { opacity: 1; }
#tj-sheet-wrap, #tj-sheet-wrap * {
  font-family: "Poppins","Segoe UI",system-ui,-apple-system,sans-serif !important; box-sizing: border-box !important;
}
#tj-sheet {
  width: 100% !important; max-width: 440px !important; max-height: 92vh !important; overflow-y: auto !important;
  background: #fff !important; color: #18181b !important; border-radius: 18px 18px 0 0 !important;
  padding: 22px 20px calc(20px + env(safe-area-inset-bottom)) !important;
  box-shadow: 0 -12px 40px rgba(0,0,0,.25) !important; transform: translateY(24px); transition: transform .25s cubic-bezier(.16,1,.3,1);
}
#tj-sheet-wrap.on #tj-sheet { transform: none; }
@media (min-width: 640px) {
  #tj-sheet-wrap { align-items: center !important; padding: 16px !important; }
  #tj-sheet { border-radius: 18px !important; }
}
#tj-sheet .tjs-x {
  float: right !important; width: 34px !important; height: 34px !important; border-radius: 50% !important;
  border: 0 !important; background: #f4f4f5 !important; color: #3f3f46 !important; font-size: 20px !important;
  line-height: 34px !important; cursor: pointer !important; margin: -6px -4px 0 8px !important;
}
#tj-sheet h2 { margin: 0 0 4px !important; font-size: 1.25rem !important; font-weight: 700 !important; letter-spacing: -.02em !important; line-height: 1.25 !important; color: #18181b !important; }
#tj-sheet .tjs-sub { margin: 0 0 18px !important; font-size: .9rem !important; color: #52525b !important; line-height: 1.45 !important; }
#tj-sheet .tjs-gbtn { min-height: 44px !important; display: flex !important; justify-content: center !important; margin-bottom: 4px !important; }
#tj-sheet .tjs-or { display: flex !important; align-items: center !important; gap: 10px !important; margin: 14px 0 !important; color: #a1a1aa !important; font-size: .8rem !important; }
#tj-sheet .tjs-or::before, #tj-sheet .tjs-or::after { content: "" !important; flex: 1 !important; height: 1px !important; background: #e4e4e7 !important; }
#tj-sheet label.tjs-f { display: block !important; margin: 0 0 10px !important; font-size: .8rem !important; font-weight: 500 !important; color: #3f3f46 !important; }
#tj-sheet label.tjs-f input {
  display: block !important; width: 100% !important; margin-top: 4px !important; padding: 11px 12px !important;
  border: 1px solid #d4d4d8 !important; border-radius: 10px !important; font-size: 1rem !important; color: #18181b !important; background: #fff !important;
}
#tj-sheet label.tjs-f input:focus { outline: none !important; border-color: #18181b !important; box-shadow: 0 0 0 3px rgba(24,24,27,.08) !important; }
#tj-sheet .tjs-c { display: flex !important; gap: 10px !important; align-items: flex-start !important; margin: 0 0 10px !important; font-size: .82rem !important; line-height: 1.45 !important; color: #3f3f46 !important; cursor: pointer !important; }
#tj-sheet .tjs-c input { width: 18px !important; height: 18px !important; margin: 1px 0 0 !important; flex: 0 0 auto !important; accent-color: #18181b; }
#tj-sheet .tjs-c a { color: #18181b !important; text-decoration: underline !important; }
#tj-sheet .tjs-c.req-miss { color: #b91c1c !important; }
#tj-sheet .tjs-go {
  display: block !important; width: 100% !important; padding: 13px !important; margin-top: 6px !important; border: 0 !important; border-radius: 10px !important;
  background: #18181b !important; color: #fff !important; font-size: 1rem !important; font-weight: 600 !important; cursor: pointer !important;
}
#tj-sheet .tjs-go[disabled] { opacity: .55 !important; cursor: default !important; }
#tj-sheet .tjs-err { display: none; margin: 8px 0 0 !important; padding: 9px 12px !important; border-radius: 9px !important; background: #fef2f2 !important; color: #b91c1c !important; font-size: .85rem !important; }
#tj-sheet .tjs-err.on { display: block !important; }
#tj-sheet .tjs-foot { margin: 14px 0 0 !important; text-align: center !important; font-size: .85rem !important; color: #52525b !important; }
#tj-sheet .tjs-foot a, #tj-sheet .tjs-later { color: #18181b !important; font-weight: 600 !important; text-decoration: underline !important; background: none !important; border: 0 !important; cursor: pointer !important; font-size: .85rem !important; }

/* ── Soft prompt (after 3 listings) ───────────────────────────────────── */
#tj-nudge {
  position: fixed !important; left: 12px !important; right: 12px !important; bottom: 92px !important; z-index: 2147482000 !important;
  max-width: 420px !important; margin: 0 auto !important; padding: 14px 14px 14px 16px !important;
  display: flex !important; gap: 12px !important; align-items: center !important;
  background: #18181b !important; color: #fff !important; border-radius: 14px !important; box-shadow: 0 12px 32px rgba(0,0,0,.28) !important;
  transform: translateY(20px); opacity: 0; transition: transform .3s cubic-bezier(.16,1,.3,1), opacity .3s;
}
#tj-nudge.on { transform: none; opacity: 1; }
@media (min-width: 1024px) { #tj-nudge { bottom: 24px !important; left: 24px !important; right: auto !important; } }
#tj-nudge, #tj-nudge * { font-family: "Poppins","Segoe UI",system-ui,sans-serif !important; box-sizing: border-box !important; }
#tj-nudge p { margin: 0 !important; flex: 1 !important; font-size: .88rem !important; line-height: 1.4 !important; color: #fff !important; }
#tj-nudge .tjn-yes { border: 0 !important; border-radius: 9px !important; padding: 9px 12px !important; background: #D4AF37 !important; color: #18181b !important; font-weight: 700 !important; font-size: .82rem !important; cursor: pointer !important; white-space: nowrap !important; }
#tj-nudge .tjn-no { border: 0 !important; background: none !important; color: #a1a1aa !important; font-size: 20px !important; line-height: 1 !important; cursor: pointer !important; padding: 4px !important; }
@media (prefers-reduced-motion: reduce) { #tj-sheet, #tj-sheet-wrap, #tj-nudge { transition: none !important; } }