Your Smile Partners PLLC \u2014 Teledentistry Symptom Assessment Form<\/title> <meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" \/> <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" crossorigin> <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin> <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&display=swap\" rel=\"stylesheet\"> <style> :root{ --bg: #f6faff; --card: #ffffff; --ink: #18223b; --muted: #5c6e8d; --line: #e4ecfb; --accent-1: #4c8fff; --accent-2: #2bd0d6; --accent-3: #6d7cff; --ok: #12a66a; --warn: #f59f00; --field-bg: #ffffff; --field-border: #d6e2fb; --shadow-1: 0 10px 30px rgba(35, 66, 153, 0.10); --r: 16px; --r-sm: 12px; } *,*::before,*::after{ box-sizing:border-box; } html,body{ margin:0; padding:0; } body{ font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, \"Apple Color Emoji\",\"Segoe UI Emoji\"; color: var(--ink); background: radial-gradient(900px 400px at 0% -10%, rgba(76,143,255,0.12), transparent 60%), radial-gradient(900px 420px at 100% 0%, rgba(43,208,214,0.10), transparent 60%), var(--bg); line-height:1.55; } .wrap{ max-width: 1100px; margin: 24px auto; padding: 16px; } .card{ background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-1); overflow: clip; position:relative; isolation:isolate; } .edge{ position:absolute; inset:0; pointer-events:none; padding:1px; border-radius:inherit; opacity:.9; background: conic-gradient(from 180deg at 50% 50%, rgba(76,143,255,0.0), rgba(76,143,255,0.25), rgba(43,208,214,0.25), rgba(109,124,255,0.25), rgba(76,143,255,0.0)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: spin 12s linear infinite; } @keyframes spin{ to{ transform: rotate(360deg); } }\r\nheader.app{\r\n display:grid; gap:14px; align-items:center;\r\n grid-template-columns: auto 1fr;\r\n padding: 20px 20px 10px 20px;\r\n background: linear-gradient(180deg, rgba(76,143,255,.08), rgba(43,208,214,.04));\r\n border-bottom: 1px solid var(--line);\r\n}\r\n.logo{\r\n width:56px;height:56px;border-radius:14px;display:grid;place-items:center;\r\n background: linear-gradient(145deg, rgba(76,143,255,.18), rgba(43,208,214,.14));\r\n border:1px solid #cfe2ff;\r\n}\r\n.logo svg{ width:30px;height:30px }\r\n.title{ margin:0; font-size: clamp(1.15rem, 2.6vw, 1.7rem); line-height:1.25; font-weight:900; letter-spacing:.2px; }\r\n.meta{ grid-column: 1 \/ -1; display:flex; flex-wrap:wrap; gap:10px; padding-bottom:10px; color: var(--muted); font-size:.96rem; }\r\n.pill{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#f1f6ff; border:1px solid var(--line); }\r\n.toolbar{\r\n display:flex; flex-wrap:wrap; gap:10px; padding: 12px 20px; border-bottom: 1px dashed var(--line);\r\n background: linear-gradient(180deg, #ffffff, #f8fbff);\r\n}\r\n.btn{\r\n appearance:none; -webkit-tap-highlight-color: transparent; user-select:none;\r\n border:1px solid #cfe0ff; background: linear-gradient(135deg, #f7fbff, #eef6ff);\r\n color: var(--ink); font-weight:700; letter-spacing:.2px; font-size:.95rem;\r\n padding:10px 14px; border-radius: 12px; cursor:pointer;\r\n transition: transform .15s ease, box-shadow .15s ease, border-color .2s ease, background .2s ease;\r\n box-shadow: 0 6px 16px rgba(76,143,255,.12);\r\n}\r\n.btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 24px rgba(76,143,255,.18); }\r\n.btn:active{ transform: translateY(0); }\r\n.btn.primary{ border-color: #8dc2ff; background: linear-gradient(135deg, #e5f1ff, #e6fffb); }\r\n.btn.ok{ border-color:#a6efd6; background: linear-gradient(135deg, #eafff6, #efffff); }\r\n.btn.warn{ border-color:#ffd98a; background: linear-gradient(135deg, #fff7ea, #fffdf3); }\r\n.btn[disabled]{ opacity:.55; cursor:not-allowed; transform:none !important; box-shadow:none !important; }\r\n.flow{\r\n display:flex; gap:8px; flex-wrap:wrap; align-items:center;\r\n padding: 10px; border-radius: 12px; background:#f1f6ff; border:1px solid var(--line);\r\n font-size:.92rem; color:#1e315c;\r\n}\r\n.step{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#fff; border:1px solid #dbe7ff; }\r\n.step.done{ background:#e9fff7; border-color:#bdf1df; }\r\n.dot{ width:8px;height:8px;border-radius:50%; background:#c9d9ff; }\r\n.step.done .dot{ background:#12a66a; }\r\nform#symptom-form{ padding: 20px; }\r\n.section{\r\n border: 1px solid var(--line);\r\n border-radius: var(--r-sm);\r\n background: linear-gradient(180deg, #ffffff, #f9fbff);\r\n padding: 16px; margin: 16px 0;\r\n}\r\n.section h3{\r\n margin:0 0 8px 0; font-size: 1.05rem; letter-spacing:.2px; color: #1b2b55;\r\n display:flex; align-items:center; gap:10px;\r\n}\r\n.section p{ margin: 8px 0; color: var(--muted); }\r\n.grid{ display:grid; gap:12px; }\r\n@media(min-width: 780px){\r\n .grid.cols-2{ grid-template-columns: 1fr 1fr; }\r\n .grid.cols-3{ grid-template-columns: repeat(3, 1fr); }\r\n .grid.cols-4{ grid-template-columns: repeat(4, 1fr); }\r\n}\r\nlabel{ font-weight:600; font-size:.93rem; color:#1e315c; }\r\n.field{\r\n margin-top:6px; display:flex; align-items:center; gap:10px;\r\n background: var(--field-bg); border:1px solid var(--field-border); border-radius: 12px; padding: 10px 12px;\r\n transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;\r\n}\r\n.field:focus-within{\r\n border-color:#9bc6ff; box-shadow: 0 0 0 4px rgba(76,143,255,.12);\r\n background:#ffffff;\r\n}\r\ninput[type=\"text\"], input[type=\"email\"], input[type=\"tel\"], input[type=\"date\"], input[type=\"time\"], input[type=\"number\"], textarea, select{\r\n width:100%; border:none; outline:none; background: transparent; color: var(--ink); font: inherit; font-size: .98rem;\r\n}\r\ntextarea{ resize: vertical; min-height: 92px; }\r\n.options{ display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:8px; }\r\n.opt{ display:inline-flex; align-items:center; gap:8px; color: var(--ink); }\r\n.opt input{ transform: translateY(1px); }\r\n.range-wrap{ display:flex; align-items:center; gap:10px; margin-top:10px; }\r\n.range-wrap output{ min-width: 2ch; text-align:center; font-weight:700; color:#1b2b55; }\r\n.sig-pad{\r\n background: repeating-linear-gradient(0deg, #ffffff, #ffffff 28px, #f2f6ff 28px, #f2f6ff 29px);\r\n border: 1px dashed #c5d6fb; border-radius: 12px; padding: 10px;\r\n}\r\n.sig-tools{ display:flex; gap:10px; margin-top:8px; }\r\n.sig-tools .btn{ font-size:.88rem; padding:8px 10px; }\r\ncanvas.signature{\r\n width: 100%; height: 160px; display:block; background:#fff; border-radius: 10px; border:1px solid #e6eeff;\r\n touch-action: none;\r\n}\r\n.footer{\r\n display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px;\r\n padding: 12px 20px 20px 20px;\r\n border-top: 1px solid var(--line);\r\n background: linear-gradient(180deg, #f9fbff, #ffffff);\r\n}\r\n.note{ color: var(--muted); font-size:.94rem; }\r\n.toast{\r\n position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%) translateY(20px);\r\n background: #0f1b3a; color: #f4f8ff; border: 1px solid #2c4bff22;\r\n padding: 10px 14px; border-radius: 12px; box-shadow: var(--shadow-1);\r\n opacity: 0; transition: opacity .25s ease, transform .25s ease; pointer-events: none; z-index: 9999;\r\n font-size:.95rem;\r\n}\r\n.toast.show{ opacity: 1; transform: translateX(-50%) translateY(0); }\r\n@media print{\r\n .toolbar, .footer, .edge, .toast{ display:none !important; }\r\n body{ background:#fff; }\r\n .card{ box-shadow:none; border:none; }\r\n .section{ page-break-inside: avoid; }\r\n}\r\n<\/style> <\/head> <body> <main class=\"wrap\" role=\"main\"> <section class=\"card\" id=\"form-card\" aria-labelledby=\"title\"> <div class=\"edge\" aria-hidden=\"true\"><\/div>\r\n <header class=\"app\">\r\n <div class=\"logo\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" aria-hidden=\"true\">\r\n <defs>\r\n <linearGradient id=\"g\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"1\">\r\n <stop stop-color=\"#4C8FFF\"\/><stop offset=\"1\" stop-color=\"#2BD0D6\"\/>\r\n <\/linearGradient>\r\n <\/defs>\r\n <path d=\"M32 4l20 8v14c0 14-9.6 26.8-20 30C21.6 52.8 12 40 12 26V12l20-8z\" stroke=\"url(#g)\" stroke-width=\"2.2\" fill=\"#eaf3ff\"\/>\r\n <path d=\"M22 31.5l7 7L44 24\" stroke=\"#4C8FFF\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n <\/svg>\r\n <\/div>\r\n <h1 class=\"title\" id=\"title\">Teledentistry Symptom Assessment Form<\/h1>\r\n <div class=\"meta\">\r\n <span class=\"pill\"><strong>Your Smile Partners PLLC<\/strong><\/span>\r\n <span class=\"pill\">99 Wall St, New York, NY 10005<\/span>\r\n <span class=\"pill\">Email: <a href=\"mailto:talk@yoursmilepartners.com\">talk@yoursmilepartners.com<\/a><\/span>\r\n <span class=\"pill\">Phone: (212) 555\u2011SMILE<\/span>\r\n <\/div>\r\n <\/header>\r\n <div class=\"toolbar\" role=\"toolbar\" aria-label=\"Form actions\">\r\n <div class=\"flow\" aria-label=\"Progress\">\r\n <span class=\"step\" id=\"st1\"><span class=\"dot\"><\/span> Step 1: Print\/Preview<\/span>\r\n <span class=\"step\" id=\"st2\"><span class=\"dot\"><\/span> Step 2: Save PDF<\/span>\r\n <span class=\"step\" id=\"st3\"><span class=\"dot\"><\/span> Step 3: Submit & Upload<\/span>\r\n <\/div>\r\n <div style=\"flex:1\"><\/div>\r\n <button type=\"button\" class=\"btn\" id=\"btnPrint\">Print \/ Preview<\/button>\r\n <button type=\"button\" class=\"btn primary\" id=\"btnSave\" disabled>Save PDF to Device<\/button>\r\n <button type=\"button\" class=\"btn ok\" id=\"btnSubmit\" disabled>Submit & Upload to Dropbox<\/button>\r\n <button type=\"button\" class=\"btn warn\" id=\"btnClear\">Clear All Fields<\/button>\r\n <\/div>\r\n <form id=\"symptom-form\" novalidate>\r\n <div class=\"section\">\r\n <p>Please complete this form to help us understand your current oral symptoms. Answer all questions as accurately as possible.<\/p>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>1. Patient Information<\/h3>\r\n <div class=\"grid cols-3\">\r\n <div style=\"grid-column: span 2;\">\r\n <label for=\"fullName\">Full Name<\/label>\r\n <div class=\"field\"><input id=\"fullName\" name=\"fullName\" type=\"text\" required placeholder=\"First and last name\" \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"dob\">Date of Birth<\/label>\r\n <div class=\"field\"><input id=\"dob\" name=\"dob\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"apptDate\">Appointment Date<\/label>\r\n <div class=\"field\"><input id=\"apptDate\" name=\"apptDate\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"apptTime\">Appointment Time<\/label>\r\n <div class=\"field\"><input id=\"apptTime\" name=\"apptTime\" type=\"time\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label>Preferred Contact Method<\/label>\r\n <div class=\"options\" role=\"radiogroup\" aria-label=\"Preferred Contact Method\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"Phone\" required \/> Phone<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"Email\" \/> Email<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"SMS\" \/> SMS<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>2. Chief Complaint & Onset<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"chief\">Describe your primary symptom or concern<\/label>\r\n <div class=\"field\"><textarea id=\"chief\" name=\"chief\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"onset\">When did you first notice this symptom?<\/label>\r\n <div class=\"field\"><input id=\"onset\" name=\"onset\" type=\"text\" placeholder=\"Approximate date or timeframe\" \/><\/div>\r\n <\/div>\r\n <\/div>\r\n <label style=\"margin-top:8px;\">Has the symptom<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Improved\" \/> Improved<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Worsened\" \/> Worsened<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Stayed the same\" \/> Stayed the same<\/label>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>3. Symptom Characteristics<\/h3>\r\n <div class=\"grid cols-3\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Location<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Upper right\" \/> Upper right<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Upper left\" \/> Upper left<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Lower right\" \/> Lower right<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Lower left\" \/> Lower left<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Generalized\" \/> Generalized<\/label>\r\n <\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Quality<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Sharp\" \/> Sharp<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Dull ache\" \/> Dull ache<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Throbbing\" \/> Throbbing<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Burning\" \/> Burning<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Tingling\" \/> Tingling<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Pressure\" \/> Pressure<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div style=\"margin-top:8px;\">\r\n <label>Intensity (0\u201310)<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"intensity\" type=\"range\" min=\"0\" max=\"10\" step=\"1\" value=\"0\" oninput=\"document.getElementById('intensityOut').value=this.value\" \/>\r\n <span>10<\/span>\r\n <output id=\"intensityOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid cols-3\" style=\"margin-top:10px;\">\r\n <div>\r\n <label>Duration per episode<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Seconds\" \/> Seconds<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Minutes\" \/> Minutes<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Hours\" \/> Hours<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Constant\" \/> Constant<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Frequency<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Rarely\" \/> Rarely<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Occasionally\" \/> Occasionally<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Frequently\" \/> Frequently<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Constant\" \/> Constant<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Timing<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Morning\" \/> Morning<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Afternoon\" \/> Afternoon<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Evening\" \/> Evening<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Night\" \/> Night<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"No pattern\" \/> No pattern<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid cols-2\" style=\"margin-top:10px;\">\r\n <div>\r\n <label>Aggravating factors<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Hot foods\/liquids\" \/> Hot foods\/liquids<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Cold foods\/liquids\" \/> Cold foods\/liquids<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Chewing\" \/> Chewing<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Biting\" \/> Biting<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Clenching\/Grinding\" \/> Clenching\/Grinding<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Alleviating factors<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Rest\" \/> Rest<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Medication\" \/> Medication<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Cold compress\" \/> Cold compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Warm compress\" \/> Warm compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Avoidance of trigger\" \/> Avoidance of trigger<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>4. Associated Symptoms<\/h3>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Swelling\" \/> Swelling of gums or face<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bleeding\" \/> Bleeding from gums or mouth<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Fever\" \/> Fever or chills<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Trismus\" \/> Difficulty opening mouth (trismus)<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Dysphagia\" \/> Difficulty swallowing or speaking<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Numbness\" \/> Numbness or tingling in lips\/jaw<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bad taste\" \/> Bad taste or discharge in mouth<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Dry mouth\" \/> Dry mouth or excessive salivation<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Headache\" \/> Headache or earache<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"TMJ\" \/> Jaw clicking, popping, or locking<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bruxism\" \/> Nighttime tooth grinding (bruxism)<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Sweet sensitivity\" \/> Sensitivity to sweet foods\/beverages<\/label>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"assocDetails\">If checked, provide details (onset, duration, severity, treatments tried)<\/label>\r\n <div class=\"field\"><textarea id=\"assocDetails\" name=\"assocDetails\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>5. Home Care & Self\u2011Treatment<\/h3>\r\n <label>What have you done at home? (Check all that apply)<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"OTC pain relievers\" \/> Over\u2011the\u2011counter pain relievers<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Rx pain medication\" \/> Prescription pain medication<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Salt-water rinses\" \/> Salt\u2011water rinses<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Antiseptic mouthwash\" \/> Antiseptic mouthwash<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Cold compress\" \/> Cold compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Warm compress\" \/> Warm compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Nightguard\" \/> Occlusal guard\/nightguard<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Avoid triggers\" \/> Discontinued trigger foods\/beverages<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Other\" \/> Other<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><input id=\"homeOther\" name=\"homeOther\" type=\"text\" placeholder=\"If Other, specify\" \/><\/div>\r\n <label style=\"margin-top:10px;\">Did any provide relief?<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"Significant\" \/> Significant relief<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"Some\" \/> Some relief<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"None\" \/> No relief<\/label>\r\n <\/div>\r\n <label style=\"margin-top:10px;\">Are you currently taking any medications\/supplements for this condition?<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"takingMeds\" value=\"Yes\" \/> Yes<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"takingMeds\" value=\"No\" \/> No<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><input id=\"medList\" name=\"medList\" type=\"text\" placeholder=\"If Yes, list name \u2014 dosage \u2014 frequency\" \/><\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>6. Impact on Daily Life (0 = no impact; 5 = extreme impact)<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div>\r\n <label>Eating\/Chewing<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impEat\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impEatOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impEatOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Speaking<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSpeak\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSpeakOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSpeakOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Sleeping<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSleep\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSleepOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSleepOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Working\/School<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impWork\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impWorkOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impWorkOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Social\/Leisure Activities<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSocial\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSocialOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSocialOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>7. Medical & Dental History Related to Symptoms<\/h3>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"similarPast\" value=\"Yes\" \/> Similar symptom in the past<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"similarPast\" value=\"No\" \/> No<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><textarea id=\"pastDetails\" name=\"pastDetails\" placeholder=\"If Yes, when and how was it treated?\"><\/textarea><\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"relevantMed\">Relevant medical conditions (e.g., diabetes, autoimmune)<\/label>\r\n <div class=\"field\"><textarea id=\"relevantMed\" name=\"relevantMed\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"recentDental\">Recent dental treatments (within last 6 months)<\/label>\r\n <div class=\"field\"><textarea id=\"recentDental\" name=\"recentDental\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"allergies\">Known allergies (medications, latex, foods)<\/label>\r\n <div class=\"field\"><textarea id=\"allergies\" name=\"allergies\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>8. Symptom Priorities & Expectations<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"goal\">Main goal in addressing this symptom<\/label>\r\n <div class=\"field\"><textarea id=\"goal\" name=\"goal\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"success\">What would you consider a successful outcome?<\/label>\r\n <div class=\"field\"><textarea id=\"success\" name=\"success\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"questions\">Questions or concerns for your consultation<\/label>\r\n <div class=\"field\"><textarea id=\"questions\" name=\"questions\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>9. Acknowledgment & Signature<\/h3>\r\n <p>I affirm that the information provided is accurate and complete to the best of my knowledge. I understand this symptom assessment guides the teledentistry consultation but does not replace an in\u2011person examination if deemed necessary.<\/p>\r\n <div class=\"options\" style=\"margin:10px 0;\">\r\n <label class=\"opt\"><input type=\"checkbox\" id=\"consentAck\" required \/> I agree to the acknowledgment.<\/label>\r\n <\/div>\r\n <div class=\"grid cols-2\">\r\n <div>\r\n <label>Patient Signature<\/label>\r\n <div class=\"sig-pad\">\r\n <canvas class=\"signature\" id=\"sigPatient\" aria-label=\"Patient signature\"><\/canvas>\r\n <div class=\"sig-tools\"><button type=\"button\" class=\"btn\" data-clear=\"sigPatient\">Clear<\/button><\/div>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"sigDate\">Date<\/label>\r\n <div class=\"field\"><input id=\"sigDate\" name=\"sigDate\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <\/div>\r\n <h3 style=\"margin-top:14px;\">If signed by guardian\/representative<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div><label for=\"repName\">Name<\/label><div class=\"field\"><input id=\"repName\" name=\"repName\" type=\"text\" \/><\/div><\/div>\r\n <div><label for=\"repRel\">Relationship to Patient<\/label><div class=\"field\"><input id=\"repRel\" name=\"repRel\" type=\"text\" \/><\/div><\/div>\r\n <div>\r\n <label>Representative Signature<\/label>\r\n <div class=\"sig-pad\">\r\n <canvas class=\"signature\" id=\"sigRep\" aria-label=\"Representative signature\"><\/canvas>\r\n <div class=\"sig-tools\"><button type=\"button\" class=\"btn\" data-clear=\"sigRep\">Clear<\/button><\/div>\r\n <\/div>\r\n <\/div>\r\n <div><label for=\"repDate\">Date<\/label><div class=\"field\"><input id=\"repDate\" name=\"repDate\" type=\"date\" \/><\/div><\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"section\">\r\n <p class=\"note\"><strong>Thank you for completing the Symptom Assessment Form.<\/strong> We look forward to assisting you. For questions, contact <a href=\"mailto:talk@yoursmilepartners.com\">talk@yoursmilepartners.com<\/a>.<\/p>\r\n <\/div>\r\n <\/form>\r\n <div class=\"footer\">\r\n <div class=\"note\">Workflow: Print\/Preview your completed form \u2192 Save a PDF copy \u2192 Submit & upload to our secure Dropbox.<\/div>\r\n <div style=\"display:flex; gap:10px;\">\r\n <button type=\"button\" class=\"btn\" id=\"btnPrint2\">Print \/ Preview<\/button>\r\n <button type=\"button\" class=\"btn primary\" id=\"btnSave2\" disabled>Save PDF<\/button>\r\n <button type=\"button\" class=\"btn ok\" id=\"btnSubmit2\" disabled>Submit & Upload<\/button>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n<\/main> <div class=\"toast\" id=\"toast\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">Ready<\/div> <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/html2pdf.js@0.10.1\/dist\/html2pdf.bundle.min.js\" crossorigin=\"anonymous\"><\/script> <script> (function(){ const dropboxURL = 'https:\/\/www.dropbox.com\/request\/gdRmWuwrMys3cW8R8Xua'; const form = document.getElementById('symptom-form'); const card = document.getElementById('form-card'); const toast = document.getElementById('toast');\r\n const btnPrint = document.getElementById('btnPrint');\r\n const btnPrint2 = document.getElementById('btnPrint2');\r\n const btnSave = document.getElementById('btnSave');\r\n const btnSave2 = document.getElementById('btnSave2');\r\n const btnSubmit = document.getElementById('btnSubmit');\r\n const btnSubmit2 = document.getElementById('btnSubmit2');\r\n const btnClear = document.getElementById('btnClear');\r\n const st1 = document.getElementById('st1');\r\n const st2 = document.getElementById('st2');\r\n const st3 = document.getElementById('st3');\r\n \/\/ Signature pads\r\n const pads = {\r\n sigPatient: setupSignaturePad(document.getElementById('sigPatient')),\r\n sigRep: setupSignaturePad(document.getElementById('sigRep'))\r\n };\r\n document.querySelectorAll('[data-clear]').forEach(btn=>{\r\n btn.addEventListener('click', ()=>{\r\n const id = btn.getAttribute('data-clear');\r\n pads[id]?.clear();\r\n });\r\n });\r\n \/\/ Defaults\r\n const todayISO = (new Date()).toISOString().slice(0,10);\r\n const defaultDateIds = ['sigDate'];\r\n defaultDateIds.forEach(id => { const el = document.getElementById(id); if(el && !el.value) el.value = todayISO; });\r\n \/\/ State & helpers\r\n let hasPrinted = false;\r\n let hasSaved = false;\r\n function setSaveEnabled(on){ btnSave.disabled = !on; btnSave2.disabled = !on; }\r\n function setSubmitEnabled(on){ btnSubmit.disabled = !on; btnSubmit2.disabled = !on; }\r\n function updateSteps(){\r\n st1.classList.toggle('done', hasPrinted);\r\n st2.classList.toggle('done', hasSaved);\r\n st3.classList.toggle('done', hasSaved);\r\n setSaveEnabled(hasPrinted); \/\/ Save after print\/preview\r\n setSubmitEnabled(hasSaved); \/\/ Submit after save\r\n }\r\n updateSteps();\r\n let tmr;\r\n function showToast(msg){\r\n toast.textContent = msg;\r\n toast.classList.add('show');\r\n clearTimeout(tmr);\r\n tmr = setTimeout(()=> toast.classList.remove('show'), 1800);\r\n }\r\n \/\/ Validation\r\n function validateForm(){\r\n const requiredIds = ['fullName','dob','apptDate','apptTime','sigDate'];\r\n for(const id of requiredIds){\r\n const el = document.getElementById(id);\r\n if(!el || (el.value || '').trim() === ''){\r\n el?.scrollIntoView({behavior:'smooth', block:'center'});\r\n el?.focus?.({preventScroll:true});\r\n showToast('Please complete required fields.');\r\n return false;\r\n }\r\n }\r\n \/\/ Preferred contact method (radio) required\r\n if(!form.querySelector('input[name=\"prefContact\"]:checked')){\r\n form.querySelector('input[name=\"prefContact\"]').scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please select a preferred contact method.');\r\n return false;\r\n }\r\n \/\/ Acknowledgment\r\n const consent = document.getElementById('consentAck');\r\n if(!consent.checked){\r\n consent.scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please confirm the acknowledgment.');\r\n return false;\r\n }\r\n \/\/ Patient signature\r\n if(pads.sigPatient.isBlank()){\r\n document.getElementById('sigPatient').scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please add your signature.');\r\n return false;\r\n }\r\n return true;\r\n }\r\n \/\/ Print\/Preview\r\n function doPrint(){\r\n if(!validateForm()) return;\r\n window.print();\r\n }\r\n btnPrint.addEventListener('click', doPrint);\r\n btnPrint2.addEventListener('click', doPrint);\r\n \/\/ Detect when print preview closes\r\n function afterPrint(){\r\n hasPrinted = true;\r\n updateSteps();\r\n showToast('Print preview closed. You can now save a PDF.');\r\n }\r\n if('onafterprint' in window){\r\n window.addEventListener('afterprint', afterPrint);\r\n }else{\r\n btnPrint.addEventListener('click', ()=> setTimeout(afterPrint, 3000));\r\n btnPrint2.addEventListener('click', ()=> setTimeout(afterPrint, 3000));\r\n }\r\n \/\/ Filename for PDF\r\n function makeFileName(){\r\n const name = (document.getElementById('fullName').value || 'Patient').trim().replace(\/\\s+\/g,'_');\r\n const date = (document.getElementById('apptDate').value || todayISO);\r\n return `Symptom_Assessment_${name}_${date}.pdf`;\r\n }\r\n \/\/ Save PDF (html2pdf)\r\n async function savePDF(){\r\n if(!hasPrinted){\r\n showToast('Please print\/preview first.');\r\n return;\r\n }\r\n if(!validateForm()) return;\r\n await ensureSignatures();\r\n const opt = {\r\n margin: 0.4,\r\n filename: makeFileName(),\r\n image: { type: 'jpeg', quality: 0.98 },\r\n html2canvas: { scale: 2, useCORS: true, backgroundColor: '#ffffff' },\r\n jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' },\r\n pagebreak: { mode: ['css','legacy'] }\r\n };\r\n await html2pdf().from(card).set(opt).save();\r\n hasSaved = true;\r\n updateSteps();\r\n showToast('PDF saved to your device.');\r\n }\r\n btnSave.addEventListener('click', savePDF);\r\n btnSave2.addEventListener('click', savePDF);\r\n \/\/ Submit & Upload to Dropbox (redirect)\r\n async function submitAndUpload(){\r\n if(!hasSaved){\r\n showToast('Please save a PDF first.');\r\n return;\r\n }\r\n if(!validateForm()) return;\r\n try{\r\n const win = window.open(dropboxURL, '_blank');\r\n win?.focus();\r\n }catch(e){\r\n window.location.href = dropboxURL;\r\n }\r\n }\r\n btnSubmit.addEventListener('click', submitAndUpload);\r\n btnSubmit2.addEventListener('click', submitAndUpload);\r\n \/\/ Clear\r\n btnClear.addEventListener('click', ()=>{\r\n if(!confirm('Clear all fields and signatures?')) return;\r\n form.reset();\r\n defaultDateIds.forEach(id => { const el = document.getElementById(id); if(el) el.value = todayISO; });\r\n pads.sigPatient.clear();\r\n pads.sigRep.clear();\r\n hasPrinted = false; hasSaved = false;\r\n updateSteps();\r\n showToast('Form cleared.');\r\n });\r\n \/\/ Ensure signatures ready (canvas already holds strokes)\r\n async function ensureSignatures(){ return true; }\r\n \/\/ Signature pad\r\n function setupSignaturePad(canvas){\r\n const ctx = canvas.getContext('2d');\r\n const state = { drawing:false, blank:true, lastX:0, lastY:0 };\r\n function resize(){\r\n const ratio = Math.max(window.devicePixelRatio || 1, 1);\r\n const rect = canvas.getBoundingClientRect();\r\n canvas.width = rect.width * ratio;\r\n canvas.height = rect.height * ratio;\r\n ctx.setTransform(ratio, 0, 0, ratio, 0, 0);\r\n ctx.lineCap = 'round';\r\n ctx.lineJoin = 'round';\r\n ctx.lineWidth = 2.2;\r\n ctx.strokeStyle = '#18223b';\r\n ctx.clearRect(0,0,canvas.width,canvas.height);\r\n state.blank = true;\r\n }\r\n window.addEventListener('resize', resize, { passive:true });\r\n resize();\r\n function getPos(e){\r\n const r = canvas.getBoundingClientRect();\r\n const p = e.touches ? e.touches[0] : e;\r\n return { x: p.clientX - r.left, y: p.clientY - r.top };\r\n }\r\n function start(e){ e.preventDefault(); state.drawing=true; const p=getPos(e); state.lastX=p.x; state.lastY=p.y; }\r\n function move(e){\r\n if(!state.drawing) return;\r\n e.preventDefault();\r\n const p = getPos(e);\r\n ctx.beginPath(); ctx.moveTo(state.lastX, state.lastY); ctx.lineTo(p.x,p.y); ctx.stroke();\r\n state.lastX = p.x; state.lastY = p.y; state.blank = false;\r\n }\r\n function end(){ state.drawing=false; }\r\n canvas.addEventListener('mousedown', start);\r\n canvas.addEventListener('mousemove', move);\r\n window.addEventListener('mouseup', end);\r\n canvas.addEventListener('touchstart', start, { passive:false });\r\n canvas.addEventListener('touchmove', move, { passive:false });\r\n canvas.addEventListener('touchend', end);\r\n function clear(){ ctx.clearRect(0,0,canvas.width,canvas.height); state.blank = true; }\r\n function isBlank(){ return state.blank; }\r\n return { clear, isBlank };\r\n }\r\n})();\r\n<\/script> <\/body> <\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Your Smile Partners PLLC \u2014 Teledentistry Symptom Assessment Form Teledentistry Symptom Assessment Form Your Smile Partners PLLC 99 Wall St, New York, NY 10005 Email: talk@yoursmilepartners.com Phone: (212) 555\u2011SMILE Step 1: Print\/Preview Step 2: Save PDF Step 3: Submit & Upload Print \/ Preview Save PDF to Device Submit & Upload to Dropbox Clear All…<\/p>\n<p><a class=\"btn btn-outline-dark btn-sm anzu-read-more-link\" href=\"https:\/\/stephanie.openteledentistry.com\/?page_id=831\">Continue Reading<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"content-type":"","footnotes":""},"class_list":["post-831","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=831"}],"version-history":[{"count":4,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831\/revisions"}],"predecessor-version":[{"id":835,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831\/revisions\/835"}],"wp:attachment":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=831"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t Your Smile Partners PLLC \u2014 Teledentistry Symptom Assessment Form<\/title> <meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" \/> <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" crossorigin> <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin> <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&display=swap\" rel=\"stylesheet\"> <style> :root{ --bg: #f6faff; --card: #ffffff; --ink: #18223b; --muted: #5c6e8d; --line: #e4ecfb; --accent-1: #4c8fff; --accent-2: #2bd0d6; --accent-3: #6d7cff; --ok: #12a66a; --warn: #f59f00; --field-bg: #ffffff; --field-border: #d6e2fb; --shadow-1: 0 10px 30px rgba(35, 66, 153, 0.10); --r: 16px; --r-sm: 12px; } *,*::before,*::after{ box-sizing:border-box; } html,body{ margin:0; padding:0; } body{ font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, \"Apple Color Emoji\",\"Segoe UI Emoji\"; color: var(--ink); background: radial-gradient(900px 400px at 0% -10%, rgba(76,143,255,0.12), transparent 60%), radial-gradient(900px 420px at 100% 0%, rgba(43,208,214,0.10), transparent 60%), var(--bg); line-height:1.55; } .wrap{ max-width: 1100px; margin: 24px auto; padding: 16px; } .card{ background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-1); overflow: clip; position:relative; isolation:isolate; } .edge{ position:absolute; inset:0; pointer-events:none; padding:1px; border-radius:inherit; opacity:.9; background: conic-gradient(from 180deg at 50% 50%, rgba(76,143,255,0.0), rgba(76,143,255,0.25), rgba(43,208,214,0.25), rgba(109,124,255,0.25), rgba(76,143,255,0.0)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: spin 12s linear infinite; } @keyframes spin{ to{ transform: rotate(360deg); } }\r\nheader.app{\r\n display:grid; gap:14px; align-items:center;\r\n grid-template-columns: auto 1fr;\r\n padding: 20px 20px 10px 20px;\r\n background: linear-gradient(180deg, rgba(76,143,255,.08), rgba(43,208,214,.04));\r\n border-bottom: 1px solid var(--line);\r\n}\r\n.logo{\r\n width:56px;height:56px;border-radius:14px;display:grid;place-items:center;\r\n background: linear-gradient(145deg, rgba(76,143,255,.18), rgba(43,208,214,.14));\r\n border:1px solid #cfe2ff;\r\n}\r\n.logo svg{ width:30px;height:30px }\r\n.title{ margin:0; font-size: clamp(1.15rem, 2.6vw, 1.7rem); line-height:1.25; font-weight:900; letter-spacing:.2px; }\r\n.meta{ grid-column: 1 \/ -1; display:flex; flex-wrap:wrap; gap:10px; padding-bottom:10px; color: var(--muted); font-size:.96rem; }\r\n.pill{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#f1f6ff; border:1px solid var(--line); }\r\n.toolbar{\r\n display:flex; flex-wrap:wrap; gap:10px; padding: 12px 20px; border-bottom: 1px dashed var(--line);\r\n background: linear-gradient(180deg, #ffffff, #f8fbff);\r\n}\r\n.btn{\r\n appearance:none; -webkit-tap-highlight-color: transparent; user-select:none;\r\n border:1px solid #cfe0ff; background: linear-gradient(135deg, #f7fbff, #eef6ff);\r\n color: var(--ink); font-weight:700; letter-spacing:.2px; font-size:.95rem;\r\n padding:10px 14px; border-radius: 12px; cursor:pointer;\r\n transition: transform .15s ease, box-shadow .15s ease, border-color .2s ease, background .2s ease;\r\n box-shadow: 0 6px 16px rgba(76,143,255,.12);\r\n}\r\n.btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 24px rgba(76,143,255,.18); }\r\n.btn:active{ transform: translateY(0); }\r\n.btn.primary{ border-color: #8dc2ff; background: linear-gradient(135deg, #e5f1ff, #e6fffb); }\r\n.btn.ok{ border-color:#a6efd6; background: linear-gradient(135deg, #eafff6, #efffff); }\r\n.btn.warn{ border-color:#ffd98a; background: linear-gradient(135deg, #fff7ea, #fffdf3); }\r\n.btn[disabled]{ opacity:.55; cursor:not-allowed; transform:none !important; box-shadow:none !important; }\r\n.flow{\r\n display:flex; gap:8px; flex-wrap:wrap; align-items:center;\r\n padding: 10px; border-radius: 12px; background:#f1f6ff; border:1px solid var(--line);\r\n font-size:.92rem; color:#1e315c;\r\n}\r\n.step{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#fff; border:1px solid #dbe7ff; }\r\n.step.done{ background:#e9fff7; border-color:#bdf1df; }\r\n.dot{ width:8px;height:8px;border-radius:50%; background:#c9d9ff; }\r\n.step.done .dot{ background:#12a66a; }\r\nform#symptom-form{ padding: 20px; }\r\n.section{\r\n border: 1px solid var(--line);\r\n border-radius: var(--r-sm);\r\n background: linear-gradient(180deg, #ffffff, #f9fbff);\r\n padding: 16px; margin: 16px 0;\r\n}\r\n.section h3{\r\n margin:0 0 8px 0; font-size: 1.05rem; letter-spacing:.2px; color: #1b2b55;\r\n display:flex; align-items:center; gap:10px;\r\n}\r\n.section p{ margin: 8px 0; color: var(--muted); }\r\n.grid{ display:grid; gap:12px; }\r\n@media(min-width: 780px){\r\n .grid.cols-2{ grid-template-columns: 1fr 1fr; }\r\n .grid.cols-3{ grid-template-columns: repeat(3, 1fr); }\r\n .grid.cols-4{ grid-template-columns: repeat(4, 1fr); }\r\n}\r\nlabel{ font-weight:600; font-size:.93rem; color:#1e315c; }\r\n.field{\r\n margin-top:6px; display:flex; align-items:center; gap:10px;\r\n background: var(--field-bg); border:1px solid var(--field-border); border-radius: 12px; padding: 10px 12px;\r\n transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;\r\n}\r\n.field:focus-within{\r\n border-color:#9bc6ff; box-shadow: 0 0 0 4px rgba(76,143,255,.12);\r\n background:#ffffff;\r\n}\r\ninput[type=\"text\"], input[type=\"email\"], input[type=\"tel\"], input[type=\"date\"], input[type=\"time\"], input[type=\"number\"], textarea, select{\r\n width:100%; border:none; outline:none; background: transparent; color: var(--ink); font: inherit; font-size: .98rem;\r\n}\r\ntextarea{ resize: vertical; min-height: 92px; }\r\n.options{ display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:8px; }\r\n.opt{ display:inline-flex; align-items:center; gap:8px; color: var(--ink); }\r\n.opt input{ transform: translateY(1px); }\r\n.range-wrap{ display:flex; align-items:center; gap:10px; margin-top:10px; }\r\n.range-wrap output{ min-width: 2ch; text-align:center; font-weight:700; color:#1b2b55; }\r\n.sig-pad{\r\n background: repeating-linear-gradient(0deg, #ffffff, #ffffff 28px, #f2f6ff 28px, #f2f6ff 29px);\r\n border: 1px dashed #c5d6fb; border-radius: 12px; padding: 10px;\r\n}\r\n.sig-tools{ display:flex; gap:10px; margin-top:8px; }\r\n.sig-tools .btn{ font-size:.88rem; padding:8px 10px; }\r\ncanvas.signature{\r\n width: 100%; height: 160px; display:block; background:#fff; border-radius: 10px; border:1px solid #e6eeff;\r\n touch-action: none;\r\n}\r\n.footer{\r\n display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px;\r\n padding: 12px 20px 20px 20px;\r\n border-top: 1px solid var(--line);\r\n background: linear-gradient(180deg, #f9fbff, #ffffff);\r\n}\r\n.note{ color: var(--muted); font-size:.94rem; }\r\n.toast{\r\n position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%) translateY(20px);\r\n background: #0f1b3a; color: #f4f8ff; border: 1px solid #2c4bff22;\r\n padding: 10px 14px; border-radius: 12px; box-shadow: var(--shadow-1);\r\n opacity: 0; transition: opacity .25s ease, transform .25s ease; pointer-events: none; z-index: 9999;\r\n font-size:.95rem;\r\n}\r\n.toast.show{ opacity: 1; transform: translateX(-50%) translateY(0); }\r\n@media print{\r\n .toolbar, .footer, .edge, .toast{ display:none !important; }\r\n body{ background:#fff; }\r\n .card{ box-shadow:none; border:none; }\r\n .section{ page-break-inside: avoid; }\r\n}\r\n<\/style> <\/head> <body> <main class=\"wrap\" role=\"main\"> <section class=\"card\" id=\"form-card\" aria-labelledby=\"title\"> <div class=\"edge\" aria-hidden=\"true\"><\/div>\r\n <header class=\"app\">\r\n <div class=\"logo\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" aria-hidden=\"true\">\r\n <defs>\r\n <linearGradient id=\"g\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"1\">\r\n <stop stop-color=\"#4C8FFF\"\/><stop offset=\"1\" stop-color=\"#2BD0D6\"\/>\r\n <\/linearGradient>\r\n <\/defs>\r\n <path d=\"M32 4l20 8v14c0 14-9.6 26.8-20 30C21.6 52.8 12 40 12 26V12l20-8z\" stroke=\"url(#g)\" stroke-width=\"2.2\" fill=\"#eaf3ff\"\/>\r\n <path d=\"M22 31.5l7 7L44 24\" stroke=\"#4C8FFF\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n <\/svg>\r\n <\/div>\r\n <h1 class=\"title\" id=\"title\">Teledentistry Symptom Assessment Form<\/h1>\r\n <div class=\"meta\">\r\n <span class=\"pill\"><strong>Your Smile Partners PLLC<\/strong><\/span>\r\n <span class=\"pill\">99 Wall St, New York, NY 10005<\/span>\r\n <span class=\"pill\">Email: <a href=\"mailto:talk@yoursmilepartners.com\">talk@yoursmilepartners.com<\/a><\/span>\r\n <span class=\"pill\">Phone: (212) 555\u2011SMILE<\/span>\r\n <\/div>\r\n <\/header>\r\n <div class=\"toolbar\" role=\"toolbar\" aria-label=\"Form actions\">\r\n <div class=\"flow\" aria-label=\"Progress\">\r\n <span class=\"step\" id=\"st1\"><span class=\"dot\"><\/span> Step 1: Print\/Preview<\/span>\r\n <span class=\"step\" id=\"st2\"><span class=\"dot\"><\/span> Step 2: Save PDF<\/span>\r\n <span class=\"step\" id=\"st3\"><span class=\"dot\"><\/span> Step 3: Submit & Upload<\/span>\r\n <\/div>\r\n <div style=\"flex:1\"><\/div>\r\n <button type=\"button\" class=\"btn\" id=\"btnPrint\">Print \/ Preview<\/button>\r\n <button type=\"button\" class=\"btn primary\" id=\"btnSave\" disabled>Save PDF to Device<\/button>\r\n <button type=\"button\" class=\"btn ok\" id=\"btnSubmit\" disabled>Submit & Upload to Dropbox<\/button>\r\n <button type=\"button\" class=\"btn warn\" id=\"btnClear\">Clear All Fields<\/button>\r\n <\/div>\r\n <form id=\"symptom-form\" novalidate>\r\n <div class=\"section\">\r\n <p>Please complete this form to help us understand your current oral symptoms. Answer all questions as accurately as possible.<\/p>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>1. Patient Information<\/h3>\r\n <div class=\"grid cols-3\">\r\n <div style=\"grid-column: span 2;\">\r\n <label for=\"fullName\">Full Name<\/label>\r\n <div class=\"field\"><input id=\"fullName\" name=\"fullName\" type=\"text\" required placeholder=\"First and last name\" \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"dob\">Date of Birth<\/label>\r\n <div class=\"field\"><input id=\"dob\" name=\"dob\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"apptDate\">Appointment Date<\/label>\r\n <div class=\"field\"><input id=\"apptDate\" name=\"apptDate\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"apptTime\">Appointment Time<\/label>\r\n <div class=\"field\"><input id=\"apptTime\" name=\"apptTime\" type=\"time\" required \/><\/div>\r\n <\/div>\r\n <div>\r\n <label>Preferred Contact Method<\/label>\r\n <div class=\"options\" role=\"radiogroup\" aria-label=\"Preferred Contact Method\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"Phone\" required \/> Phone<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"Email\" \/> Email<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"prefContact\" value=\"SMS\" \/> SMS<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>2. Chief Complaint & Onset<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"chief\">Describe your primary symptom or concern<\/label>\r\n <div class=\"field\"><textarea id=\"chief\" name=\"chief\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"onset\">When did you first notice this symptom?<\/label>\r\n <div class=\"field\"><input id=\"onset\" name=\"onset\" type=\"text\" placeholder=\"Approximate date or timeframe\" \/><\/div>\r\n <\/div>\r\n <\/div>\r\n <label style=\"margin-top:8px;\">Has the symptom<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Improved\" \/> Improved<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Worsened\" \/> Worsened<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"symChange\" value=\"Stayed the same\" \/> Stayed the same<\/label>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>3. Symptom Characteristics<\/h3>\r\n <div class=\"grid cols-3\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Location<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Upper right\" \/> Upper right<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Upper left\" \/> Upper left<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Lower right\" \/> Lower right<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Lower left\" \/> Lower left<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"loc\" value=\"Generalized\" \/> Generalized<\/label>\r\n <\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Quality<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Sharp\" \/> Sharp<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Dull ache\" \/> Dull ache<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Throbbing\" \/> Throbbing<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Burning\" \/> Burning<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Tingling\" \/> Tingling<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"qual\" value=\"Pressure\" \/> Pressure<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div style=\"margin-top:8px;\">\r\n <label>Intensity (0\u201310)<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"intensity\" type=\"range\" min=\"0\" max=\"10\" step=\"1\" value=\"0\" oninput=\"document.getElementById('intensityOut').value=this.value\" \/>\r\n <span>10<\/span>\r\n <output id=\"intensityOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid cols-3\" style=\"margin-top:10px;\">\r\n <div>\r\n <label>Duration per episode<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Seconds\" \/> Seconds<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Minutes\" \/> Minutes<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Hours\" \/> Hours<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"duration\" value=\"Constant\" \/> Constant<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Frequency<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Rarely\" \/> Rarely<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Occasionally\" \/> Occasionally<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Frequently\" \/> Frequently<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"freq\" value=\"Constant\" \/> Constant<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Timing<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Morning\" \/> Morning<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Afternoon\" \/> Afternoon<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Evening\" \/> Evening<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"Night\" \/> Night<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"time\" value=\"No pattern\" \/> No pattern<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid cols-2\" style=\"margin-top:10px;\">\r\n <div>\r\n <label>Aggravating factors<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Hot foods\/liquids\" \/> Hot foods\/liquids<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Cold foods\/liquids\" \/> Cold foods\/liquids<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Chewing\" \/> Chewing<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Biting\" \/> Biting<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"agg\" value=\"Clenching\/Grinding\" \/> Clenching\/Grinding<\/label>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Alleviating factors<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Rest\" \/> Rest<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Medication\" \/> Medication<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Cold compress\" \/> Cold compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Warm compress\" \/> Warm compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"allev\" value=\"Avoidance of trigger\" \/> Avoidance of trigger<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>4. Associated Symptoms<\/h3>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Swelling\" \/> Swelling of gums or face<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bleeding\" \/> Bleeding from gums or mouth<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Fever\" \/> Fever or chills<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Trismus\" \/> Difficulty opening mouth (trismus)<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Dysphagia\" \/> Difficulty swallowing or speaking<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Numbness\" \/> Numbness or tingling in lips\/jaw<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bad taste\" \/> Bad taste or discharge in mouth<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Dry mouth\" \/> Dry mouth or excessive salivation<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Headache\" \/> Headache or earache<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"TMJ\" \/> Jaw clicking, popping, or locking<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Bruxism\" \/> Nighttime tooth grinding (bruxism)<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"assoc\" value=\"Sweet sensitivity\" \/> Sensitivity to sweet foods\/beverages<\/label>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"assocDetails\">If checked, provide details (onset, duration, severity, treatments tried)<\/label>\r\n <div class=\"field\"><textarea id=\"assocDetails\" name=\"assocDetails\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>5. Home Care & Self\u2011Treatment<\/h3>\r\n <label>What have you done at home? (Check all that apply)<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"OTC pain relievers\" \/> Over\u2011the\u2011counter pain relievers<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Rx pain medication\" \/> Prescription pain medication<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Salt-water rinses\" \/> Salt\u2011water rinses<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Antiseptic mouthwash\" \/> Antiseptic mouthwash<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Cold compress\" \/> Cold compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Warm compress\" \/> Warm compress<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Nightguard\" \/> Occlusal guard\/nightguard<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Avoid triggers\" \/> Discontinued trigger foods\/beverages<\/label>\r\n <label class=\"opt\"><input type=\"checkbox\" name=\"home\" value=\"Other\" \/> Other<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><input id=\"homeOther\" name=\"homeOther\" type=\"text\" placeholder=\"If Other, specify\" \/><\/div>\r\n <label style=\"margin-top:10px;\">Did any provide relief?<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"Significant\" \/> Significant relief<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"Some\" \/> Some relief<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"relief\" value=\"None\" \/> No relief<\/label>\r\n <\/div>\r\n <label style=\"margin-top:10px;\">Are you currently taking any medications\/supplements for this condition?<\/label>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"takingMeds\" value=\"Yes\" \/> Yes<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"takingMeds\" value=\"No\" \/> No<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><input id=\"medList\" name=\"medList\" type=\"text\" placeholder=\"If Yes, list name \u2014 dosage \u2014 frequency\" \/><\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>6. Impact on Daily Life (0 = no impact; 5 = extreme impact)<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div>\r\n <label>Eating\/Chewing<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impEat\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impEatOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impEatOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Speaking<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSpeak\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSpeakOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSpeakOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Sleeping<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSleep\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSleepOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSleepOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label>Working\/School<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impWork\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impWorkOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impWorkOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label>Social\/Leisure Activities<\/label>\r\n <div class=\"range-wrap\">\r\n <span>0<\/span>\r\n <input id=\"impSocial\" type=\"range\" min=\"0\" max=\"5\" step=\"1\" value=\"0\" oninput=\"document.getElementById('impSocialOut').value=this.value\" \/>\r\n <span>5<\/span>\r\n <output id=\"impSocialOut\">0<\/output>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>7. Medical & Dental History Related to Symptoms<\/h3>\r\n <div class=\"options\">\r\n <label class=\"opt\"><input type=\"radio\" name=\"similarPast\" value=\"Yes\" \/> Similar symptom in the past<\/label>\r\n <label class=\"opt\"><input type=\"radio\" name=\"similarPast\" value=\"No\" \/> No<\/label>\r\n <\/div>\r\n <div class=\"field\" style=\"margin-top:8px;\"><textarea id=\"pastDetails\" name=\"pastDetails\" placeholder=\"If Yes, when and how was it treated?\"><\/textarea><\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"relevantMed\">Relevant medical conditions (e.g., diabetes, autoimmune)<\/label>\r\n <div class=\"field\"><textarea id=\"relevantMed\" name=\"relevantMed\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"recentDental\">Recent dental treatments (within last 6 months)<\/label>\r\n <div class=\"field\"><textarea id=\"recentDental\" name=\"recentDental\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"margin-top:10px;\">\r\n <label for=\"allergies\">Known allergies (medications, latex, foods)<\/label>\r\n <div class=\"field\"><textarea id=\"allergies\" name=\"allergies\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>8. Symptom Priorities & Expectations<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"goal\">Main goal in addressing this symptom<\/label>\r\n <div class=\"field\"><textarea id=\"goal\" name=\"goal\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"success\">What would you consider a successful outcome?<\/label>\r\n <div class=\"field\"><textarea id=\"success\" name=\"success\"><\/textarea><\/div>\r\n <\/div>\r\n <div style=\"grid-column:1\/-1\">\r\n <label for=\"questions\">Questions or concerns for your consultation<\/label>\r\n <div class=\"field\"><textarea id=\"questions\" name=\"questions\"><\/textarea><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h3>9. Acknowledgment & Signature<\/h3>\r\n <p>I affirm that the information provided is accurate and complete to the best of my knowledge. I understand this symptom assessment guides the teledentistry consultation but does not replace an in\u2011person examination if deemed necessary.<\/p>\r\n <div class=\"options\" style=\"margin:10px 0;\">\r\n <label class=\"opt\"><input type=\"checkbox\" id=\"consentAck\" required \/> I agree to the acknowledgment.<\/label>\r\n <\/div>\r\n <div class=\"grid cols-2\">\r\n <div>\r\n <label>Patient Signature<\/label>\r\n <div class=\"sig-pad\">\r\n <canvas class=\"signature\" id=\"sigPatient\" aria-label=\"Patient signature\"><\/canvas>\r\n <div class=\"sig-tools\"><button type=\"button\" class=\"btn\" data-clear=\"sigPatient\">Clear<\/button><\/div>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label for=\"sigDate\">Date<\/label>\r\n <div class=\"field\"><input id=\"sigDate\" name=\"sigDate\" type=\"date\" required \/><\/div>\r\n <\/div>\r\n <\/div>\r\n <h3 style=\"margin-top:14px;\">If signed by guardian\/representative<\/h3>\r\n <div class=\"grid cols-2\">\r\n <div><label for=\"repName\">Name<\/label><div class=\"field\"><input id=\"repName\" name=\"repName\" type=\"text\" \/><\/div><\/div>\r\n <div><label for=\"repRel\">Relationship to Patient<\/label><div class=\"field\"><input id=\"repRel\" name=\"repRel\" type=\"text\" \/><\/div><\/div>\r\n <div>\r\n <label>Representative Signature<\/label>\r\n <div class=\"sig-pad\">\r\n <canvas class=\"signature\" id=\"sigRep\" aria-label=\"Representative signature\"><\/canvas>\r\n <div class=\"sig-tools\"><button type=\"button\" class=\"btn\" data-clear=\"sigRep\">Clear<\/button><\/div>\r\n <\/div>\r\n <\/div>\r\n <div><label for=\"repDate\">Date<\/label><div class=\"field\"><input id=\"repDate\" name=\"repDate\" type=\"date\" \/><\/div><\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"section\">\r\n <p class=\"note\"><strong>Thank you for completing the Symptom Assessment Form.<\/strong> We look forward to assisting you. For questions, contact <a href=\"mailto:talk@yoursmilepartners.com\">talk@yoursmilepartners.com<\/a>.<\/p>\r\n <\/div>\r\n <\/form>\r\n <div class=\"footer\">\r\n <div class=\"note\">Workflow: Print\/Preview your completed form \u2192 Save a PDF copy \u2192 Submit & upload to our secure Dropbox.<\/div>\r\n <div style=\"display:flex; gap:10px;\">\r\n <button type=\"button\" class=\"btn\" id=\"btnPrint2\">Print \/ Preview<\/button>\r\n <button type=\"button\" class=\"btn primary\" id=\"btnSave2\" disabled>Save PDF<\/button>\r\n <button type=\"button\" class=\"btn ok\" id=\"btnSubmit2\" disabled>Submit & Upload<\/button>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n<\/main> <div class=\"toast\" id=\"toast\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">Ready<\/div> <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/html2pdf.js@0.10.1\/dist\/html2pdf.bundle.min.js\" crossorigin=\"anonymous\"><\/script> <script> (function(){ const dropboxURL = 'https:\/\/www.dropbox.com\/request\/gdRmWuwrMys3cW8R8Xua'; const form = document.getElementById('symptom-form'); const card = document.getElementById('form-card'); const toast = document.getElementById('toast');\r\n const btnPrint = document.getElementById('btnPrint');\r\n const btnPrint2 = document.getElementById('btnPrint2');\r\n const btnSave = document.getElementById('btnSave');\r\n const btnSave2 = document.getElementById('btnSave2');\r\n const btnSubmit = document.getElementById('btnSubmit');\r\n const btnSubmit2 = document.getElementById('btnSubmit2');\r\n const btnClear = document.getElementById('btnClear');\r\n const st1 = document.getElementById('st1');\r\n const st2 = document.getElementById('st2');\r\n const st3 = document.getElementById('st3');\r\n \/\/ Signature pads\r\n const pads = {\r\n sigPatient: setupSignaturePad(document.getElementById('sigPatient')),\r\n sigRep: setupSignaturePad(document.getElementById('sigRep'))\r\n };\r\n document.querySelectorAll('[data-clear]').forEach(btn=>{\r\n btn.addEventListener('click', ()=>{\r\n const id = btn.getAttribute('data-clear');\r\n pads[id]?.clear();\r\n });\r\n });\r\n \/\/ Defaults\r\n const todayISO = (new Date()).toISOString().slice(0,10);\r\n const defaultDateIds = ['sigDate'];\r\n defaultDateIds.forEach(id => { const el = document.getElementById(id); if(el && !el.value) el.value = todayISO; });\r\n \/\/ State & helpers\r\n let hasPrinted = false;\r\n let hasSaved = false;\r\n function setSaveEnabled(on){ btnSave.disabled = !on; btnSave2.disabled = !on; }\r\n function setSubmitEnabled(on){ btnSubmit.disabled = !on; btnSubmit2.disabled = !on; }\r\n function updateSteps(){\r\n st1.classList.toggle('done', hasPrinted);\r\n st2.classList.toggle('done', hasSaved);\r\n st3.classList.toggle('done', hasSaved);\r\n setSaveEnabled(hasPrinted); \/\/ Save after print\/preview\r\n setSubmitEnabled(hasSaved); \/\/ Submit after save\r\n }\r\n updateSteps();\r\n let tmr;\r\n function showToast(msg){\r\n toast.textContent = msg;\r\n toast.classList.add('show');\r\n clearTimeout(tmr);\r\n tmr = setTimeout(()=> toast.classList.remove('show'), 1800);\r\n }\r\n \/\/ Validation\r\n function validateForm(){\r\n const requiredIds = ['fullName','dob','apptDate','apptTime','sigDate'];\r\n for(const id of requiredIds){\r\n const el = document.getElementById(id);\r\n if(!el || (el.value || '').trim() === ''){\r\n el?.scrollIntoView({behavior:'smooth', block:'center'});\r\n el?.focus?.({preventScroll:true});\r\n showToast('Please complete required fields.');\r\n return false;\r\n }\r\n }\r\n \/\/ Preferred contact method (radio) required\r\n if(!form.querySelector('input[name=\"prefContact\"]:checked')){\r\n form.querySelector('input[name=\"prefContact\"]').scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please select a preferred contact method.');\r\n return false;\r\n }\r\n \/\/ Acknowledgment\r\n const consent = document.getElementById('consentAck');\r\n if(!consent.checked){\r\n consent.scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please confirm the acknowledgment.');\r\n return false;\r\n }\r\n \/\/ Patient signature\r\n if(pads.sigPatient.isBlank()){\r\n document.getElementById('sigPatient').scrollIntoView({behavior:'smooth', block:'center'});\r\n showToast('Please add your signature.');\r\n return false;\r\n }\r\n return true;\r\n }\r\n \/\/ Print\/Preview\r\n function doPrint(){\r\n if(!validateForm()) return;\r\n window.print();\r\n }\r\n btnPrint.addEventListener('click', doPrint);\r\n btnPrint2.addEventListener('click', doPrint);\r\n \/\/ Detect when print preview closes\r\n function afterPrint(){\r\n hasPrinted = true;\r\n updateSteps();\r\n showToast('Print preview closed. You can now save a PDF.');\r\n }\r\n if('onafterprint' in window){\r\n window.addEventListener('afterprint', afterPrint);\r\n }else{\r\n btnPrint.addEventListener('click', ()=> setTimeout(afterPrint, 3000));\r\n btnPrint2.addEventListener('click', ()=> setTimeout(afterPrint, 3000));\r\n }\r\n \/\/ Filename for PDF\r\n function makeFileName(){\r\n const name = (document.getElementById('fullName').value || 'Patient').trim().replace(\/\\s+\/g,'_');\r\n const date = (document.getElementById('apptDate').value || todayISO);\r\n return `Symptom_Assessment_${name}_${date}.pdf`;\r\n }\r\n \/\/ Save PDF (html2pdf)\r\n async function savePDF(){\r\n if(!hasPrinted){\r\n showToast('Please print\/preview first.');\r\n return;\r\n }\r\n if(!validateForm()) return;\r\n await ensureSignatures();\r\n const opt = {\r\n margin: 0.4,\r\n filename: makeFileName(),\r\n image: { type: 'jpeg', quality: 0.98 },\r\n html2canvas: { scale: 2, useCORS: true, backgroundColor: '#ffffff' },\r\n jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' },\r\n pagebreak: { mode: ['css','legacy'] }\r\n };\r\n await html2pdf().from(card).set(opt).save();\r\n hasSaved = true;\r\n updateSteps();\r\n showToast('PDF saved to your device.');\r\n }\r\n btnSave.addEventListener('click', savePDF);\r\n btnSave2.addEventListener('click', savePDF);\r\n \/\/ Submit & Upload to Dropbox (redirect)\r\n async function submitAndUpload(){\r\n if(!hasSaved){\r\n showToast('Please save a PDF first.');\r\n return;\r\n }\r\n if(!validateForm()) return;\r\n try{\r\n const win = window.open(dropboxURL, '_blank');\r\n win?.focus();\r\n }catch(e){\r\n window.location.href = dropboxURL;\r\n }\r\n }\r\n btnSubmit.addEventListener('click', submitAndUpload);\r\n btnSubmit2.addEventListener('click', submitAndUpload);\r\n \/\/ Clear\r\n btnClear.addEventListener('click', ()=>{\r\n if(!confirm('Clear all fields and signatures?')) return;\r\n form.reset();\r\n defaultDateIds.forEach(id => { const el = document.getElementById(id); if(el) el.value = todayISO; });\r\n pads.sigPatient.clear();\r\n pads.sigRep.clear();\r\n hasPrinted = false; hasSaved = false;\r\n updateSteps();\r\n showToast('Form cleared.');\r\n });\r\n \/\/ Ensure signatures ready (canvas already holds strokes)\r\n async function ensureSignatures(){ return true; }\r\n \/\/ Signature pad\r\n function setupSignaturePad(canvas){\r\n const ctx = canvas.getContext('2d');\r\n const state = { drawing:false, blank:true, lastX:0, lastY:0 };\r\n function resize(){\r\n const ratio = Math.max(window.devicePixelRatio || 1, 1);\r\n const rect = canvas.getBoundingClientRect();\r\n canvas.width = rect.width * ratio;\r\n canvas.height = rect.height * ratio;\r\n ctx.setTransform(ratio, 0, 0, ratio, 0, 0);\r\n ctx.lineCap = 'round';\r\n ctx.lineJoin = 'round';\r\n ctx.lineWidth = 2.2;\r\n ctx.strokeStyle = '#18223b';\r\n ctx.clearRect(0,0,canvas.width,canvas.height);\r\n state.blank = true;\r\n }\r\n window.addEventListener('resize', resize, { passive:true });\r\n resize();\r\n function getPos(e){\r\n const r = canvas.getBoundingClientRect();\r\n const p = e.touches ? e.touches[0] : e;\r\n return { x: p.clientX - r.left, y: p.clientY - r.top };\r\n }\r\n function start(e){ e.preventDefault(); state.drawing=true; const p=getPos(e); state.lastX=p.x; state.lastY=p.y; }\r\n function move(e){\r\n if(!state.drawing) return;\r\n e.preventDefault();\r\n const p = getPos(e);\r\n ctx.beginPath(); ctx.moveTo(state.lastX, state.lastY); ctx.lineTo(p.x,p.y); ctx.stroke();\r\n state.lastX = p.x; state.lastY = p.y; state.blank = false;\r\n }\r\n function end(){ state.drawing=false; }\r\n canvas.addEventListener('mousedown', start);\r\n canvas.addEventListener('mousemove', move);\r\n window.addEventListener('mouseup', end);\r\n canvas.addEventListener('touchstart', start, { passive:false });\r\n canvas.addEventListener('touchmove', move, { passive:false });\r\n canvas.addEventListener('touchend', end);\r\n function clear(){ ctx.clearRect(0,0,canvas.width,canvas.height); state.blank = true; }\r\n function isBlank(){ return state.blank; }\r\n return { clear, isBlank };\r\n }\r\n})();\r\n<\/script> <\/body> <\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Your Smile Partners PLLC \u2014 Teledentistry Symptom Assessment Form Teledentistry Symptom Assessment Form Your Smile Partners PLLC 99 Wall St, New York, NY 10005 Email: talk@yoursmilepartners.com Phone: (212) 555\u2011SMILE Step 1: Print\/Preview Step 2: Save PDF Step 3: Submit & Upload Print \/ Preview Save PDF to Device Submit & Upload to Dropbox Clear All…<\/p>\n<p><a class=\"btn btn-outline-dark btn-sm anzu-read-more-link\" href=\"https:\/\/stephanie.openteledentistry.com\/?page_id=831\">Continue Reading<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"content-type":"","footnotes":""},"class_list":["post-831","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=831"}],"version-history":[{"count":4,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831\/revisions"}],"predecessor-version":[{"id":835,"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=\/wp\/v2\/pages\/831\/revisions\/835"}],"wp:attachment":[{"href":"https:\/\/stephanie.openteledentistry.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=831"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}