/* JIT Lead — কোটেশন / স্যাম্পল / কল-ব্যাক modal (jit-lead.js)। সাইটের token ব্যবহার করে, তাই light/dark/hacker তিন থিমেই মানায়। */
.jl-root { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center; padding: clamp(12px, 3vw, 28px); }
.jl-root[hidden] { display: none; }
.jl-scrim { position: absolute; inset: 0; background: rgba(15, 18, 25, .34); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .18s ease; }
.jl-modal {
  position: relative; width: min(100%, 460px); max-height: min(92svh, 760px); overflow-y: auto; overscroll-behavior: contain;
  background: var(--color-bg-primary, #fff); color: var(--color-text-primary, #1d1d1f);
  border: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 10%, transparent);
  border-radius: 22px; padding: clamp(20px, 3.4vw, 30px);
  box-shadow: 0 18px 50px rgba(15, 18, 25, .14);
  opacity: 0; transform: translateY(14px) scale(.985); transition: opacity .18s ease, transform .22s cubic-bezier(.2, .8, .2, 1);
  outline: none;
}
.jl-modal--wa { width: min(100%, 560px); }
.jl-root.is-open .jl-scrim { opacity: 1; }
.jl-root.is-open .jl-modal { opacity: 1; transform: none; }
html.jl-lock, html.jl-lock body { overflow: hidden; }

.jl-x {
  position: absolute; top: 12px; inset-inline-end: 12px; width: 38px; height: 38px; display: grid; place-items: center;
  border: 0; border-radius: 50%; background: var(--color-bg-secondary, #f5f5f7); color: var(--color-text-primary, #1d1d1f); cursor: pointer;
}
.jl-x svg { width: 20px; height: 20px; }
.jl-x:hover { background: color-mix(in srgb, var(--color-text-primary, #1d1d1f) 12%, transparent); }
.jl-title { margin: 0 46px 8px 0; font-size: clamp(1.25rem, 2.6vw, 1.5rem); line-height: 1.3; font-weight: 800; letter-spacing: -.01em; }
.jl-sub { margin: 0 0 16px; font-size: .95rem; line-height: 1.65; color: var(--color-text-secondary, #6b7280); }

.jl-form { display: grid; gap: 12px; }
.jl-field { display: grid; gap: 6px; font-size: .86rem; font-weight: 600; color: var(--color-text-primary, #1d1d1f); }
.jl-field input, .jl-field textarea {
  width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; font-weight: 500; line-height: 1.4;
  padding: 12px 14px; border-radius: 12px; color: var(--color-text-primary, #1d1d1f); background: var(--color-bg-secondary, #f5f5f7);
  border: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 12%, transparent); outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.jl-field textarea { resize: vertical; min-height: 76px; }
.jl-field input:focus, .jl-field textarea:focus { border-color: var(--color-accent, #007aff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-accent, #007aff) 22%, transparent); }
.jl-err { font-style: normal; font-size: .82rem; font-weight: 600; color: var(--color-destructive, #ff3b30); }
.jl-err[hidden] { display: none; }
.jl-hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.jl-submit { width: 100%; justify-content: center; padding: .95em 1.5em; font-size: 1rem; margin-top: 2px; }
.jl-submit[disabled] { opacity: .65; cursor: progress; }

.jl-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 16px 0 0; padding-top: 14px; font-size: .9rem;
  border-top: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 9%, transparent); color: var(--color-text-secondary, #6b7280); }
.jl-alt a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--color-accent, #007aff); text-decoration: none; white-space: nowrap; }
.jl-alt a svg { width: 18px; height: 18px; flex: 0 0 auto; }
.jl-alt a:hover { text-decoration: underline; }

/* ডেস্কটপ WhatsApp: QR + WhatsApp Web + নম্বর */
.jl-wa { display: grid; grid-template-columns: auto 1fr; gap: clamp(16px, 3vw, 26px); align-items: center; margin: 10px 0 4px; }
.jl-qr { text-align: center; }
.jl-qr img { display: block; width: 168px; height: 168px; border-radius: 14px; background: #fff; padding: 6px; border: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 10%, transparent); }
.jl-qr p { margin: 8px 0 0; max-width: 180px; font-size: .78rem; line-height: 1.5; color: var(--color-text-secondary, #6b7280); }
.jl-wa__side { display: grid; gap: 10px; }
.jl-wide { width: 100%; justify-content: center; box-sizing: border-box; }
.jl-wide svg, .jl-actions .btn svg { width: 18px; height: 18px; flex: 0 0 auto; }
.jl-num { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 1.05rem; font-weight: 800; color: var(--color-text-primary, #1d1d1f); text-decoration: none; padding: 4px 0; }
.jl-num svg { width: 18px; height: 18px; color: var(--color-accent, #007aff); }
.jl-split { margin: 18px 0 12px; padding-top: 16px; font-size: .92rem; font-weight: 700; line-height: 1.5;
  border-top: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 9%, transparent); }
.jl-form--compact { grid-template-columns: 1fr 1fr; }
.jl-form--compact .jl-submit { grid-column: 1 / -1; }

.jl-done { text-align: center; padding: 8px 0 2px; }
.jl-done .jl-title { margin: 0 0 8px; }
.jl-done__ic { width: 54px; height: 54px; margin: 2px auto 14px; display: grid; place-items: center; border-radius: 50%;
  color: var(--color-success, #34c759); background: color-mix(in srgb, var(--color-success, #34c759) 15%, transparent); }
.jl-done__ic svg { width: 26px; height: 26px; }
.jl-ref { margin: 0 0 16px; font-size: .95rem; color: var(--color-text-secondary, #6b7280); }
.jl-ref strong { color: var(--color-text-primary, #1d1d1f); letter-spacing: .02em; }
.jl-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

@media (max-width: 640px) {
  .jl-root { place-items: end center; padding: 0; }
  .jl-modal, .jl-modal--wa { width: 100%; max-height: 92svh; border-radius: 22px 22px 0 0; border-bottom: 0; padding: 22px 18px calc(18px + env(safe-area-inset-bottom)); transform: translateY(28px); }
  .jl-wa { grid-template-columns: 1fr; justify-items: center; }
  .jl-form--compact { grid-template-columns: 1fr; }
  .jl-actions .btn { flex: 1 1 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .jl-scrim, .jl-modal { transition: none; } }

/* পেজের ভেতরের inline ফর্ম (data-jit-lead-inline) */
.jl-inline { position: relative; max-width: 560px; margin-inline: auto; padding: clamp(18px, 3vw, 28px); border-radius: 20px;
  background: var(--color-bg-primary, #fff); color: var(--color-text-primary, #1d1d1f);
  border: 1px solid color-mix(in srgb, var(--color-text-primary, #1d1d1f) 10%, transparent); box-shadow: 0 10px 34px rgba(15, 18, 25, .07); }
.jl-inline .jl-title { margin-right: 0; }
