Initial skills documentation — 25 categories, all SKILL.md + references + scripts

2026-07-15 17:42:20 -04:00
commit 1b4fcd4427
976 changed files with 188344 additions and 0 deletions
@@ -0,0 +1,87 @@
+# DRE Portal Mockups — Session July 7, 2026
+
+## Debt Recovery Intake Form (ScrapingAnt-inspired split-screen)
+
+File: `debt-recovery.html`
+
+Two-panel layout inspired by scrapingant.com/signup:
+
+**Left panel (desktop only):**
+- Dark gradient background: `linear-gradient(135deg, #0f172a 0%, #1e3a5f 40%, #b45309 100%)`
+- Logo + tagline: "Recover what's yours. Without the headache."
+- Feature icons with descriptions (AI analysis, tiered recovery, security)
+- Footer note: "Trusted by contractors and owner-operators across Texas"
+- Abstract SVG circle pattern overlay at 10% opacity
+
+**Right panel (white, amber accent #amber-500 / #f59e0b):**
+- Form sections in order: Your Information → Debtor Information → Claim Details → Document Upload → Terms → Turnstile → Submit
+- Your Information: Full name, Business name, Email, Phone
+- Debtor Information: Business name, Contact person, Email, Phone, Address
+- Claim Details: Amount, Description, State (default Texas), Debt type dropdown
+- Document upload: empty drop zone (no placeholder files), files appear after upload
+- Cloudflare Turnstile invisible anti-bot (script from challenges.cloudflare.com, site key 0x4AAAAAADxaB0Bik1bqx_CA)
+- Terms checkboxes: agree to TOS + confirm accuracy
+- Responsive: collapses to single column on mobile, logo shifts inline
+
+**Color palette:** Deep navy left gradient, white right panel, amber accent throughout.
+
+## AI Chatbot — Lead Capture + Logged-In Experience
+
+File: `dre-client-dashboard.html`
+
+The chat widget (bottom-right amber bubble, fixed position) has three states:
+
+### State 1: New Visitor (Lead Capture)
+- 4-field form: Full name (req), Company, Email (req), Phone
+- "Start Chat" button validates name + email required
+- Data stored in window._lead object (in production: sends to CRM/email)
+- Chat unlock blocked until lead submitted
+
+### State 2: Logged-In Client
+- Skips lead capture entirely
+- Personalized greeting: "Welcome back, {Company}! Your claim against {Debtor} is in {Tier N}. I'm Agent D.R.E."
+- Case-specific quick buttons: My Case Status, Next Steps, Upload Docs
+- Flagged by `window._isLoggedIn = true` (set by backend on auth)
+
+### State 3: Chat Conversation
+- Shows after lead capture (new visitor) or immediately (logged in)
+- FAQ quick-buttons: Fee structure, Required docs, Timeline
+- Free-text input with Send button
+- Case-specific answers for logged-in users (tier, status, timeline, upload docs)
+- PII verification: asking for claim number triggers "please verify your identity" response
+- Footer: "Responses from public DRE information. Not legal advice."
+
+### Answer routing logic (mockup getAnswer function):
+1. Case-specific keywords first (tier, status, next steps, upload): returns personalized answer with claim context
+2. Claim number / specific / case details: triggers PII verification
+3. General FAQ (fee, cost, timeline, LPOA, payment): returns public knowledge answer with engaging question
+4. Greeting: returns proactive engagement question
+5. Fallback: invites to submit claim or learn more
+
+All responses should: acknowledge the user's concern, answer clearly (no promises), and ask a leading question to continue the conversation.
+
+## Fee Calculator (dre-fee-calculator.html)
+
+- Single input field for claim amount (default $15,000)
+- Four side-by-side cards (Tier 1-4) with color-coded borders (green/blue/amber/red)
+- Each card shows: tier name, you receive (bold amount), DRE fee, timeline
+- Live calculation on input change — no submit button
+- Responsive: 4-col desktop, stacked mobile
+
+## Debtor Payment Page (dre-pay.html)
+
+- Minimal, no navigation, centered on payment
+- Fields: Claim/Invoice Number, Full Name, Amount ($)
+- Cloudflare Turnstile protection
+- Continue to Payment button → Stripe checkout
+- Trust signals: Secure Payment · ACH & Card Accepted · Receipt Emailed
+- Phone support link for help
+
+## Case Aging Dashboard (dre-case-aging.html)
+
+Dark-themed internal dashboard monitoring stalled cases:
+- Summary: active cases, avg time in tier, on-track rate
+- Table: claim, debtor, amount, current tier, age in tier, target, status
+- Color-coded: green (on track), amber/⚠ (approaching limit), red/🔴 (stalled)
+- Stalled case alert banner: "DRE-YYYY-NNNN has been in Tier N for X days — Y days past target"
+- SMS notification indicator: "SMS Notifications Active — Twilio Connected"