{"id":12,"date":"2026-05-19T05:37:40","date_gmt":"2026-05-19T05:37:40","guid":{"rendered":"https:\/\/organogramtree.salmondevelopersbd.com\/?page_id=12"},"modified":"2026-09-17T04:33:18","modified_gmt":"2026-09-17T04:33:18","slug":"organogram","status":"publish","type":"page","link":"https:\/\/organogramtree.salmondevelopersbd.com\/","title":{"rendered":"Organogram"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"12\" class=\"elementor elementor-12\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2350036 e-flex e-con-boxed e-con e-parent\" data-id=\"2350036\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-177e785 elementor-widget elementor-widget-html\" data-id=\"177e785\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>HR Dashboard \u2014 Salmon Developers<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n:root{\r\n  --bg:#f5f3ef;--bg2:#ffffff;--bg3:#ede9e3;\r\n  --border:#e2ddd6;--border2:#c8c0b4;\r\n  --text:#1a1612;--text2:#6b6257;--text3:#a89e93;\r\n  --salmon:#e85d3a;--salmon-dark:#c94a28;--salmon-soft:#fdf0ed;--salmon-border:rgba(232,93,58,0.2);\r\n  --green:#2d7a4f;--green-soft:#edf7f1;--green-border:rgba(45,122,79,0.2);\r\n  --blue:#2563eb;--blue-soft:#eff4ff;\r\n  --gold:#b45309;--gold-soft:#fef9ee;\r\n  --purple:#7c3aed;--purple-soft:#f5f3ff;\r\n  --red:#e8232a;--red-soft:#fef2f2;\r\n  --shadow-sm:0 1px 3px rgba(26,22,18,0.08);\r\n  --shadow:0 4px 16px rgba(26,22,18,0.1);\r\n  --shadow-lg:0 8px 32px rgba(26,22,18,0.14);\r\n}\r\n*{margin:0;padding:0;box-sizing:border-box}\r\nbody{font-family:'Inter',sans-serif}\r\n.hr-toggle-btn{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--bg2);border:2px solid var(--border);border-radius:14px;padding:14px 18px;cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;box-shadow:var(--shadow-sm);margin:0}\r\n.hr-toggle-btn:hover{border-color:var(--salmon);box-shadow:var(--shadow)}\r\n.hr-toggle-btn.open{border-color:var(--salmon);border-radius:14px 14px 0 0;background:var(--salmon-soft)}\r\n.hr-toggle-left{display:flex;align-items:center;gap:12px}\r\n.hr-toggle-icon{width:36px;height:36px;background:var(--salmon);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}\r\n.hr-toggle-icon svg{width:18px;height:18px;color:#fff}\r\n.hr-toggle-title{font-size:15px;font-weight:700;color:var(--text)}\r\n.hr-toggle-sub{font-size:11px;color:var(--text3);display:block;margin-top:1px;font-weight:500}\r\n.hr-toggle-right{display:flex;align-items:center;gap:10px}\r\n.hr-live-pill{display:flex;align-items:center;gap:5px;background:var(--green-soft);border:1px solid var(--green-border);border-radius:50px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--green)}\r\n.hr-live-dot{width:6px;height:6px;background:var(--green);border-radius:50%;animation:hr-blink 1.8s infinite}\r\n@keyframes hr-blink{0%,100%{opacity:1}50%{opacity:.3}}\r\n.hr-chevron{font-size:13px;color:var(--text3);transition:transform .3s}\r\n.hr-toggle-btn.open .hr-chevron{transform:rotate(180deg);color:var(--salmon)}\r\n.hr-panel{display:none;background:var(--bg2);border:2px solid var(--salmon);border-top:none;border-radius:0 0 14px 14px;overflow:hidden;box-shadow:var(--shadow-lg);font-family:'Inter',sans-serif}\r\n.hr-panel.open{display:block}\r\n.hr-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:8px;background:var(--bg3)}\r\n.hr-toolbar-info{font-size:12px;color:var(--text3);font-weight:600}\r\n.hr-toolbar-info strong{color:var(--text);font-size:12px}\r\n.hr-toolbar-right{display:flex;align-items:center;gap:8px}\r\n.hr-sync{font-size:11px;color:var(--text2);display:flex;align-items:center;gap:5px;font-weight:600}\r\n.hr-btn{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:6px 13px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}\r\n.hr-btn:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.hr-tabs{display:flex;gap:3px;padding:8px 12px;background:var(--bg2);border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch}\r\n.hr-tab{padding:8px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:var(--text2);transition:all .15s;border:none;background:none;font-family:'Inter',sans-serif;white-space:nowrap;flex-shrink:0}\r\n.hr-tab:hover{color:var(--text);background:var(--bg3)}\r\n.hr-tab.on{background:var(--salmon);color:#fff;box-shadow:0 2px 8px rgba(232,93,58,0.3)}\r\n.hr-main{padding:14px;background:var(--bg)}\r\n.hr-kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px}\r\n.hr-kpi{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:12px 13px;box-shadow:var(--shadow-sm)}\r\n.hr-kpi .lbl{font-size:9px;color:var(--text3);font-weight:700;text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px;display:block}\r\n.hr-kpi .val{font-size:24px;font-weight:700;line-height:1;color:var(--text);display:block}\r\n.hr-kpi .sub{font-size:11px;color:var(--text3);margin-top:5px;display:block;font-weight:500}\r\n.hr-g2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}\r\n@media(max-width:640px){.hr-g2{grid-template-columns:1fr}}\r\n.hr-card{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:13px;margin-bottom:10px;box-shadow:var(--shadow-sm)}\r\n.hr-ctitle{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}\r\n.hr-filter{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 0;margin-bottom:10px}\r\n.hr-filter label{font-size:12px;color:var(--text2);font-weight:700}\r\n.hr-filter select,.hr-filter input[type=date],.hr-filter input[type=text]{background:var(--bg2);border:1.5px solid var(--border);color:var(--text);padding:6px 10px;border-radius:8px;font-size:12px;font-family:'Inter',sans-serif;outline:none}\r\n.hr-filter select:focus,.hr-filter input:focus{border-color:var(--salmon)}\r\n.hr-rst{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif}\r\n.hr-rst:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.hr-subtabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}\r\n.hr-subtab{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:5px 12px;border-radius:8px;font-size:11px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif}\r\n.hr-subtab.on{background:var(--salmon);color:#fff;border-color:var(--salmon)}\r\n.hr-tblwrap{overflow-x:auto;border-radius:8px;border:1.5px solid var(--border)}\r\ntable.hrt{width:100%;border-collapse:collapse;font-size:12px}\r\ntable.hrt thead th{background:var(--bg3);padding:8px 10px;text-align:left;font-weight:700;color:var(--text3);font-size:10px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1.5px solid var(--border);white-space:nowrap}\r\ntable.hrt tbody td{padding:8px 10px;border-bottom:1px solid var(--bg3);color:var(--text)}\r\ntable.hrt tbody tr:last-child td{border-bottom:none}\r\ntable.hrt tbody tr:hover td{background:var(--bg)}\r\n.hr-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}\r\n.av-s{background:var(--salmon-soft);color:var(--salmon-dark);border:1.5px solid var(--salmon-border)}\r\n.av-g{background:var(--green-soft);color:var(--green);border:1.5px solid var(--green-border)}\r\n.av-b{background:var(--blue-soft);color:var(--blue);border:1.5px solid rgba(37,99,235,0.2)}\r\n.av-p{background:var(--purple-soft);color:var(--purple);border:1.5px solid rgba(124,58,237,0.2)}\r\n.sdb{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;font-family:'JetBrains Mono',monospace;white-space:nowrap}\r\n.gg{background:var(--green-soft);color:var(--green);border:1px solid var(--green-border)}\r\n.yg{background:var(--gold-soft);color:var(--gold);border:1px solid rgba(180,83,9,0.15)}\r\n.rg{background:var(--salmon-soft);color:var(--salmon-dark);border:1px solid var(--salmon-border)}\r\n.pg{background:var(--purple-soft);color:var(--purple);border:1px solid rgba(124,58,237,0.15)}\r\n.bg-b{background:var(--blue-soft);color:var(--blue);border:1px solid rgba(37,99,235,0.15)}\r\n.gr{background:var(--bg3);color:var(--text3);border:1px solid var(--border)}\r\n.redb{background:var(--red-soft);color:var(--red);border:1px solid rgba(232,35,42,0.2)}\r\n.sig-dot{display:inline-block;width:8px;height:8px;border-radius:50%;vertical-align:middle;margin-right:4px}\r\n.sig-dot.green{background:#16a34a}.sig-dot.red{background:#e8232a}.sig-dot.yellow{background:#ca8a04}\r\n.hr-view-btn{background:none;border:1px solid var(--border);color:var(--text3);font-size:11px;padding:3px 9px;border-radius:6px;cursor:pointer;font-family:'Inter',sans-serif}\r\n.hr-view-btn:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.hr-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;color:var(--text3);gap:10px}\r\n.hr-spin{width:24px;height:24px;border:2.5px solid var(--border);border-top-color:var(--salmon);border-radius:50%;animation:hr-spin .7s linear infinite}\r\n@keyframes hr-spin{to{transform:rotate(360deg)}}\r\n.hr-err{background:var(--salmon-soft);border:1.5px solid var(--salmon-border);border-radius:8px;padding:13px;color:var(--salmon-dark);font-size:13px;text-align:center;font-weight:600}\r\n.hr-empty{padding:20px;text-align:center;color:var(--text3);font-size:13px}\r\n@media(max-width:480px){.hr-kgrid{grid-template-columns:1fr 1fr}.hr-kpi .val{font-size:18px}}\r\n<\/style>\r\n\r\n<div id=\"hr-root\">\r\n  <button class=\"hr-toggle-btn\" id=\"hr-toggle\" onclick=\"hrToggle()\">\r\n    <div class=\"hr-toggle-left\">\r\n      <div class=\"hr-toggle-icon\">\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"\/><circle cx=\"9\" cy=\"7\" r=\"4\"\/><path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"\/><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"\/><\/svg>\r\n      <\/div>\r\n      <div>\r\n        <div class=\"hr-toggle-title\">HR Dashboard<\/div>\r\n        <span class=\"hr-toggle-sub\" id=\"hr-toggle-sub\">Click to open<\/span>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"hr-toggle-right\">\r\n      <div class=\"hr-live-pill\"><div class=\"hr-live-dot\"><\/div>Live<\/div>\r\n      <span class=\"hr-chevron\">\u25bc<\/span>\r\n    <\/div>\r\n  <\/button>\r\n\r\n  <div class=\"hr-panel\" id=\"hr-panel\">\r\n    <div class=\"hr-toolbar\">\r\n      <div class=\"hr-toolbar-info\"><strong id=\"hr-pagedate\">Loading...<\/strong><\/div>\r\n      <div class=\"hr-toolbar-right\">\r\n        <div class=\"hr-sync\"><div class=\"hr-live-dot\"><\/div><span id=\"hr-sync\">Loading...<\/span><\/div>\r\n        <button class=\"hr-btn\" onclick=\"hrLoad()\">Refresh<\/button>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"hr-tabs\">\r\n      <button class=\"hr-tab on\" onclick=\"hrTab('overview',this)\">Overview<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('today',this)\">Today's Attendance<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('history',this)\">Attendance History<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('employees',this)\">Employees<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('leave',this)\">Leave<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('tasks',this)\">HR Tasks<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('recruitment',this)\">Recruitment<\/button>\r\n      <button class=\"hr-tab\" onclick=\"hrTab('lifecycle',this)\">Lifecycle<\/button>\r\n    <\/div>\r\n    <div class=\"hr-main\" id=\"hr-main\">\r\n      <div class=\"hr-loading\"><div class=\"hr-spin\"><\/div><span>Loading...<\/span><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n'use strict';\r\nconst PROXY='https:\/\/script.google.com\/macros\/s\/AKfycbzTaarHHDvIJE0WNz7djT135QOwz5RkakgDI1YRbDSEOEm4fV1y-Zd8NCn72Bz5tu9x\/exec';\r\n\r\nlet SHEETS={}, currentTab='overview', isOpen=false, loaded=false;\r\n\r\nfunction parseCSV(text){\r\n  if(!text || text.startsWith('Error'))return[];\r\n  const lines=text.split('\\n');\r\n  return lines.map(line=>{\r\n    const cols=[];let cur='',inQ=false;\r\n    for(let i=0;i<line.length;i++){\r\n      const ch=line[i];\r\n      if(ch==='\"'){\r\n        if(inQ && line[i+1]==='\"'){cur+='\"';i++;}\r\n        else inQ=!inQ;\r\n      } else if(ch===','&&!inQ){cols.push(cur);cur='';}\r\n      else cur+=ch;\r\n    }\r\n    cols.push(cur);\r\n    return cols;\r\n  });\r\n}\r\n\r\nasync function fetchSheet(name){\r\n  try{\r\n    const r=await fetch(PROXY+'?sheet='+encodeURIComponent(name)+'&nocache='+Date.now());\r\n    return parseCSV(await r.text());\r\n  }catch(e){return[];}\r\n}\r\n\r\n\/\/ Generic: find the header row by matching its first cell, return {headers, data(as objects)}\r\nfunction extractTable(rows, headerMatch){\r\n  const hIdx=rows.findIndex(r=>(r[0]||'').trim()===headerMatch);\r\n  if(hIdx===-1)return{headers:[],data:[]};\r\n  const headers=rows[hIdx].map(h=>(h||'').trim());\r\n  const data=rows.slice(hIdx+1)\r\n    .filter(r=>r.some(c=>(c||'').trim()))\r\n    .map(r=>{\r\n      const obj={};\r\n      headers.forEach((h,i)=>obj[h]=(r[i]||'').trim());\r\n      return obj;\r\n    });\r\n  return{headers,data};\r\n}\r\n\r\nfunction ini(n){return(n||'').split(' ').filter(w=>w.length>1).map(w=>w[0]).join('').toUpperCase().slice(0,2);}\r\nfunction parseDate(d){\r\n  if(!d)return null;\r\n  d=d.trim();\r\n  let m=d.match(\/^(\\d{1,2})\\\/(\\d{1,2})\\\/(\\d{4})$\/);\r\n  if(m)return new Date(+m[3],+m[1]-1,+m[2]);\r\n  m=d.match(\/^(\\d{4})-(\\d{1,2})-(\\d{1,2})\/);\r\n  if(m)return new Date(+m[1],+m[2]-1,+m[3]);\r\n  const dd=new Date(d);\r\n  return isNaN(dd)?null:dd;\r\n}\r\nfunction fmtDate(d){return d?d.toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'}):'\u2014';}\r\nfunction ordinalDate(d){\r\n  if(!d)return'\u2014';\r\n  const day=d.getDate();\r\n  const suffix=(day%10===1&&day!==11)?'st':(day%10===2&&day!==12)?'nd':(day%10===3&&day!==13)?'rd':'th';\r\n  const month=d.toLocaleDateString('en-GB',{month:'long'});\r\n  const yr=String(d.getFullYear()).slice(-2);\r\n  return `${day}${suffix} ${month}'${yr}`;\r\n}\r\nfunction statusPill(s){\r\n  const m={'Done':'gg','In Progress':'yg','Pending':'rg','Carried Forward':'pg','Cancelled':'gr',\r\n    'Approved':'gg','Rejected':'rg','Confirmed':'gg','Extended':'yg','Terminated':'rg',\r\n    'Active':'gg','Inactive':'gr','Resigned':'yg','Selected':'gg','Offer Sent':'bg-b','Joined':'gg',\r\n    'On Time':'gg','Late':'yg','Absent':'rg','Day Off':'bg-b','Shift Duty':'pg','Leave':'yg'};\r\n  return `<span class=\"sdb ${m[s]||'gr'}\">${s||'\u2014'}<\/span>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 OVERVIEW \u2500\u2500\r\n\/\/ \u2500\u2500 small reusable donut\/pie chart (no external library) \u2500\u2500\r\nfunction miniBarChart(items){\r\n  const max=Math.max(1,...items.map(i=>i.value));\r\n  return `<div style=\"display:flex;flex-direction:column;gap:9px\">\r\n    ${items.map(i=>{\r\n      const pct=Math.round((i.value\/max)*100);\r\n      return `<div>\r\n        <div style=\"display:flex;justify-content:space-between;font-size:12px;margin-bottom:3px\">\r\n          <span>${i.label}<\/span><span style=\"font-weight:700\">${i.value}<\/span>\r\n        <\/div>\r\n        <div style=\"background:var(--bg3);border-radius:4px;height:9px;overflow:hidden\">\r\n          <div style=\"width:${pct}%;height:100%;border-radius:4px;background:${i.color};transition:width .4s\"><\/div>\r\n        <\/div>\r\n      <\/div>`;\r\n    }).join('')}\r\n  <\/div>`;\r\n}\r\n\r\n\/\/ Today-only attendance (for Department Breakdown + the bar chart)\r\nfunction getTodayAttendance(){\r\n  return (SHEETS.TodaysAttendance||{data:[]}).data\r\n    .filter(r=>r['Name']&&r['Status'])\r\n    .map(r=>({Name:r['Name'],Status:r['Status']}));\r\n}\r\n\r\n\/\/ Combined attendance history for the current month (AllAttendance + today's live entries)\r\nfunction getMonthAttendance(){\r\n  const now=new Date();\r\n  const monthStart=new Date(now.getFullYear(),now.getMonth(),1);\r\n  const all=(SHEETS.AllAttendance||{data:[]}).data.map(r=>({Name:r['Name'],Status:r['Status'],Date:r['Date']}));\r\n  const todayStr=todayKeyStr();\r\n  const todayRows=(SHEETS.TodaysAttendance||{data:[]}).data\r\n    .filter(r=>r['Name']&&r['Status'])\r\n    .map(r=>({Name:r['Name'],Status:r['Status'],Date:todayStr}));\r\n  return all.concat(todayRows).filter(r=>{\r\n    const d=parseDate(r.Date);\r\n    return d && d>=monthStart;\r\n  });\r\n}\r\n\r\nfunction rOverview(){\r\n  const em=SHEETS.EmployeeMaster||{data:[]};\r\n  const active=em.data.filter(e=>e['Employment Status']==='Active');\r\n  const nameToDept={};\r\n  em.data.forEach(e=>{nameToDept[e['Name']]=e['Department']||'Unassigned';});\r\n  const deptActiveCount={};\r\n  active.forEach(e=>{const d=e['Department']||'Unassigned';deptActiveCount[d]=(deptActiveCount[d]||0)+1;});\r\n\r\n  const today=SHEETS.TodaysAttendance||{data:[]};\r\n  const filled=today.data.filter(r=>r['Status']);\r\n  const onTime=filled.filter(r=>r['Status']==='On Time'||r['Status']==='Between 9:01-9:10').length;\r\n  const late=filled.filter(r=>r['Status']==='Late').length;\r\n  const absent=filled.filter(r=>r['Status']==='Absent'||r['Status']==='Leave').length;\r\n  const dayOff=filled.filter(r=>r['Status']==='Day Off').length;\r\n  const shift=filled.filter(r=>r['Status']==='Shift Duty').length;\r\n  const notMarked=today.data.length-filled.length;\r\n\r\n  const tasks=SHEETS.HRTasks||{data:[]};\r\n  const pendingApproval=tasks.data.filter(t=>t['Needs Approval']==='Yes' && t['Approval Status']==='Pending');\r\n\r\n  const leave=SHEETS.LeaveLedger||{data:[]};\r\n  const pendingLeave=leave.data.filter(l=>l['Status']==='Pending');\r\n\r\n  const rec=SHEETS.Recruitment||{data:[]};\r\n  const activeRec=rec.data.filter(r=>!['Joined','Rejected','Withdrawn'].includes(r['Stage']));\r\n\r\n  const todo=SHEETS.TodaysToDo||{data:[]};\r\n  const todoRows=todo.data.filter(t=>t['Task\/Activity']);\r\n\r\n  \/\/ \u2500\u2500 upcoming interviews: today + future only \u2500\u2500\r\n  const todayStr=todayKeyStr();\r\n  const upcomingInterviews=rec.data.filter(r=>{\r\n    if(!r['Interview Date'])return false;\r\n    const d=parseDate(r['Interview Date']);\r\n    return d && dateKey(d)>=todayStr;\r\n  }).sort((a,b)=>(parseDate(a['Interview Date'])||0)-(parseDate(b['Interview Date'])||0));\r\n\r\n  \/\/ \u2500\u2500 department-wise absence\/leave TODAY (not month) \u2500\u2500\r\n  const todayAtt=getTodayAttendance();\r\n  const deptAbsenceToday={};\r\n  todayAtt.forEach(r=>{\r\n    if(r.Status==='Absent'||r.Status==='Leave'){\r\n      const dept=nameToDept[r.Name]||'Unassigned';\r\n      deptAbsenceToday[dept]=(deptAbsenceToday[dept]||0)+1;\r\n    }\r\n  });\r\n\r\n  const allDepts=[...new Set([...Object.keys(deptActiveCount),...Object.keys(deptAbsenceToday)])];\r\n  const deptRows=allDepts.sort((a,b)=>(deptAbsenceToday[b]||0)-(deptAbsenceToday[a]||0)).map(d=>\r\n    `<div style=\"display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--bg3);font-size:12px\">\r\n      <span>${d}<\/span>\r\n      <span><strong>${deptActiveCount[d]||0}<\/strong> active<span style=\"color:var(--salmon);margin-left:10px;font-weight:700\">${deptAbsenceToday[d]||0} absence today<\/span><\/span>\r\n    <\/div>`).join('');\r\n\r\n  \/\/ bar chart \u2014 ALL departments, even zero-absence ones, sorted worst-first\r\n  \/\/ (Department Absence bar-chart card was removed per request \u2014 deptAbsenceToday\r\n  \/\/ above still feeds the Department Breakdown card's per-department count.)\r\n\r\n  \/\/ \u2500\u2500 most late \/ most absent \/ fewest late (this month, plain text \u2014 no icons) \u2500\u2500\r\n  const monthAtt=getMonthAttendance();\r\n  const lateByPerson={}, absentByPerson={};\r\n  monthAtt.forEach(r=>{\r\n    if(r.Status==='Absent'||r.Status==='Leave')absentByPerson[r.Name]=(absentByPerson[r.Name]||0)+1;\r\n    if(r.Status==='Late')lateByPerson[r.Name]=(lateByPerson[r.Name]||0)+1;\r\n  });\r\n  let mostLate=null, mostLateCount=0;\r\n  Object.entries(lateByPerson).forEach(([n,c])=>{if(c>mostLateCount){mostLate=n;mostLateCount=c;}});\r\n  let mostAbsent=null, mostAbsentCount=0;\r\n  Object.entries(absentByPerson).forEach(([n,c])=>{if(c>mostAbsentCount){mostAbsent=n;mostAbsentCount=c;}});\r\n  let fewestLate=null, fewestLateCount=Infinity;\r\n  Object.entries(lateByPerson).forEach(([n,c])=>{if(c<fewestLateCount){fewestLate=n;fewestLateCount=c;}});\r\n\r\n  const approvalRows=pendingApproval.slice(0,6).map(t=>\r\n    `<div style=\"display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--bg3);font-size:12px\">\r\n      <span class=\"sdb ${t['Priority']==='High'?'rg':t['Priority']==='Medium'?'yg':'gr'}\" style=\"font-size:9px\">${t['Priority']||'\u2014'}<\/span>\r\n      <span style=\"flex:1\">${t['Task\/Activity']}<\/span>\r\n      <span style=\"color:var(--text3);font-size:10px;font-family:'JetBrains Mono',monospace\">${t['Date']}<\/span>\r\n    <\/div>`).join('') || '<div class=\"hr-empty\" style=\"padding:10px\">Nothing pending approval<\/div>';\r\n\r\n  const todoRowsHtml=todoRows.slice(0,8).map(t=>\r\n    `<div style=\"display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--bg3);font-size:12px\">\r\n      <span class=\"sdb ${t['Priority']==='High'?'rg':t['Priority']==='Medium'?'yg':'gr'}\" style=\"font-size:9px\">${t['Priority']||'\u2014'}<\/span>\r\n      <span style=\"flex:1\">${t['Task\/Activity']}<\/span>\r\n      ${t['Status']?statusPill(t['Status']):''}\r\n    <\/div>`).join('') || '<div class=\"hr-empty\" style=\"padding:10px\">No to-do items yet today<\/div>';\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-kgrid\">\r\n      <div class=\"hr-kpi\">\r\n        <span class=\"lbl\">Active Employees<\/span>\r\n        <span class=\"val\" style=\"color:var(--green)\">${active.length}<\/span>\r\n        <span class=\"sub\">Present: <strong style=\"color:var(--green)\">${onTime}<\/strong> \u00b7 Late: <strong style=\"color:var(--gold)\">${late}<\/strong><\/span>\r\n      <\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Today Absent<\/span><span class=\"val\" style=\"color:var(--salmon)\">${absent}<\/span><span class=\"sub\">Absent \/ Leave<\/span><\/div>\r\n      <div class=\"hr-kpi\" style=\"cursor:pointer\" onclick=\"hrTab('tasks',document.querySelectorAll('.hr-tab')[5])\"><span class=\"lbl\">Pending Approval<\/span><span class=\"val\" style=\"color:var(--purple)\">${pendingApproval.length}<\/span><span class=\"sub\">HR tasks \u00b7 click to view<\/span><\/div>\r\n      <div class=\"hr-kpi\" style=\"cursor:pointer\" onclick=\"hrTab('leave',document.querySelectorAll('.hr-tab')[4])\"><span class=\"lbl\">Leave Requests<\/span><span class=\"val\" style=\"color:var(--blue)\">${pendingLeave.length}<\/span><span class=\"sub\">Pending \u00b7 click to view<\/span><\/div>\r\n      <div class=\"hr-kpi\" style=\"cursor:pointer\" onclick=\"showUpcomingInterviews()\"><span class=\"lbl\">Upcoming Interviews<\/span><span class=\"val\" style=\"color:var(--purple)\">${upcomingInterviews.length}<\/span><span class=\"sub\">Today &amp; future \u00b7 click to view<\/span><\/div>\r\n    <\/div>\r\n    <div class=\"hr-g2\">\r\n      <div class=\"hr-card\"><div class=\"hr-ctitle\">Department Breakdown \u2014 Active &amp; Absence Today<\/div>${deptRows||'<div class=\"hr-empty\">No data<\/div>'}<\/div>\r\n      <div class=\"hr-card\"><div class=\"hr-ctitle\">Today's Attendance Snapshot<\/div>\r\n        <div style=\"display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px\">\r\n          <span class=\"sdb gg\">On Time\/Grace: ${onTime}<\/span>\r\n          <span class=\"sdb yg\">Late: ${late}<\/span>\r\n          <span class=\"sdb rg\">Absent\/Leave: ${absent}<\/span>\r\n          <span class=\"sdb bg-b\">Day Off: ${dayOff}<\/span>\r\n          <span class=\"sdb pg\">Shift Duty: ${shift}<\/span>\r\n          ${notMarked>0?`<span class=\"sdb gr\">Not marked yet: ${notMarked}<\/span>`:''}\r\n        <\/div>\r\n        <div style=\"border-top:1px solid var(--bg3);padding-top:8px;display:flex;flex-direction:column;gap:6px\">\r\n          ${mostLate?`<div style=\"font-size:12px\">Most Late \u2014 <strong>${mostLate}<\/strong> <span class=\"sdb rg\" style=\"margin-left:4px\">${mostLateCount}\u00d7<\/span><\/div>`:''}\r\n          ${mostAbsent?`<div style=\"font-size:12px\">Most Absent \u2014 <strong>${mostAbsent}<\/strong> <span class=\"sdb rg\" style=\"margin-left:4px\">${mostAbsentCount}\u00d7<\/span><\/div>`:''}\r\n          ${fewestLate?`<div style=\"font-size:12px\">Fewest Late (among latecomers) \u2014 <strong>${fewestLate}<\/strong> <span class=\"sdb gg\" style=\"margin-left:4px\">${fewestLateCount}\u00d7<\/span><\/div>`:''}\r\n          ${!mostLate&&!mostAbsent?'<div class=\"hr-empty\">No attendance issues recorded this month yet<\/div>':''}\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">Needs Management Approval<\/div>${approvalRows}<\/div>\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">HR's Daily To-Do \u2014 Today<\/div>${todoRowsHtml}<\/div>\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">Recruitment Pipeline<\/div>\r\n      <div style=\"font-size:13px\">${activeRec.length} candidate${activeRec.length!==1?'s':''} currently in progress (out of ${rec.data.length} total ever)<\/div>\r\n    <\/div>`;\r\n}\r\n\r\n\/\/ Click-through detail view for Upcoming Interviews (not a nav tab \u2014\r\n\/\/ swaps into hr-main temporarily, same pattern as the KPI click-throughs)\r\nfunction showUpcomingInterviews(){\r\n  const rec=SHEETS.Recruitment||{data:[]};\r\n  const todayStr=todayKeyStr();\r\n  const upcoming=rec.data.filter(r=>{\r\n    if(!r['Interview Date'])return false;\r\n    const d=parseDate(r['Interview Date']);\r\n    return d && dateKey(d)>=todayStr;\r\n  }).sort((a,b)=>(parseDate(a['Interview Date'])||0)-(parseDate(b['Interview Date'])||0));\r\n\r\n  const rows=upcoming.map((r,i)=>`\r\n    <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td><div style=\"display:flex;align-items:center;gap:8px\"><div class=\"hr-av av-p\">${ini(r['Candidate Name'])}<\/div>${r['Candidate Name']}<\/div><\/td>\r\n      <td>${r['Position Applied']||'\u2014'}<\/td>\r\n      <td>${r['Department']||'\u2014'}<\/td>\r\n      <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap\">${r['Interview Date']}<\/td>\r\n      <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Interview Time']||'\u2014'}<\/td>\r\n    <\/tr>`).join('');\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <button class=\"hr-rst\" onclick=\"hrTab('overview',document.querySelectorAll('.hr-tab')[0])\" style=\"margin-bottom:12px\">&larr; Back to Overview<\/button>\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">Upcoming Interviews \u2014 Today &amp; Future (${upcoming.length})<\/div>\r\n      <div class=\"hr-tblwrap\"><table class=\"hrt\">\r\n        <thead><tr><th>Candidate<\/th><th>Position \/ Designation<\/th><th>Department<\/th><th>Date<\/th><th>Time<\/th><\/tr><\/thead>\r\n        <tbody>${rows||'<tr><td colspan=\"5\" class=\"hr-empty\">No upcoming interviews scheduled<\/td><\/tr>'}<\/tbody>\r\n      <\/table><\/div>\r\n    <\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 TODAY'S ATTENDANCE \u2014 classic grid format, date search, monthly late count, print \u2500\u2500\r\nlet _gridDate='';\r\nconst GRID_COLS=[\r\n  {key:'Before 9:00 am', match:r=>r.Status==='On Time', color:'#166534', bg:'#dcfce7'},\r\n  {key:'Between 9:01-9:10 am', match:r=>r.Status==='Between 9:01-9:10', color:'#0f766e', bg:'#ccfbf1'},\r\n  {key:'Late', match:r=>r.Status==='Late', color:'#b45309', bg:'#fef3c7'},\r\n  {key:'Absent\/Leave', match:r=>r.Status==='Absent'||r.Status==='Leave', color:'#b91c1c', bg:'#fee2e2'},\r\n  {key:'Day Off', match:r=>r.Status==='Day Off', color:'#1d4ed8', bg:'#dbeafe'},\r\n  {key:'Shift', match:r=>r.Status==='Shift Duty', color:'#6d28d9', bg:'#ede9fe'},\r\n];\r\n\r\nfunction dateKey(d){return d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0')+'-'+String(d.getDate()).padStart(2,'0');}\r\nfunction todayKeyStr(){return dateKey(new Date());}\r\n\r\nfunction rToday(){\r\n  const selDate=_gridDate||todayKeyStr();\r\n  const isToday=selDate===todayKeyStr();\r\n  const selD=parseDate(selDate);\r\n\r\n  let rows;\r\n  if(isToday){\r\n    rows=(SHEETS.TodaysAttendance||{data:[]}).data\r\n      .filter(r=>r['Name']&&r['Status'])\r\n      .map(r=>({Name:r['Name'],Status:r['Status'],ShiftTime:r['Shift Time']}));\r\n  }else{\r\n    rows=(SHEETS.AllAttendance||{data:[]}).data\r\n      .filter(r=>{const d=parseDate(r['Date']);return d && dateKey(d)===selDate;})\r\n      .map(r=>({Name:r['Name'],Status:r['Status'],ShiftTime:r['Shift Time']}));\r\n  }\r\n\r\n  const buckets={};\r\n  GRID_COLS.forEach(c=>{buckets[c.key]=rows.filter(c.match);});\r\n  const maxRows=Math.max(1,...GRID_COLS.map(c=>buckets[c.key].length));\r\n\r\n  const timely=buckets['Before 9:00 am'].length+buckets['Between 9:01-9:10 am'].length;\r\n  const late=buckets['Late'].length;\r\n  const totalPresent=timely+late;\r\n  const dayOff=buckets['Day Off'].length;\r\n  const absent=buckets['Absent\/Leave'].length;\r\n  const shift=buckets['Shift'].length;\r\n  const totalEmployee=totalPresent+dayOff+absent+shift;\r\n\r\n  \/\/ Monthly late count per person (up to & including selected date) \u2014 computed\r\n  \/\/ first so it can be shown inline next to each name in the Late column.\r\n  const monthStart=new Date(selD.getFullYear(),selD.getMonth(),1);\r\n  const historyForMonth=(SHEETS.AllAttendance||{data:[]}).data.slice();\r\n  if(isToday){\r\n    (SHEETS.TodaysAttendance||{data:[]}).data.filter(r=>r['Name']&&r['Status']).forEach(r=>{\r\n      historyForMonth.push({Name:r['Name'],Status:r['Status'],Date:selDate});\r\n    });\r\n  }\r\n  const lateCounts={};\r\n  historyForMonth.forEach(r=>{\r\n    const d=parseDate(r['Date']);\r\n    if(!d||d<monthStart||d>selD)return;\r\n    if(r['Status']==='Late'){\r\n      lateCounts[r['Name']]=(lateCounts[r['Name']]||0)+1;\r\n    }\r\n  });\r\n\r\n  let gridRows='';\r\n  for(let i=0;i<maxRows;i++){\r\n    gridRows+='<tr>'+GRID_COLS.map(c=>{\r\n      const person=buckets[c.key][i];\r\n      let txt=person?person.Name:'';\r\n      if(person&&c.key==='Shift'&&person.ShiftTime)txt+=` (${person.ShiftTime})`;\r\n      if(person&&c.key==='Late'){\r\n        const cnt=lateCounts[person.Name]||0;\r\n        txt+=` <span style=\"font-size:10px;color:var(--salmon);font-weight:700\">(${cnt}\u00d7 this month)<\/span>`;\r\n      }\r\n      return `<td style=\"padding:7px 10px;border:1px solid var(--border);text-align:center;font-size:13px\">${txt}<\/td>`;\r\n    }).join('')+'<\/tr>';\r\n  }\r\n\r\n  const gridHtml=`<div style=\"overflow-x:auto\"><table style=\"width:100%;border-collapse:collapse\">\r\n    <thead>\r\n      <tr>\r\n        <th colspan=\"${GRID_COLS.length}\" style=\"background:var(--salmon);color:#fff;padding:0;border:1px solid var(--salmon-dark)\">\r\n          <div style=\"display:flex;align-items:center;justify-content:space-between;padding:10px 16px\">\r\n            <span style=\"font-size:14px;font-weight:800\">Daily Attendance<\/span>\r\n            <span style=\"font-size:15px;font-weight:800\">Salmon Developers Ltd.<\/span>\r\n            <span style=\"font-size:14px;font-weight:800\">${ordinalDate(selD)}<\/span>\r\n          <\/div>\r\n        <\/th>\r\n      <\/tr>\r\n      <tr>${GRID_COLS.map(c=>`<th style=\"background:${c.bg};color:${c.color};padding:8px 10px;font-weight:800;font-size:12px;border:1px solid var(--border)\">${c.key}<\/th>`).join('')}<\/tr>\r\n    <\/thead>\r\n    <tbody>${gridRows}<\/tbody>\r\n  <\/table><\/div>`;\r\n\r\n  const summaryRows=[['Total Employee',totalEmployee],['Attend Timely',timely],['Attend Late',late],\r\n    ['Total Present',totalPresent],['Day Off',dayOff],['Absent\/Leave',absent],['Shift Duty',shift]];\r\n  const summaryHtml=`<div class=\"hr-kgrid\" style=\"margin-top:12px\">\r\n    ${summaryRows.map(([lbl,val])=>`<div class=\"hr-kpi\" style=\"padding:9px 11px\">\r\n      <span class=\"lbl\" style=\"font-size:8px\">${lbl}<\/span>\r\n      <span class=\"val\" style=\"font-size:20px;color:var(--salmon-dark)\">${val}<\/span>\r\n    <\/div>`).join('')}\r\n  <\/div>`;\r\n\r\n  const lateArr=Object.entries(lateCounts).sort((a,b)=>b[1]-a[1]);\r\n  const lateHtml=lateArr.length?`<div style=\"display:flex;flex-wrap:wrap;gap:6px\">\r\n    ${lateArr.map(([name,cnt])=>{\r\n      const badge=cnt>=5?'rg':cnt>=3?'yg':'gr';\r\n      return `<span class=\"sdb ${badge}\">${name} \u2014 ${cnt}\u00d7<\/span>`;\r\n    }).join('')}\r\n  <\/div>`:'<div class=\"hr-empty\">No late arrivals this month<\/div>';\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-filter\">\r\n      <label>Date<\/label>\r\n      <input type=\"date\" id=\"griddate\" value=\"${selDate}\" onchange=\"hrSetGridDate(this.value)\">\r\n      <button class=\"hr-btn\" onclick=\"hrSetGridDate(document.getElementById('griddate').value)\">Apply<\/button>\r\n      <button class=\"hr-rst\" onclick=\"hrSetGridDate('')\">Reset (Today)<\/button>\r\n      <button class=\"hr-btn\" style=\"margin-left:auto;background:var(--salmon);color:#fff;border-color:var(--salmon)\" onclick=\"printAttendanceGrid()\">\ud83d\udda8 Print \/ Share<\/button>\r\n      ${!isToday?'<span style=\"font-size:11px;color:var(--text3)\">Viewing archived history<\/span>':'<span style=\"font-size:11px;color:var(--green);font-weight:700\">Live \u2014 today<\/span>'}\r\n    <\/div>\r\n    <div class=\"hr-card\" id=\"grid-print-area\">\r\n      ${gridHtml}\r\n      ${summaryHtml}\r\n    <\/div>\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">Late Arrivals This Month \u2014 ${selD.toLocaleDateString('en-GB',{month:'long',year:'numeric'})}<\/div>${lateHtml}<\/div>`;\r\n}\r\n\r\nwindow.printAttendanceGrid=function(){\r\n  const selDate=_gridDate||todayKeyStr();\r\n  const selD=parseDate(selDate);\r\n  const content=document.getElementById('grid-print-area').innerHTML;\r\n  const pw=window.open('','_blank','width=900,height=750');\r\n  pw.document.write(`<!DOCTYPE html><html><head><meta charset=\"UTF-8\">\r\n  <title>Attendance \u2014 ${fmtDate(selD)}<\/title>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <style>\r\n  @page{size:A4 landscape;margin:12mm}\r\n  *{box-sizing:border-box;font-family:'Inter',sans-serif;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}\r\n  body{padding:14px;background:#fff}\r\n  table{width:100%;border-collapse:collapse}\r\n  th,td{border:1px solid #ccc}\r\n  <\/style><\/head><body>\r\n  ${content}\r\n  <script>window.onload=function(){setTimeout(()=>{window.print();setTimeout(()=>window.close(),1500)},400)}<\\\/script>\r\n  <\/body><\/html>`);\r\n  pw.document.close();\r\n};\r\n\r\n\/\/ \u2500\u2500 ATTENDANCE HISTORY \u2500\u2500\r\nlet _histF1='',_histF2='',_histPerson='';\r\nfunction rHistory(){\r\n  const all=SHEETS.AllAttendance||{data:[]};\r\n  const persons=[...new Set(all.data.map(r=>r['Name']).filter(Boolean))].sort();\r\n  let rows=all.data;\r\n  if(_histF1||_histF2){\r\n    rows=rows.filter(r=>{\r\n      const d=parseDate(r['Date']);if(!d)return false;\r\n      const k=dateKey(d);\r\n      if(_histF1&&k<_histF1)return false;\r\n      if(_histF2&&k>_histF2)return false;\r\n      return true;\r\n    });\r\n  }\r\n  if(_histPerson)rows=rows.filter(r=>r['Name']===_histPerson);\r\n  rows=rows.slice().sort((a,b)=>(parseDate(b['Date'])||0)-(parseDate(a['Date'])||0));\r\n\r\n  const done=rows.filter(r=>r['Status']==='On Time'||r['Status']==='Between 9:01-9:10').length;\r\n  const late=rows.filter(r=>r['Status']==='Late').length;\r\n  const absent=rows.filter(r=>r['Status']==='Absent'||r['Status']==='Leave').length;\r\n\r\n  const tbody=rows.slice(0,300).map((r,i)=>`\r\n    <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap\">${r['Date']}<\/td>\r\n      <td>${r['Name']}<\/td>\r\n      <td style=\"color:var(--text3)\">${r['Emp ID']||'\u2014'}<\/td>\r\n      <td>${statusPill(r['Status'])}<\/td>\r\n      <td>${r['Shift Time']||'\u2014'}<\/td>\r\n      <td style=\"color:var(--text3)\">${r['Remarks']||'\u2014'}<\/td>\r\n    <\/tr>`).join('');\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-filter\">\r\n      <label>Person<\/label>\r\n      <select id=\"histp\" onchange=\"hrHistSetPerson(this.value)\"><option value=\"\">All<\/option>${persons.map(p=>`<option value=\"${p}\" ${_histPerson===p?'selected':''}>${p}<\/option>`).join('')}<\/select>\r\n      <label>From<\/label><input type=\"date\" id=\"histf1\" value=\"${_histF1}\">\r\n      <label>To<\/label><input type=\"date\" id=\"histf2\" value=\"${_histF2}\">\r\n      <button class=\"hr-btn\" onclick=\"hrHistApply()\">Apply<\/button>\r\n      <button class=\"hr-rst\" onclick=\"hrHistReset()\">Reset<\/button>\r\n      <span style=\"font-size:11px;color:var(--text3)\">${rows.length} records<\/span>\r\n    <\/div>\r\n    <div class=\"hr-kgrid\">\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">On Time<\/span><span class=\"val\" style=\"color:var(--green)\">${done}<\/span><\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Late<\/span><span class=\"val\" style=\"color:var(--gold)\">${late}<\/span><\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Absent\/Leave<\/span><span class=\"val\" style=\"color:var(--salmon)\">${absent}<\/span><\/div>\r\n    <\/div>\r\n    <div class=\"hr-tblwrap\"><table class=\"hrt\">\r\n      <thead><tr><th>Date<\/th><th>Name<\/th><th>Emp ID<\/th><th>Status<\/th><th>Shift Time<\/th><th>Remarks<\/th><\/tr><\/thead>\r\n      <tbody>${tbody||'<tr><td colspan=\"6\" class=\"hr-empty\">No records for this filter<\/td><\/tr>'}<\/tbody>\r\n    <\/table><\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 EMPLOYEES \u2500\u2500\r\nlet _empDept='',_empStatus='Active';\r\nfunction rEmployees(){\r\n  const em=SHEETS.EmployeeMaster||{data:[]};\r\n  const depts=[...new Set(em.data.map(e=>e['Department']).filter(Boolean))].sort();\r\n  let rows=em.data;\r\n  if(_empDept)rows=rows.filter(e=>e['Department']===_empDept);\r\n  if(_empStatus)rows=rows.filter(e=>e['Employment Status']===_empStatus);\r\n\r\n  const tbody=rows.map((e,i)=>`\r\n    <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td style=\"font-family:'JetBrains Mono',monospace;color:var(--text3)\">${e['Emp ID']||'\u2014'}<\/td>\r\n      <td><div style=\"display:flex;align-items:center;gap:8px\"><div class=\"hr-av av-b\">${ini(e['Name'])}<\/div>${e['Name']}<\/div><\/td>\r\n      <td>${e['Designation']||'\u2014'}<\/td>\r\n      <td>${e['Department']||'\u2014'}<\/td>\r\n      <td>${statusPill(e['Employment Status'])}<\/td>\r\n      <td style=\"font-family:'JetBrains Mono',monospace\">${e['Corporate Mobile']||e['Personal Mobile']||'\u2014'}<\/td>\r\n      <td style=\"color:var(--text3);font-size:11px\">${e['Remarks']||'\u2014'}<\/td>\r\n    <\/tr>`).join('');\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-filter\">\r\n      <label>Department<\/label>\r\n      <select onchange=\"hrEmpSetDept(this.value)\"><option value=\"\">All<\/option>${depts.map(d=>`<option value=\"${d}\" ${_empDept===d?'selected':''}>${d}<\/option>`).join('')}<\/select>\r\n      <label>Status<\/label>\r\n      <select onchange=\"hrEmpSetStatus(this.value)\">\r\n        <option value=\"Active\" ${_empStatus==='Active'?'selected':''}>Active<\/option>\r\n        <option value=\"\" ${_empStatus===''?'selected':''}>All<\/option>\r\n        <option value=\"Inactive\" ${_empStatus==='Inactive'?'selected':''}>Inactive<\/option>\r\n        <option value=\"Resigned\" ${_empStatus==='Resigned'?'selected':''}>Resigned<\/option>\r\n        <option value=\"Terminated\" ${_empStatus==='Terminated'?'selected':''}>Terminated<\/option>\r\n      <\/select>\r\n      <span style=\"font-size:11px;color:var(--text3)\">${rows.length} employees<\/span>\r\n    <\/div>\r\n    <div class=\"hr-tblwrap\"><table class=\"hrt\">\r\n      <thead><tr><th>Emp ID<\/th><th>Name<\/th><th>Designation<\/th><th>Department<\/th><th>Status<\/th><th>Mobile<\/th><th>Remarks<\/th><\/tr><\/thead>\r\n      <tbody>${tbody||'<tr><td colspan=\"7\" class=\"hr-empty\">No employees found<\/td><\/tr>'}<\/tbody>\r\n    <\/table><\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 LEAVE \u2500\u2500\r\nfunction rLeave(){\r\n  const leave=SHEETS.LeaveLedger||{data:[]};\r\n  const pending=leave.data.filter(l=>l['Status']==='Pending').length;\r\n  const approved=leave.data.filter(l=>l['Status']==='Approved').length;\r\n  const rejected=leave.data.filter(l=>l['Status']==='Rejected').length;\r\n\r\n  const tbody=leave.data.slice().reverse().map((l,i)=>`\r\n    <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td>${l['Name']}<\/td>\r\n      <td style=\"color:var(--text3)\">${l['Emp ID']||'\u2014'}<\/td>\r\n      <td>${l['Leave Type']||'\u2014'}<\/td>\r\n      <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${l['From Date']} \u2192 ${l['To Date']}<\/td>\r\n      <td style=\"text-align:center;font-weight:700\">${l['Days']||'\u2014'}<\/td>\r\n      <td>${l['Status']?statusPill(l['Status']):'\u2014'}<\/td>\r\n    <\/tr>`).join('');\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-kgrid\">\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Pending<\/span><span class=\"val\" style=\"color:var(--salmon)\">${pending}<\/span><\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Approved<\/span><span class=\"val\" style=\"color:var(--green)\">${approved}<\/span><\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Rejected<\/span><span class=\"val\" style=\"color:var(--text3)\">${rejected}<\/span><\/div>\r\n      <div class=\"hr-kpi\"><span class=\"lbl\">Total Requests<\/span><span class=\"val\">${leave.data.length}<\/span><\/div>\r\n    <\/div>\r\n    <div class=\"hr-tblwrap\"><table class=\"hrt\">\r\n      <thead><tr><th>Name<\/th><th>Emp ID<\/th><th>Type<\/th><th>Dates<\/th><th>Days<\/th><th>Status<\/th><\/tr><\/thead>\r\n      <tbody>${tbody||'<tr><td colspan=\"6\" class=\"hr-empty\">No leave requests yet<\/td><\/tr>'}<\/tbody>\r\n    <\/table><\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 HR TASKS (daily blocks like Brand & Marketing's work log, + full search) \u2500\u2500\r\nlet _taskFilter='all'; \/\/ all | approval | pending\r\nlet _taskStatus='';\r\nlet _taskSearch='';\r\nlet _taskF1='', _taskF2='';\r\n(function(){ \/\/ default view = last 7 days\r\n  const today=new Date(); const weekAgo=new Date(today); weekAgo.setDate(today.getDate()-6);\r\n  _taskF1=dateKey(weekAgo); _taskF2=dateKey(today);\r\n})();\r\n\r\nfunction setThisWeek_(){\r\n  const today=new Date(); const weekAgo=new Date(today); weekAgo.setDate(today.getDate()-6);\r\n  _taskF1=dateKey(weekAgo); _taskF2=dateKey(today);\r\n  _taskStatus=''; _taskSearch=''; _taskFilter='all';\r\n  rTasks();\r\n}\r\nfunction setAllTime_(){ _taskF1=''; _taskF2=''; rTasks(); }\r\n\r\nfunction rTasks(){\r\n  const tasks=SHEETS.HRTasks||{data:[]};\r\n  let rows=tasks.data;\r\n  if(_taskFilter==='approval')rows=rows.filter(t=>t['Needs Approval']==='Yes');\r\n  if(_taskFilter==='pending')rows=rows.filter(t=>t['Status']==='Pending');\r\n  if(_taskStatus)rows=rows.filter(t=>t['Status']===_taskStatus);\r\n  if(_taskSearch){\r\n    const q=_taskSearch.toLowerCase();\r\n    rows=rows.filter(t=>\r\n      (t['Task\/Activity']||'').toLowerCase().includes(q) ||\r\n      (t['Category']||'').toLowerCase().includes(q) ||\r\n      (t['Outcome']||'').toLowerCase().includes(q) ||\r\n      (t['Remarks']||'').toLowerCase().includes(q)\r\n    );\r\n  }\r\n  if(_taskF1||_taskF2){\r\n    rows=rows.filter(t=>{\r\n      const d=parseDate(t['Date']);if(!d)return false;\r\n      const k=dateKey(d);\r\n      if(_taskF1&&k<_taskF1)return false;\r\n      if(_taskF2&&k>_taskF2)return false;\r\n      return true;\r\n    });\r\n  }\r\n\r\n  const byDate={};\r\n  rows.forEach(t=>{\r\n    const key=t['Date']||'No date';\r\n    if(!byDate[key])byDate[key]=[];\r\n    byDate[key].push(t);\r\n  });\r\n  const dateKeys=Object.keys(byDate).sort((a,b)=>(parseDate(b)||0)-(parseDate(a)||0));\r\n\r\n  const blocksHtml=dateKeys.map(dateStr=>{\r\n    const dayTasks=byDate[dateStr].slice().sort((a,b)=>{\r\n      const pOrder={High:0,Medium:1,Low:2};\r\n      return (pOrder[a['Priority']]??3)-(pOrder[b['Priority']]??3);\r\n    });\r\n    const rowsHtml=dayTasks.map((t,i)=>`\r\n      <div style=\"display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--bg3);background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <span class=\"sdb ${t['Priority']==='High'?'rg':t['Priority']==='Medium'?'yg':'gr'}\" style=\"font-size:9px;min-width:52px;text-align:center;flex-shrink:0\">${t['Priority']||'\u2014'}<\/span>\r\n        <div style=\"flex:1;min-width:0\">\r\n          <div style=\"font-size:10px;color:var(--text3);text-transform:uppercase;font-weight:700;letter-spacing:.03em\">${t['Category']||'\u2014'}<\/div>\r\n          <div style=\"font-size:13px;color:var(--text)\">${t['Task\/Activity']}<\/div>\r\n        <\/div>\r\n        ${t['Status']?statusPill(t['Status']):''}\r\n        ${t['Needs Approval']==='Yes'?`<span class=\"sdb pg\" style=\"flex-shrink:0\">Approval: ${t['Approval Status']||'Pending'}<\/span>`:''}\r\n      <\/div>`).join('');\r\n    return `<div class=\"hr-card\" style=\"padding:0;overflow:hidden;margin-bottom:10px\">\r\n      <div style=\"background:var(--bg3);padding:9px 14px;font-weight:700;font-size:13px;font-family:'JetBrains Mono',monospace\">${dateStr}<\/div>\r\n      ${rowsHtml}\r\n    <\/div>`;\r\n  }).join('')||'<div class=\"hr-empty\">No tasks found for this filter<\/div>';\r\n\r\n  const statusOptions=['','Done','In Progress','Pending','Carried Forward','Cancelled'];\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-subtabs\">\r\n      <button class=\"hr-subtab ${_taskFilter==='all'?'on':''}\" onclick=\"hrTaskSetFilter('all')\">All Tasks<\/button>\r\n      <button class=\"hr-subtab ${_taskFilter==='approval'?'on':''}\" onclick=\"hrTaskSetFilter('approval')\">Needs Management Approval<\/button>\r\n      <button class=\"hr-subtab ${_taskFilter==='pending'?'on':''}\" onclick=\"hrTaskSetFilter('pending')\">Pending<\/button>\r\n    <\/div>\r\n    <div class=\"hr-filter\">\r\n      <input type=\"text\" id=\"tasksearch\" placeholder=\"Search tasks...\" value=\"${_taskSearch}\"\r\n        style=\"flex:1;min-width:160px;background:var(--bg2);border:1.5px solid var(--border);padding:7px 12px;border-radius:8px;font-size:12px;font-family:'Inter',sans-serif;outline:none\"\r\n        oninput=\"hrTaskSearch(this.value)\" \/>\r\n      <label>Status<\/label>\r\n      <select id=\"taskstatus\" onchange=\"hrTaskSetStatus(this.value)\">\r\n        ${statusOptions.map(s=>`<option value=\"${s}\" ${_taskStatus===s?'selected':''}>${s||'All'}<\/option>`).join('')}\r\n      <\/select>\r\n      <label>From<\/label><input type=\"date\" id=\"taskf1\" value=\"${_taskF1}\">\r\n      <label>To<\/label><input type=\"date\" id=\"taskf2\" value=\"${_taskF2}\">\r\n      <button class=\"hr-btn\" onclick=\"hrTaskApply()\">Apply<\/button>\r\n      <button class=\"hr-rst\" onclick=\"setThisWeek_()\">This Week<\/button>\r\n      <button class=\"hr-rst\" onclick=\"setAllTime_()\">All Time<\/button>\r\n      <span style=\"font-size:11px;color:var(--text3)\">${rows.length} task${rows.length!==1?'s':''} \u00b7 ${dateKeys.length} day${dateKeys.length!==1?'s':''}<\/span>\r\n    <\/div>\r\n    ${blocksHtml}`;\r\n}\r\n\r\n\/\/ \u2500\u2500 RECRUITMENT \u2500\u2500\r\nfunction rRecruitment(){\r\n  const rec=SHEETS.Recruitment||{data:[]};\r\n  const stages=['Applied','Shortlisted','Interview Scheduled','Interviewed','Selected','Offer Sent','Joined','Rejected','Withdrawn'];\r\n  const stageCounts={};\r\n  stages.forEach(s=>stageCounts[s]=rec.data.filter(r=>r['Stage']===s).length);\r\n\r\n  const pillsHtml=stages.map(s=>`<span class=\"sdb ${s==='Joined'?'gg':s==='Rejected'||s==='Withdrawn'?'gr':'bg-b'}\">${s}: ${stageCounts[s]}<\/span>`).join(' ');\r\n\r\n  const tbody=rec.data.slice().reverse().map((r,i)=>`\r\n    <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td>${r['Candidate Name']}<\/td>\r\n      <td>${r['Position Applied']||'\u2014'}<\/td>\r\n      <td>${r['Department']||'\u2014'}<\/td>\r\n      <td>${r['Stage']?statusPill(r['Stage']):'\u2014'}<\/td>\r\n      <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Applied Date']||'\u2014'}<\/td>\r\n      <td style=\"color:var(--text3)\">${r['Remarks']||'\u2014'}<\/td>\r\n    <\/tr>`).join('');\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-card\"><div class=\"hr-ctitle\">Pipeline Snapshot<\/div>\r\n      <div style=\"display:flex;flex-wrap:wrap;gap:8px\">${pillsHtml}<\/div>\r\n    <\/div>\r\n    <div class=\"hr-tblwrap\"><table class=\"hrt\">\r\n      <thead><tr><th>Candidate<\/th><th>Position<\/th><th>Department<\/th><th>Stage<\/th><th>Applied<\/th><th>Remarks<\/th><\/tr><\/thead>\r\n      <tbody>${tbody||'<tr><td colspan=\"6\" class=\"hr-empty\">No candidates yet<\/td><\/tr>'}<\/tbody>\r\n    <\/table><\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 LIFECYCLE (Onboarding \/ Probation \/ Performance \/ Exit) \u2500\u2500\r\nlet _lifeSub='onboarding';\r\nfunction rLifecycle(){\r\n  const subtabs=[['onboarding','Onboarding'],['probation','Probation'],['performance','Performance'],['exit','Exit']];\r\n  let content='';\r\n\r\n  if(_lifeSub==='onboarding'){\r\n    const d=(SHEETS.Onboarding||{data:[]}).data;\r\n    content=`<div class=\"hr-tblwrap\"><table class=\"hrt\"><thead><tr><th>Name<\/th><th>Emp ID<\/th><th>Joining<\/th><th>Docs<\/th><th>ID Card<\/th><th>Email<\/th><th>Induction<\/th><th>Buddy<\/th><\/tr><\/thead><tbody>\r\n      ${d.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td>${r['Name']}<\/td><td style=\"color:var(--text3)\">${r['Emp ID']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Joining Date']||'\u2014'}<\/td>\r\n        <td>${r['Documents Collected']==='Yes'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n        <td>${r['ID Card Issued']==='Yes'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n        <td>${r['Email Created']==='Yes'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n        <td>${r['Induction Done']==='Yes'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n        <td style=\"color:var(--text3)\">${r['Assigned Buddy\/Mentor']||'\u2014'}<\/td>\r\n      <\/tr>`).join('')||'<tr><td colspan=\"8\" class=\"hr-empty\">No onboarding records yet<\/td><\/tr>'}\r\n    <\/tbody><\/table><\/div>`;\r\n  } else if(_lifeSub==='probation'){\r\n    const d=(SHEETS.Probation||{data:[]}).data;\r\n    content=`<div class=\"hr-tblwrap\"><table class=\"hrt\"><thead><tr><th>Name<\/th><th>Emp ID<\/th><th>Joining<\/th><th>Period (mo)<\/th><th>Review Due<\/th><th>Outcome<\/th><\/tr><\/thead><tbody>\r\n      ${d.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td>${r['Name']}<\/td><td style=\"color:var(--text3)\">${r['Emp ID']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Joining Date']||'\u2014'}<\/td>\r\n        <td style=\"text-align:center\">${r['Probation Period (Months)']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Review Due Date']||'\u2014'}<\/td>\r\n        <td>${r['Review Outcome']?statusPill(r['Review Outcome']):'\u2014'}<\/td>\r\n      <\/tr>`).join('')||'<tr><td colspan=\"6\" class=\"hr-empty\">No probation records yet<\/td><\/tr>'}\r\n    <\/tbody><\/table><\/div>`;\r\n  } else if(_lifeSub==='performance'){\r\n    const d=(SHEETS.Performance||{data:[]}).data;\r\n    content=`<div class=\"hr-tblwrap\"><table class=\"hrt\"><thead><tr><th>Name<\/th><th>Emp ID<\/th><th>Period<\/th><th>Review Date<\/th><th>KPI Score<\/th><th>Increment<\/th><th>Promotion<\/th><\/tr><\/thead><tbody>\r\n      ${d.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td>${r['Name']}<\/td><td style=\"color:var(--text3)\">${r['Emp ID']||'\u2014'}<\/td>\r\n        <td>${r['Review Period']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Review Date']||'\u2014'}<\/td>\r\n        <td style=\"text-align:center;font-weight:700\">${r['KPI Score (0-100)']||'\u2014'}<\/td>\r\n        <td>${r['Increment % \/ Amount']||'\u2014'}<\/td>\r\n        <td>${r['Promotion (Y\/N)']==='Y'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n      <\/tr>`).join('')||'<tr><td colspan=\"7\" class=\"hr-empty\">No performance records yet<\/td><\/tr>'}\r\n    <\/tbody><\/table><\/div>`;\r\n  } else {\r\n    const d=(SHEETS.Exit||{data:[]}).data;\r\n    content=`<div class=\"hr-tblwrap\"><table class=\"hrt\"><thead><tr><th>Name<\/th><th>Emp ID<\/th><th>Resignation<\/th><th>Last Working<\/th><th>Notice (days)<\/th><th>Clearance<\/th><th>Reason<\/th><\/tr><\/thead><tbody>\r\n      ${d.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td>${r['Name']}<\/td><td style=\"color:var(--text3)\">${r['Emp ID']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Resignation Date']||'\u2014'}<\/td>\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r['Last Working Date']||'\u2014'}<\/td>\r\n        <td style=\"text-align:center\">${r['Notice Period (Days)']||'\u2014'}<\/td>\r\n        <td>${r['Clearance Done']==='Yes'?'<span class=\"sdb gg\">Yes<\/span>':'<span class=\"sdb gr\">No<\/span>'}<\/td>\r\n        <td style=\"color:var(--text3)\">${r['Reason for Leaving']||'\u2014'}<\/td>\r\n      <\/tr>`).join('')||'<tr><td colspan=\"7\" class=\"hr-empty\">No exit records yet<\/td><\/tr>'}\r\n    <\/tbody><\/table><\/div>`;\r\n  }\r\n\r\n  document.getElementById('hr-main').innerHTML=`\r\n    <div class=\"hr-subtabs\">${subtabs.map(([k,l])=>`<button class=\"hr-subtab ${_lifeSub===k?'on':''}\" onclick=\"hrLifeSetSub('${k}')\">${l}<\/button>`).join('')}<\/div>\r\n    ${content}`;\r\n}\r\n\r\n\r\nfunction doRender(tab){\r\n  if(tab==='overview')rOverview();\r\n  else if(tab==='today')rToday();\r\n  else if(tab==='history')rHistory();\r\n  else if(tab==='employees')rEmployees();\r\n  else if(tab==='leave')rLeave();\r\n  else if(tab==='tasks')rTasks();\r\n  else if(tab==='recruitment')rRecruitment();\r\n  else if(tab==='lifecycle')rLifecycle();\r\n}\r\n\r\nwindow.hrLoad=async function(){\r\n  document.getElementById('hr-sync').textContent='Syncing...';\r\n  document.getElementById('hr-main').innerHTML='<div class=\"hr-loading\"><div class=\"hr-spin\"><\/div><span>Loading data...<\/span><\/div>';\r\n  try{\r\n    const sheetNames=['EmployeeMaster','TodaysAttendance','AllAttendance','LeaveLedger','HRTasks','Recruitment','Onboarding','Probation','Performance','Exit','TodaysToDo'];\r\n    const headerKeys={EmployeeMaster:'Emp ID',TodaysAttendance:'Name',AllAttendance:'Date',LeaveLedger:'Name',\r\n      HRTasks:'Date',Recruitment:'Candidate Name',Onboarding:'Name',Probation:'Name',Performance:'Name',Exit:'Name',TodaysToDo:'Category'};\r\n    const results=await Promise.all(sheetNames.map(n=>fetchSheet(n)));\r\n    SHEETS={};\r\n    sheetNames.forEach((n,i)=>{SHEETS[n]=extractTable(results[i], headerKeys[n]);});\r\n    loaded=true;\r\n    const now=new Date();\r\n    document.getElementById('hr-sync').textContent='Updated '+now.toLocaleTimeString('en-GB',{hour:'2-digit',minute:'2-digit'});\r\n    document.getElementById('hr-pagedate').textContent=now.toLocaleDateString('en-GB',{weekday:'long',day:'numeric',month:'long',year:'numeric'});\r\n    document.getElementById('hr-toggle-sub').textContent=(SHEETS.EmployeeMaster.data.length)+' employees \u00b7 Updated '+now.toLocaleTimeString('en-GB',{hour:'2-digit',minute:'2-digit'});\r\n    doRender(currentTab);\r\n  }catch(e){\r\n    document.getElementById('hr-main').innerHTML=`<div class=\"hr-err\">Error loading data: ${e.message}<\/div>`;\r\n    document.getElementById('hr-sync').textContent='Error';\r\n  }\r\n};\r\n\r\nwindow.hrToggle=function(){\r\n  isOpen=!isOpen;\r\n  document.getElementById('hr-panel').classList.toggle('open',isOpen);\r\n  document.getElementById('hr-toggle').classList.toggle('open',isOpen);\r\n  document.getElementById('hr-toggle-sub').textContent=isOpen?'Click to close':'Click to open';\r\n  if(isOpen&&!loaded)hrLoad();\r\n};\r\n\r\nwindow.hrTab=function(tab,btn){\r\n  currentTab=tab;\r\n  document.querySelectorAll('.hr-tab').forEach(b=>b.classList.remove('on'));\r\n  if(btn)btn.classList.add('on');\r\n  if(loaded)doRender(tab);\r\n};\r\n\r\n\/\/ Every inline onclick\/onchange\/oninput calls ONE of these small setter\r\n\/\/ functions, which live inside this closure so they correctly update the\r\n\/\/ real private state variables, then re-render. Nothing outside this block\r\n\/\/ should ever be referenced directly from an inline HTML attribute.\r\nwindow.hrSetGridDate=function(v){_gridDate=v;rToday();};\r\n\r\nwindow.hrHistSetPerson=function(v){_histPerson=v;rHistory();};\r\nwindow.hrHistApply=function(){\r\n  _histPerson=document.getElementById('histp').value;\r\n  _histF1=document.getElementById('histf1').value;\r\n  _histF2=document.getElementById('histf2').value;\r\n  rHistory();\r\n};\r\nwindow.hrHistReset=function(){_histF1='';_histF2='';_histPerson='';rHistory();};\r\n\r\nwindow.hrEmpSetDept=function(v){_empDept=v;rEmployees();};\r\nwindow.hrEmpSetStatus=function(v){_empStatus=v;rEmployees();};\r\n\r\nwindow.hrTaskSetFilter=function(v){_taskFilter=v;rTasks();};\r\nwindow.hrTaskSearch=function(v){_taskSearch=v;rTasks();};\r\nwindow.hrTaskSetStatus=function(v){_taskStatus=v;rTasks();};\r\nwindow.hrTaskApply=function(){\r\n  _taskF1=document.getElementById('taskf1').value;\r\n  _taskF2=document.getElementById('taskf2').value;\r\n  rTasks();\r\n};\r\nwindow.setThisWeek_=setThisWeek_;\r\nwindow.setAllTime_=setAllTime_;\r\n\r\nwindow.hrLifeSetSub=function(v){_lifeSub=v;rLifecycle();};\r\nwindow.showUpcomingInterviews=showUpcomingInterviews;\r\n\r\nsetInterval(()=>{if(isOpen)hrLoad();},5*60*1000);\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5130372 e-flex e-con-boxed e-con e-parent\" data-id=\"5130372\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-96f6328 elementor-widget elementor-widget-html\" data-id=\"96f6328\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Brand & Marketing Dashboard \u2014 Salmon Developers<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n:root{\r\n  --bg:#f5f3ef;--bg2:#ffffff;--bg3:#ede9e3;\r\n  --border:#e2ddd6;--border2:#c8c0b4;\r\n  --text:#1a1612;--text2:#6b6257;--text3:#a89e93;\r\n  --salmon:#e85d3a;--salmon-dark:#c94a28;--salmon-soft:#fdf0ed;--salmon-border:rgba(232,93,58,0.2);\r\n  --green:#2d7a4f;--green-soft:#edf7f1;--green-border:rgba(45,122,79,0.2);\r\n  --blue:#2563eb;--blue-soft:#eff4ff;\r\n  --gold:#b45309;--gold-soft:#fef9ee;\r\n  --purple:#7c3aed;--purple-soft:#f5f3ff;\r\n  --shadow-sm:0 1px 3px rgba(26,22,18,0.08);\r\n  --shadow:0 4px 16px rgba(26,22,18,0.1);\r\n  --shadow-lg:0 8px 32px rgba(26,22,18,0.14);\r\n}\r\n*{margin:0;padding:0;box-sizing:border-box}\r\nbody{font-family:'Inter',sans-serif}\r\n.bm-toggle-btn{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--bg2);border:2px solid var(--border);border-radius:14px;padding:14px 18px;cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;box-shadow:var(--shadow-sm);margin:0}\r\n.bm-toggle-btn:hover{border-color:var(--salmon);box-shadow:var(--shadow)}\r\n.bm-toggle-btn.open{border-color:var(--salmon);border-radius:14px 14px 0 0;background:var(--salmon-soft)}\r\n.bm-toggle-left{display:flex;align-items:center;gap:12px}\r\n.bm-toggle-icon{width:36px;height:36px;background:var(--salmon);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}\r\n.bm-toggle-icon svg{width:18px;height:18px;color:#fff}\r\n.bm-toggle-title{font-size:15px;font-weight:700;color:var(--text)}\r\n.bm-toggle-sub{font-size:11px;color:var(--text3);display:block;margin-top:1px;font-weight:500}\r\n.bm-toggle-right{display:flex;align-items:center;gap:10px}\r\n.bm-live-pill{display:flex;align-items:center;gap:5px;background:var(--green-soft);border:1px solid var(--green-border);border-radius:50px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--green)}\r\n.bm-live-dot{width:6px;height:6px;background:var(--green);border-radius:50%;animation:bm-blink 1.8s infinite}\r\n@keyframes bm-blink{0%,100%{opacity:1}50%{opacity:.3}}\r\n.bm-chevron{font-size:13px;color:var(--text3);transition:transform .3s}\r\n.bm-toggle-btn.open .bm-chevron{transform:rotate(180deg);color:var(--salmon)}\r\n.bm-panel{display:none;background:var(--bg2);border:2px solid var(--salmon);border-top:none;border-radius:0 0 14px 14px;overflow:hidden;box-shadow:var(--shadow-lg);font-family:'Inter',sans-serif}\r\n.bm-panel.open{display:block}\r\n.bm-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:8px;background:var(--bg3)}\r\n.bm-toolbar-info{font-size:12px;color:var(--text3);font-weight:600}\r\n.bm-toolbar-info strong{color:var(--text);font-size:12px}\r\n.bm-toolbar-right{display:flex;align-items:center;gap:8px}\r\n.bm-sync{font-size:11px;color:var(--text2);display:flex;align-items:center;gap:5px;font-weight:600}\r\n.bm-btn{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:6px 13px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}\r\n.bm-btn:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.bm-tabs{display:flex;gap:3px;padding:8px 12px;background:var(--bg2);border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch}\r\n.bm-tab{padding:8px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:var(--text2);transition:all .15s;border:none;background:none;font-family:'Inter',sans-serif;white-space:nowrap;flex-shrink:0}\r\n.bm-tab:hover{color:var(--text);background:var(--bg3)}\r\n.bm-tab.on{background:var(--salmon);color:#fff;box-shadow:0 2px 8px rgba(232,93,58,0.3)}\r\n.bm-main{padding:14px;background:var(--bg)}\r\n.bm-kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px}\r\n.bm-kpi{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:12px 13px;box-shadow:var(--shadow-sm)}\r\n.bm-kpi .lbl{font-size:9px;color:var(--text3);font-weight:700;text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px;display:block}\r\n.bm-kpi .val{font-size:24px;font-weight:700;line-height:1;color:var(--text);display:block}\r\n.bm-kpi .sub{font-size:11px;color:var(--text3);margin-top:5px;display:block;font-weight:500}\r\n.bm-filter{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 0;margin-bottom:10px}\r\n.bm-filter label{font-size:12px;color:var(--text2);font-weight:700}\r\n.bm-filter select,.bm-filter input[type=date]{background:var(--bg2);border:1.5px solid var(--border);color:var(--text);padding:6px 10px;border-radius:8px;font-size:12px;font-family:'Inter',sans-serif;outline:none;cursor:pointer}\r\n.bm-filter select:focus,.bm-filter input:focus{border-color:var(--salmon)}\r\n.bm-apply{background:var(--salmon);color:#fff;border:none;padding:6px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif}\r\n.bm-reset{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif}\r\n.bm-reset:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.bm-subtabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}\r\n.bm-subtab{background:var(--bg2);border:1.5px solid var(--border);color:var(--text2);padding:5px 12px;border-radius:8px;font-size:11px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}\r\n.bm-subtab.on{background:var(--salmon);color:#fff;border-color:var(--salmon)}\r\n.bm-task-block{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:10px;box-shadow:var(--shadow-sm)}\r\n.bm-task-header{background:var(--bg3);padding:10px 13px;display:flex;align-items:center;justify-content:space-between}\r\n.bm-task-name{font-size:13px;font-weight:700;color:var(--text)}\r\n.bm-task-role{font-size:11px;color:var(--text3);margin-top:1px}\r\n.bm-task-date{font-size:10px;font-weight:700;color:var(--salmon-dark);background:var(--salmon-soft);padding:3px 8px;border-radius:20px;border:1px solid var(--salmon-border)}\r\n.bm-task-row{display:flex;align-items:start;justify-content:space-between;gap:8px;padding:8px 13px;border-bottom:1px solid var(--bg3);font-size:12px}\r\n.bm-task-row:last-child{border-bottom:none}\r\n.bm-task-type{font-size:10px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}\r\n.bm-task-desc{color:var(--text);line-height:1.4}\r\n.bm-task-footer{background:var(--bg3);padding:7px 13px;font-size:11px;color:var(--text3);display:flex;justify-content:space-between;align-items:center}\r\n.bm-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}\r\n.av-s{background:var(--salmon-soft);color:var(--salmon-dark);border:1.5px solid var(--salmon-border)}\r\n.av-g{background:var(--green-soft);color:var(--green);border:1.5px solid var(--green-border)}\r\n.av-b{background:var(--blue-soft);color:var(--blue);border:1.5px solid rgba(37,99,235,0.2)}\r\n.av-p{background:var(--purple-soft);color:var(--purple);border:1.5px solid rgba(124,58,237,0.2)}\r\n.sdb{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;font-family:'JetBrains Mono',monospace;white-space:nowrap}\r\n.gg{background:var(--green-soft);color:var(--green);border:1px solid var(--green-border)}\r\n.yg{background:var(--gold-soft);color:var(--gold);border:1px solid rgba(180,83,9,0.15)}\r\n.rg{background:var(--salmon-soft);color:var(--salmon-dark);border:1px solid var(--salmon-border)}\r\n.pg{background:var(--purple-soft);color:var(--purple);border:1px solid rgba(124,58,237,0.15)}\r\n.bg-b{background:var(--blue-soft);color:var(--blue);border:1px solid rgba(37,99,235,0.15)}\r\n.gr{background:var(--bg3);color:var(--text3);border:1px solid var(--border)}\r\n.sig-dot{display:inline-block;width:8px;height:8px;border-radius:50%;vertical-align:middle;margin-right:3px}\r\n.sig-dot.green{background:#16a34a}.sig-dot.red{background:#e8232a}.sig-dot.yellow{background:#ca8a04}\r\n.bm-tblwrap{overflow-x:auto;border-radius:8px;border:1.5px solid var(--border);-webkit-overflow-scrolling:touch;max-width:100%}\r\ntable.bmt{width:100%;border-collapse:collapse;font-size:12px}\r\ntable.bmt thead th{background:var(--bg3);padding:8px 10px;text-align:left;font-weight:700;color:var(--text3);font-size:10px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1.5px solid var(--border);white-space:nowrap}\r\ntable.bmt tbody td{padding:8px 10px;border-bottom:1px solid var(--bg3);color:var(--text)}\r\ntable.bmt tbody tr:last-child td{border-bottom:none}\r\ntable.bmt tbody tr:hover td{background:var(--bg)}\r\n.bm-plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}\r\n.bm-plan-sec{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm)}\r\n.bm-plan-hdr{padding:9px 13px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;display:flex;justify-content:space-between;align-items:center}\r\n.ph-blue{background:var(--blue-soft);color:var(--blue);border-bottom:1px solid rgba(37,99,235,.15)}\r\n.ph-teal{background:var(--green-soft);color:var(--green);border-bottom:1px solid var(--green-border)}\r\n.ph-purple{background:var(--purple-soft);color:var(--purple);border-bottom:1px solid rgba(124,58,237,.15)}\r\n.ph-gold{background:var(--gold-soft);color:var(--gold);border-bottom:1px solid rgba(180,83,9,.15)}\r\n.ph-red{background:var(--salmon-soft);color:var(--salmon-dark);border-bottom:1px solid var(--salmon-border)}\r\n.bm-plan-row{display:flex;align-items:center;justify-content:space-between;padding:7px 13px;border-bottom:1px solid var(--bg3);font-size:12px;gap:8px}\r\n.bm-plan-row:last-child{border-bottom:none}\r\n.bm-plan-item{color:var(--text);flex:1;line-height:1.3}\r\n.bm-plan-meta{font-size:11px;color:var(--text3);white-space:nowrap}\r\n.bm-md-card{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:14px;margin-bottom:12px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow-sm)}\r\n.bm-md-done{background:var(--green-soft);color:var(--green);border:1px solid var(--green-border);padding:6px 14px;border-radius:8px;font-size:12px;font-weight:700}\r\n.bm-md-notdone{background:var(--salmon-soft);color:var(--salmon-dark);border:1px solid var(--salmon-border);padding:6px 14px;border-radius:8px;font-size:12px;font-weight:700}\r\n.bm-warn{background:#fff7ed;border:1.5px solid rgba(234,88,12,.3);border-left:4px solid #ea580c;border-radius:8px;padding:10px 14px;display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:12px;color:#7c2d12;font-weight:600}\r\n.bm-warn.hidden{display:none}\r\n.bm-coming{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:40px;text-align:center;color:var(--text3);font-size:13px}\r\n.bm-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;color:var(--text3);gap:10px}\r\n.bm-spin{width:24px;height:24px;border:2.5px solid var(--border);border-top-color:var(--salmon);border-radius:50%;animation:bm-spin .7s linear infinite}\r\n@keyframes bm-spin{to{transform:rotate(360deg)}}\r\n.bm-err{background:var(--salmon-soft);border:1.5px solid var(--salmon-border);border-radius:8px;padding:13px;color:var(--salmon-dark);font-size:13px;text-align:center;font-weight:600}\r\n.bm-view-btn{background:none;border:1px solid var(--border);color:var(--text3);font-size:11px;padding:3px 9px;border-radius:6px;cursor:pointer;font-family:'Inter',sans-serif}\r\n.bm-view-btn:hover{border-color:var(--salmon);color:var(--salmon)}\r\n.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:8px}\r\n.cal-head{font-size:10px;font-weight:700;text-align:center;padding:5px 2px;color:var(--text3);text-transform:uppercase;letter-spacing:.04em}\r\n.cal-day{background:var(--bg2);border:1.5px solid var(--border);border-radius:6px;padding:5px;min-height:65px;font-size:10px}\r\n.cal-day.wkend{background:#fdf8f6}\r\n.cal-day.empty{background:transparent;border:none;min-height:0}\r\n.cal-date{font-weight:700;font-size:11px;color:var(--text2);margin-bottom:3px}\r\n.cal-entry{font-size:10px;font-weight:600;padding:2px 5px;border-radius:4px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-left:3px solid}\r\n@media(max-width:480px){.bm-kgrid{grid-template-columns:1fr 1fr}.bm-kpi .val{font-size:18px}.bm-plan-grid{grid-template-columns:1fr}.cal-grid{gap:2px}.cal-day{min-height:50px;padding:3px}.cal-head{font-size:9px}}\r\n\r\n.bm-share-btn{display:none}\r\n.bm-g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}\r\n@media(max-width:640px){.bm-g2{grid-template-columns:1fr}}\r\n\r\n@keyframes donutGrow{from{stroke-dasharray:0 9999;opacity:0}to{opacity:1}}\r\n[class^=\"donut-arc-\"]{animation:donutFade .6s ease both}\r\n@keyframes donutFade{from{opacity:0;transform:scale(.85);transform-origin:center}to{opacity:1;transform:scale(1)}}\r\n.bm-card svg circle{transition:opacity .15s}\r\n.bm-card svg circle:hover{opacity:.78}\r\n<\/style>\r\n\r\n<div id=\"bm-root\">\r\n  <button class=\"bm-toggle-btn\" id=\"bm-toggle\" onclick=\"bmToggle()\">\r\n    <div class=\"bm-toggle-left\">\r\n      <div class=\"bm-toggle-icon\">\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 20h.01M7 20v-4M12 20v-8M17 20V4M22 20h.01\"\/><\/svg>\r\n      <\/div>\r\n      <div>\r\n        <div class=\"bm-toggle-title\">Brand & Marketing Dashboard<\/div>\r\n        <span class=\"bm-toggle-sub\" id=\"bm-toggle-sub\">Click to open<\/span>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"bm-toggle-right\">\r\n      <div class=\"bm-live-pill\"><div class=\"bm-live-dot\"><\/div>Live<\/div>\r\n      <span class=\"bm-chevron\">\u25bc<\/span>\r\n    <\/div>\r\n  <\/button>\r\n\r\n  <div class=\"bm-panel\" id=\"bm-panel\">\r\n    <div class=\"bm-toolbar\">\r\n      <div class=\"bm-toolbar-info\"><strong id=\"bm-pagedate\">Loading...<\/strong><\/div>\r\n      <div class=\"bm-toolbar-right\">\r\n        <div class=\"bm-sync\"><div class=\"bm-live-dot\"><\/div><span id=\"bm-sync\">Loading...<\/span><\/div>\r\n        <button class=\"bm-btn\" onclick=\"bmLoad()\">Refresh<\/button>\r\n        <button class=\"bm-btn\" onclick=\"bmPrint()\" style=\"background:var(--salmon);color:#fff;border-color:var(--salmon)\">PDF<\/button>\r\n        <button class=\"bm-btn bm-share-btn\" onclick=\"bmShare()\" style=\"background:#e8232a;color:#fff;border-color:#e8232a;display:none\">Share<\/button>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"bm-tabs\" id=\"bm-tabs-bar\">\r\n      <button class=\"bm-tab on\" onclick=\"bmTab('overview',this)\">Overview<\/button>\r\n      <button class=\"bm-tab\" onclick=\"bmTab('insights',this)\">Insights<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-orin\" onclick=\"bmTab('orin',this)\">Mr. Orin<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-nishit\" onclick=\"bmTab('nishit',this)\">Mr. Nishit<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-sakib\" onclick=\"bmTab('sakib',this)\">Mr. Sakib<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-sagon\" onclick=\"bmTab('sagon',this)\">Mr. Sagon<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-riyad\" onclick=\"bmTab('riyad',this)\">Mr. Riyad<\/button>\r\n      <button class=\"bm-tab\" id=\"bm-tabbtn-afruza\" onclick=\"bmTab('afruza',this)\">Mrs. Afruza<\/button>\r\n      <button class=\"bm-tab\" onclick=\"bmTab('monthly',this)\">Monthly Plan<\/button>\r\n      <button class=\"bm-tab\" onclick=\"bmTab('report',this)\">Report<\/button>\r\n      <button class=\"bm-tab\" onclick=\"bmTab('team',this)\">Team<\/button>\r\n    <\/div>\r\n    <div class=\"bm-main\" id=\"bm-main\">\r\n      <div class=\"bm-loading\"><div class=\"bm-spin\"><\/div><span>Loading...<\/span><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2pdf.js\/0.10.1\/html2pdf.bundle.min.js\"><\/script>\r\n<script>\r\n(function(){\r\n'use strict';\r\nconst PROXY='https:\/\/script.google.com\/macros\/s\/AKfycbxIgRgLaST9F30UwiI0Bln5wdVLdKCDB4-Hpp__YAWi7rPBu54xEJgtB-3pYYrDEKnT\/exec';\r\nconst HR_PROXY='https:\/\/script.google.com\/macros\/s\/AKfycbzTaarHHDvIJE0WNz7djT135QOwz5RkakgDI1YRbDSEOEm4fV1y-Zd8NCn72Bz5tu9x\/exec';\r\n\r\n\/\/ Sheet IDs\r\nconst GIDS={\r\n  orin_jul_plan:  '1345412125',\r\n  orin_jun_plan:  '2139108562',\r\n  orin_apr_plan:  '313465679',\r\n  nishit_jul_plan:'1127672766',\r\n  nishit_jun_plan:'965846082',\r\n  nishit_may_plan:'1761002928',\r\n  nishit_may_rep: '154256663',\r\n  sagon_jul_cal:  '1816689309',\r\n  sagon_jun_cal:  '471588132',\r\n  sagon_may_cal:  '48335536',\r\n  sagon_apr_cal:  '1522418039',\r\n  \/\/ Daily To-Do tabs (live, not-yet-archived tasks)\r\n  orin_todo:      '744926543',\r\n  sagon_todo:     '609445858',\r\n  nishit_todo:    '1230936753',\r\n  sakib_todo:     '933748783',\r\n  riyad_todo:     '1513673395',\r\n  afruza_todo:    '1296603624',\r\n  \/\/ Mr. Sakib's Lead Cost & Count tracking\r\n  sakib_todaylead:'119292160',\r\n  sakib_leadlog:  '1271416260',\r\n  \/\/ Daily Work Log tabs \u2014 explicit gids (no-gid default broke once each\r\n  \/\/ file gained extra tabs; these are each person's real, verified gid)\r\n  orin_daily:     '144714510',\r\n  sagon_daily:    '617733248',\r\n  nishit_daily:   '1202912252',\r\n  sakib_daily:    '1627442645',\r\n  riyad_daily:    '2092333763',\r\n  afruza_daily:   '775861216',\r\n};\r\n\r\n\/\/ Sakib and Riyad now do their daily work inside the SALES dashboard's\r\n\/\/ DailyToDo system (they're Najmus Sakib \/ Md. Riad Mia there). Their\r\n\/\/ custom tasks should still show here exactly as before \u2014 only the 10\r\n\/\/ fixed Google-Form metric rows are excluded, since those already live\r\n\/\/ on the Sales Dashboard.\r\nconst SALES_TODO_URLS={\r\n  sakib:'https:\/\/script.google.com\/macros\/s\/AKfycbyY0XODNjgQM5wiReougffmyZub6ZCgyM7clJqthUyHAKL5kBkY1AjaiAuZT_o58JTvZQ\/exec',\r\n  riyad:'https:\/\/script.google.com\/macros\/s\/AKfycbx4MClXagprtxRxdsDFbLpqcHNOKAlM5-7Q9dNM6CUkHFIgUgg5ZRHkMxjgRLVfTTmP\/exec',\r\n};\r\n\r\nconst MEMBERS=[\r\n  {id:'orin',  empId:'E001', name:'Mr. Orin',   role:'Brand Marketing Manager',       av:'av-s', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/06\/Mr.-Orin.png'},\r\n  {id:'nishit',empId:'176', name:'Sirajul Islam', role:'Sr. Executive \u2014 Digital Marketing',av:'av-g', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/09\/WhatsApp-Image-2026-09-14-at-9.58.27-AM.jpeg'},\r\n  {id:'sakib', empId:'E003', name:'Mr. Sakib',  role:'Sr. Executive \u2014 Comm. & CRM',   av:'av-b', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/06\/Mr.-Sakib.png'},\r\n  {id:'sagon', empId:'E004', name:'Mr. Sagon',  role:'Designer',                       av:'av-p', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/06\/Mr.-Sagor.png'},\r\n  {id:'riyad', empId:'E005', name:'Mr. Riyad',  role:'Lead Response Executive',        av:'av-g', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-05-07-at-3.01.50-PM.jpeg'},\r\n  {id:'afruza',empId:'E006', name:'Mrs. Afruza',role:'Lead Response Executive',        av:'av-p', photo:'https:\/\/organogramtree.salmondevelopersbd.com\/wp-content\/uploads\/2026\/06\/mrs.-Afruza.png'},\r\n];\r\n\r\n\/\/ Sync display name + designation live from the Employee List sheet (matched by Emp ID).\r\n\/\/ id\/photo\/av stay fixed so nothing else (gids, proxy calls, plan logic) is affected.\r\nfunction syncMembersFromEmpList(){\r\n  if(!empRows||empRows.length<2)return;\r\n  MEMBERS.forEach(m=>{\r\n    const row=empRows.slice(1).find(r=>(r[0]||'').trim()===m.empId);\r\n    if(row){\r\n      if((row[1]||'').trim())m.name=row[1].trim();\r\n      if((row[2]||'').trim())m.role=row[2].trim();\r\n      m.status=(row[11]||'Active').trim();\r\n    }else{\r\n      m.status=m.status||'Active'; \/\/ no matching row found \u2014 default to Active rather than hiding by mistake\r\n    }\r\n    const btn=document.getElementById('bm-tabbtn-'+m.id);\r\n    if(btn){\r\n      btn.textContent=m.name;\r\n      const active=m.status==='Active';\r\n      btn.style.display=active?'':'none';\r\n      if(!active&&currentTab===m.id)bmTab('overview',document.querySelector('.bm-tab'));\r\n    }\r\n  });\r\n}\r\n\/\/ Only Active people should appear anywhere on the dashboard (Overview cards,\r\n\/\/ Today's Status, donut charts, Insights). Resigned\/Inactive\/Terminated people\r\n\/\/ are hidden entirely, but their historical task data is left untouched.\r\nfunction activeMembers(){\r\n  return MEMBERS.filter(m=>m.status==='Active');\r\n}\r\n\r\nlet allTasks={},empRows=[],mdApproved=false,\r\n    rawOrin=[],rawNishit=[],rawSagon=[],\r\n    nishitPlanRows={},nishitRepRows={},sagorCalRows={},orinPlanRows={},\r\n    todaysToDo={orin:[],nishit:[],sakib:[],sagon:[],riyad:[],afruza:[]},\r\n    sakibTodayLead=[],sakibLeadLog=[],\r\n    brandAttendance=[],\r\n    currentTab='overview',isOpen=false,loaded=false,\r\n    ovFilter='all',\r\n    dailyFilters={person:'all',status:'all',month:'Jun'},\r\n    ovDateF1='',ovDateF2='';\r\n\r\nfunction ini(n){return(n||'').split(' ').filter(w=>w.length>1).map(w=>w[0]).join('').toUpperCase().slice(0,2);}\r\nfunction ft(d){return d.toLocaleTimeString('en-GB',{hour:'2-digit',minute:'2-digit'});}\r\nfunction pill(s){\r\n  const m={'Done':'gg','In Progress':'yg','Pending':'rg','Carried Forward':'pg','Cancelled':'gr'};\r\n  return`<span class=\"sdb ${m[s]||'gr'}\">${s||'\u2014'}<\/span>`;\r\n}\r\nfunction linkify(text){\r\n  if(!text)return '\u2014';\r\n  const urlRe=\/(https?:\\\/\\\/[^\\s,]+)\/g;\r\n  return text.replace(urlRe, url=>{\r\n    const display=url.length>45?url.slice(0,42)+'...':url;\r\n    return `<a href=\"${url}\" target=\"_blank\" rel=\"noopener\" style=\"color:var(--blue);text-decoration:underline\">${display}<\/a>`;\r\n  });\r\n}\r\n\r\n\/\/ \u2500\u2500 MODERN DONUT CHART (pure SVG, no external library) \u2500\u2500\r\n\/\/ segments: [{label, value, color, onclick?}]\r\nlet _donutSeq=0;\r\nfunction donutChart(title, segments, opts){\r\n  opts=opts||{};\r\n  const size=opts.size||190;\r\n  const stroke=opts.stroke||26;\r\n  const r=(size-stroke)\/2;\r\n  const cx=size\/2, cy=size\/2;\r\n  const circ=2*Math.PI*r;\r\n  const total=segments.reduce((s,x)=>s+(x.value||0),0);\r\n  const uid='dn'+(_donutSeq++);\r\n\r\n  let offset=0;\r\n  const arcs=segments.filter(s=>s.value>0).map((s,i)=>{\r\n    const frac=total>0?s.value\/total:0;\r\n    const dash=frac*circ;\r\n    const gap=circ-dash;\r\n    const rot=(offset\/total)*360-90;\r\n    offset+=s.value;\r\n    const clickable=s.onclick?`style=\"cursor:pointer\" onclick=\"${s.onclick}\"`:'';\r\n    return `<circle cx=\"${cx}\" cy=\"${cy}\" r=\"${r}\" fill=\"none\" stroke=\"${s.color}\" stroke-width=\"${stroke}\"\r\n      stroke-dasharray=\"${dash} ${gap}\" transform=\"rotate(${rot} ${cx} ${cy})\"\r\n      stroke-linecap=\"butt\" ${clickable} class=\"donut-arc-${uid}\">\r\n      <title>${s.label}: ${s.value} (${total>0?Math.round(frac*100):0}%)<\/title>\r\n    <\/circle>`;\r\n  }).join('');\r\n\r\n  const legend=segments.map(s=>{\r\n    const pct=total>0?Math.round((s.value\/total)*100):0;\r\n    const clickable=s.onclick?`style=\"cursor:pointer\" onclick=\"${s.onclick}\"`:'';\r\n    return `<div style=\"display:flex;align-items:center;gap:7px;padding:4px 0\" ${clickable}>\r\n      <span style=\"width:9px;height:9px;border-radius:3px;background:${s.color};flex-shrink:0\"><\/span>\r\n      <span style=\"flex:1;font-size:12px;color:var(--text2)\">${s.label}<\/span>\r\n      <span style=\"font-size:12px;font-weight:700;color:var(--text)\">${s.value}<\/span>\r\n      <span style=\"font-size:10px;color:var(--text3);width:32px;text-align:right\">${pct}%<\/span>\r\n    <\/div>`;\r\n  }).join('');\r\n\r\n  return `<div class=\"bm-card\" style=\"margin-bottom:12px\">\r\n    <div class=\"bm-ctitle\">${title}<\/div>\r\n    <div style=\"display:flex;align-items:center;gap:20px;flex-wrap:wrap\">\r\n      <div style=\"position:relative;width:${size}px;height:${size}px;flex-shrink:0\">\r\n        <svg width=\"${size}\" height=\"${size}\" viewBox=\"0 0 ${size} ${size}\" style=\"filter:drop-shadow(0 2px 6px rgba(0,0,0,.06))\">\r\n          <circle cx=\"${cx}\" cy=\"${cy}\" r=\"${r}\" fill=\"none\" stroke=\"var(--bg3)\" stroke-width=\"${stroke}\"><\/circle>\r\n          ${total>0?arcs:''}\r\n        <\/svg>\r\n        <div style=\"position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center\">\r\n          <span style=\"font-size:22px;font-weight:800;color:var(--text)\">${total}<\/span>\r\n          <span style=\"font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.04em\">Total<\/span>\r\n        <\/div>\r\n      <\/div>\r\n      <div style=\"flex:1;min-width:140px\">${legend||'<div style=\"font-size:12px;color:var(--text3)\">No data<\/div>'}<\/div>\r\n    <\/div>\r\n  <\/div>`;\r\n}\r\n\r\nfunction parseTaskDate(d){\r\n  if(!d)return null;\r\n  d=d.trim();\r\n  \/\/ ISO: 2026-08-16 (used by the new Sales ToDo sheets)\r\n  let m=d.match(\/^(\\d{4})-(\\d{1,2})-(\\d{1,2})\/);\r\n  if(m)return new Date(+m[1],+m[2]-1,+m[3]);\r\n  \/\/ Format: 6\/10\/2026 or 06\/10\/2026\r\n  m=d.match(\/^(\\d{1,2})\\\/(\\d{1,2})\\\/(\\d{4})$\/);\r\n  if(m)return new Date(+m[3],+m[1]-1,+m[2]);\r\n  \/\/ Format: 19-May or 19-May-2026\r\n  m=d.match(\/^(\\d{1,2})-([A-Za-z]{3})\/);\r\n  if(m){\r\n    const mons={jan:0,feb:1,mar:2,apr:3,may:4,jun:5,jul:6,aug:7,sep:8,oct:9,nov:10,dec:11};\r\n    const mo=mons[m[2].toLowerCase()];\r\n    if(mo!==undefined)return new Date(new Date().getFullYear(),mo,+m[1]);\r\n  }\r\n  return null;\r\n}\r\nfunction dayDiff(d){\r\n  if(!d)return 999;\r\n  const now=new Date();now.setHours(0,0,0,0);\r\n  const dd=new Date(d);dd.setHours(0,0,0,0);\r\n  return Math.round((now-dd)\/(1000*60*60*24));\r\n}\r\n\r\nfunction parseCSV(text){\r\n  if(!text||text.startsWith('Error')||text.startsWith('Invalid'))return[];\r\n  const rows=[];\r\n  let row=[],cur='',inQ=false;\r\n  for(let i=0;i<text.length;i++){\r\n    const ch=text[i];\r\n    if(inQ){\r\n      if(ch==='\"'){\r\n        if(text[i+1]==='\"'){cur+='\"';i++;}\r\n        else inQ=false;\r\n      } else cur+=ch;\r\n    } else {\r\n      if(ch==='\"')inQ=true;\r\n      else if(ch===','){row.push(cur.trim());cur='';}\r\n      else if(ch==='\\r'){\/* ignore *\/}\r\n      else if(ch==='\\n'){row.push(cur.trim());rows.push(row);row=[];cur='';}\r\n      else cur+=ch;\r\n    }\r\n  }\r\n  if(cur!==''||row.length>0){row.push(cur.trim());rows.push(row);}\r\n  return rows;\r\n}\r\n\r\nasync function fetchSheet(sheet,gid=''){\r\n  try{\r\n    let url=PROXY+'?sheet='+sheet+'&nocache='+Date.now();\r\n    if(gid)url+='&gid='+gid;\r\n    const r=await fetch(url);\r\n    return parseCSV(await r.text());\r\n  }catch(e){return[];}\r\n}\r\n\r\n\/\/ \u2500\u2500 Fetch a tab by NAME instead of gid (v2 proxy) \u2014 this is what makes\r\n\/\/ new months work with zero manual setup. Returns [] if the tab doesn't\r\n\/\/ exist (e.g. a month that hasn't been created yet) rather than throwing,\r\n\/\/ so callers can just treat \"no data\" the same as any other empty month.\r\n\/\/ Cached per session since the same tab may be requested more than once\r\n\/\/ (switching subtabs, re-rendering on search, etc.) \u2014 this is a small\r\n\/\/ dashboard-side memory cache, separate from the \"nocache\" busting used\r\n\/\/ for the always-changing Daily Work Log \/ DailyToDo fetches above.\r\nconst _tabFetchCache={};\r\nasync function fetchSheetByTab(sheet,tabName){\r\n  const key=sheet+'|'+tabName;\r\n  if(_tabFetchCache[key])return _tabFetchCache[key];\r\n  try{\r\n    const url=PROXY+'?sheet='+sheet+'&tab='+encodeURIComponent(tabName)+'&nocache='+Date.now();\r\n    const r=await fetch(url);\r\n    const text=await r.text();\r\n    \/\/ v2 proxy returns JSON like {\"error\":\"Tab not found: X\"} when the\r\n    \/\/ tab doesn't exist \u2014 treat that the same as an empty result.\r\n    if(text.trim().startsWith('{')&&text.includes('\"error\"')){\r\n      _tabFetchCache[key]=[];\r\n      return[];\r\n    }\r\n    const rows=parseCSV(text);\r\n    _tabFetchCache[key]=rows;\r\n    return rows;\r\n  }catch(e){return[];}\r\n}\r\n\r\n\/\/ Nishit's monthly Plan tab has used two naming styles historically:\r\n\/\/ \"Aug Plan 2026\" (current, with year) and \"Jul Plan\" (older, no year).\r\n\/\/ Try the with-year form first, fall back to the no-year form so old\r\n\/\/ months still resolve correctly.\r\nasync function fetchNishitPlanForMonth(monthDate){\r\n  const monthAbbr=monthDate.toLocaleDateString('en-US',{month:'short'});\r\n  const year=monthDate.getFullYear();\r\n  let rows=await fetchSheetByTab('nishit',`${monthAbbr} Plan ${year}`);\r\n  if(rows.length===0)rows=await fetchSheetByTab('nishit',`${monthAbbr} Plan`);\r\n  return rows;\r\n}\r\n\r\n\r\n\/\/ \u2500\u2500 Generic JSONP loader for the Sales ToDo sheets (separate Apps Script\r\n\/\/ deployments \u2014 cross-origin, so a <script> tag callback is used instead\r\n\/\/ of fetch() to avoid CORS issues). \u2500\u2500\r\nfunction loadJSONP(url){\r\n  return new Promise(function(resolve){\r\n    if(!url){resolve(null);return;}\r\n    var cbName='_bmJsonp_'+Date.now()+'_'+Math.floor(Math.random()*1e6);\r\n    var done=false;\r\n    function finish(v){if(done)return;done=true;resolve(v);delete window[cbName];if(script.parentNode)script.remove();}\r\n    window[cbName]=function(data){finish(data);};\r\n    var script=document.createElement('script');\r\n    script.src=url+(url.indexOf('?')>-1?'&':'?')+'callback='+cbName;\r\n    script.onerror=function(){finish(null);};\r\n    document.body.appendChild(script);\r\n    setTimeout(function(){finish(null);},8000);\r\n  });\r\n}\r\n\/\/ Converts a Sales ToDo sheet's \"tasks\" (custom, non-metric entries) into\r\n\/\/ the shape this dashboard's Today's-To-Do cards expect.\r\nfunction salesTasksToTodaysToDo(tasks,hasCount){\r\n  return (tasks||[]).map(t=>({\r\n    workType:t.category||'',\r\n    task:t.task||'',\r\n    count:hasCount?(t.finalCount||''):'',\r\n    priority:'',\r\n    status:t.status||'',\r\n    remarks:t.outcome||''\r\n  }));\r\n}\r\n\/\/ Converts a Sales ToDo sheet's range\/archive \"tasks\" into this dashboard's\r\n\/\/ Daily Work Log archive row shape.\r\nfunction salesTasksToArchive(tasks,personName,hasCount){\r\n  return (tasks||[]).map(t=>({\r\n    date:t.date||'',\r\n    person:personName,\r\n    workType:t.category||'',\r\n    task:t.task||'',\r\n    count:hasCount?(t.finalCount||''):'',\r\n    status:t.status||'',\r\n    outcome:t.outcome||''\r\n  }));\r\n}\r\n\r\nfunction extractTasks(rows,personNameOrFn,hasCount){\r\n  \/\/ personNameOrFn: either a fixed name string (normal case), or a function\r\n  \/\/ (dateStr)=>name for a seat that changed hands mid-history \u2014 lets past\r\n  \/\/ rows keep the outgoing person's name while new rows get the incoming\r\n  \/\/ person's name, based on each row's own date. See NAME_TRANSITIONS below.\r\n  const getName=typeof personNameOrFn==='function'?personNameOrFn:(()=>personNameOrFn);\r\n  \/\/ hasCount=true for Lead Response sheets (Afruza\/Riyad) which have Count\/Number at col 3\r\n  \/\/ shifting Purpose(4), AssignedBy(5), Priority(6), Status(7), Outcome(8)\r\n  const tasks=[];let curDate='',active=false;\r\n  for(const row of rows){\r\n    const c0=(row[0]||'').trim(),c1=(row[1]||'').trim(),c2=(row[2]||'').trim();\r\n    const c7=(row[7]||'').trim();\r\n    const count=hasCount?(row[3]||'').toString().trim():'';\r\n    const outcome=hasCount?(row[8]||'').trim():(row[5]||'').trim();\r\n    if(!c0&&!c1&&!c2)continue;\r\n    if(c0==='Date'||c1==='Work Type')continue;\r\n    if(c0.includes('DAILY')||c0.includes('Current')||c0.includes('\u26a0')||c0.includes('Salmon Dev'))continue;\r\n    if(c0.includes('\u25b8')){active=true;continue;}\r\n    if(c0.toUpperCase().match(\/JUNE|MAY|APRIL|MARCH|JULY|AUGUST|SEPT|OCT|NOV|DEC|JAN|FEB\/)){active=true;continue;}\r\n    if(!active)continue;\r\n    if(c0&&!c0.startsWith('\u25b8'))curDate=c0;\r\n    if(c2&&c2.length>2&&c1&&c1.length>1){\r\n      tasks.push({date:curDate,person:getName(curDate),workType:c1,task:c2,count:count,status:c7||'',outcome:outcome});\r\n    }\r\n  }\r\n  return tasks;\r\n}\r\n\r\n\/\/ \u2500\u2500 Seat handovers: when one person's role is taken over by someone else,\r\n\/\/ the Daily Work Log itself has no per-row name \u2014 extractTasks() above\r\n\/\/ normally just stamps one fixed name on every row. For a seat that changed\r\n\/\/ hands, add an entry here instead so past rows keep the outgoing person's\r\n\/\/ name and new rows get the incoming person's name, split by date.\r\n\/\/ cutover date is INCLUSIVE for the new person (that day onward = new name).\r\nconst NAME_TRANSITIONS={\r\n  nishit:{cutover:new Date(2026,8,14),oldName:'Mr. Nishit',newName:'Sirajul Islam'}, \/\/ Sep 14, 2026 onward = Sirajul\r\n};\r\nfunction personNameForId(id,fallbackName){\r\n  const tr=NAME_TRANSITIONS[id];\r\n  if(!tr)return fallbackName;\r\n  return (dateStr)=>{\r\n    const d=parseTaskDate(dateStr);\r\n    return (d&&d>=tr.cutover)?tr.newName:tr.oldName;\r\n  };\r\n}\r\n\r\nfunction checkMD(rows){\r\n  for(const row of rows)for(const cell of row){const v=(cell||'').trim().toUpperCase();if(v==='DONE')return true;if(v==='NOT DONE')return false;}\r\n  return false;\r\n}\r\n\r\n\/\/ \u2500\u2500 DAILY TO-DO (live, not-yet-archived tasks) \u2500\u2500\r\n\/\/ Same layout across all 6 people: Work Type \/ Task col0-1, Status always\r\n\/\/ at column index 6 whether the sheet has 10 or 12 columns (Afruza\/Riyad\r\n\/\/ have two extra fields \u2014 Count\/Number, Purpose \u2014 inserted before Status,\r\n\/\/ verified against each person's actual setup script column order).\r\nfunction extractDailyToDo(rows, hasCount){\r\n  const hIdx=rows.findIndex(r=>{\r\n    const c0=(r[0]||'').trim();\r\n    return c0==='Work Type'||c0==='Area \/ Platform';\r\n  });\r\n  if(hIdx===-1)return[];\r\n  return rows.slice(hIdx+1)\r\n    .filter(r=>(r[1]||'').trim().length>1) \/\/ has a real task description\r\n    .map(r=>{\r\n      if(hasCount){\r\n        return{workType:(r[0]||'').trim(),task:(r[1]||'').trim(),count:(r[2]||'').trim(),\r\n          priority:(r[5]||'').trim(),status:(r[6]||'').trim(),remarks:(r[11]||'').trim()};\r\n      }\r\n      return{workType:(r[0]||'').trim(),task:(r[1]||'').trim(),\r\n        priority:(r[3]||'').trim(),status:(r[6]||'').trim(),remarks:(r[9]||'').trim()};\r\n    });\r\n}\r\n\r\n\/\/ \u2500\u2500 SAKIB'S LEAD COST & COUNT \u2500\u2500\r\nfunction extractTodaysLeadCost(rows){\r\n  const hIdx=rows.findIndex(r=>(r[0]||'').trim()==='Platform');\r\n  if(hIdx===-1)return[];\r\n  return rows.slice(hIdx+1)\r\n    .filter(r=>(r[0]||'').trim())\r\n    .map(r=>({platform:(r[0]||'').trim(),cost:(r[1]||'').trim(),leads:(r[2]||'').trim(),remarks:(r[3]||'').trim()}));\r\n}\r\nfunction extractLeadCostLog(rows){\r\n  const hIdx=rows.findIndex(r=>(r[0]||'').trim()==='Date');\r\n  if(hIdx===-1)return[];\r\n  return rows.slice(hIdx+1)\r\n    .filter(r=>(r[1]||'').trim())\r\n    .map(r=>({date:(r[0]||'').trim(),platform:(r[1]||'').trim(),cost:(r[2]||'').trim(),leads:(r[3]||'').trim(),remarks:(r[4]||'').trim()}));\r\n}\r\n\r\n\/\/ \u2500\u2500 HR INTEGRATION: today's attendance for Brand & Marketing department only \u2500\u2500\r\nfunction parseHRRawCSV(text){\r\n  if(!text)return[];\r\n  const lines=text.split('\\n');\r\n  return lines.map(line=>{\r\n    const cols=[];let cur='',inQ=false;\r\n    for(let i=0;i<line.length;i++){\r\n      const ch=line[i];\r\n      if(ch==='\"'){ if(inQ&&line[i+1]==='\"'){cur+='\"';i++;} else inQ=!inQ; }\r\n      else if(ch===','&&!inQ){cols.push(cur);cur='';}\r\n      else cur+=ch;\r\n    }\r\n    cols.push(cur);\r\n    return cols;\r\n  });\r\n}\r\nfunction extractHRTable(rows, headerMatch){\r\n  const hIdx=rows.findIndex(r=>(r[0]||'').trim()===headerMatch);\r\n  if(hIdx===-1)return[];\r\n  const headers=rows[hIdx].map(h=>(h||'').trim());\r\n  return rows.slice(hIdx+1)\r\n    .filter(r=>r.some(c=>(c||'').trim()))\r\n    .map(r=>{const obj={};headers.forEach((h,i)=>obj[h]=(r[i]||'').trim());return obj;});\r\n}\r\nasync function fetchHRSheet(sheetName, headerMatch){\r\n  try{\r\n    const r=await fetch(HR_PROXY+'?sheet='+encodeURIComponent(sheetName)+'&nocache='+Date.now());\r\n    return extractHRTable(parseHRRawCSV(await r.text()), headerMatch);\r\n  }catch(e){return[];}\r\n}\r\nasync function loadBrandAttendance(){\r\n  try{\r\n    const [employees, todayAtt]=await Promise.all([\r\n      fetchHRSheet('EmployeeMaster','Emp ID'),\r\n      fetchHRSheet('TodaysAttendance','Name'),\r\n    ]);\r\n    const brandActive=employees.filter(e=>e['Department']==='Brand & Marketing' && e['Employment Status']==='Active');\r\n    const statusToday={};\r\n    todayAtt.forEach(r=>{ if(r['Name']&&r['Status']) statusToday[r['Name']]=r['Status']; });\r\n    return brandActive.map(e=>({name:e['Name'],designation:e['Designation'],status:statusToday[e['Name']]||''}));\r\n  }catch(e){\r\n    console.error('Brand attendance fetch failed:',e);\r\n    return[];\r\n  }\r\n}\r\n\r\nfunction renderPlanSections(sections){\r\n  if(sections.length===0)return '<div style=\"padding:20px;text-align:center;color:var(--text3)\">No plan data found.<\/div>';\r\n  return sections.map(s=>`\r\n    <div class=\"bm-plan-sec\" style=\"margin-bottom:12px\">\r\n      <div class=\"bm-plan-hdr ${s.color}\">${s.title}<span style=\"font-weight:400;opacity:.7\">${s.items.length} items<\/span><\/div>\r\n      <div style=\"overflow-x:auto\"><table class=\"bmt\" style=\"width:100%\">\r\n        <tbody>\r\n          ${s.items.slice(0,20).map((i,ri)=>`\r\n            <tr style=\"background:${ri%2===0?'var(--bg)':'var(--bg2)'}\">\r\n              ${(i.cols||[]).slice(0,5).map((cl,ci)=>`<td style=\"${ci===0?'font-weight:600;min-width:110px;':'color:var(--text2);'}white-space:normal;line-height:1.45;vertical-align:top\">${cl}<\/td>`).join('')}\r\n            <\/tr>`).join('')}\r\n        <\/tbody>\r\n      <\/table><\/div>\r\n    <\/div>`).join('');\r\n}\r\n\r\nfunction extractPlan(rows){\r\n  const secs=[];let cur=null;\r\n  const MAP=[['\u2460','Lead Generation & Awareness','ph-blue'],['\u2461','Project-Based Work','ph-teal'],['\u2462','Events & Activations','ph-purple'],['\u2463','PR Coverage','ph-gold'],['\u2464','Audience Reached','ph-teal'],['\u2465','Website Work','ph-blue'],['\u2466','Needed \/ Backlog','ph-red']];\r\n  const SKIP=['Campaign Type','Platform','Project Name','Event Name','Work Title','Type','Description','Work Area','Item','Activity','SL','Area'];\r\n  for(const row of rows){\r\n    const c0=(row[0]||'').trim();\r\n    const cols=row.map(c=>(c||'').trim());\r\n    for(const[mk,title,color]of MAP){if(c0.includes(mk)){cur={title,color,items:[]};secs.push(cur);break;}}\r\n    if(cur&&cols[1]&&cols[1].length>2&&!SKIP.some(s=>cols[1]===s)&&!cols[1].startsWith('\u25b8')&&!cols[1].startsWith('\u25ba')){\r\n      \/\/ Collect all non-empty columns as data\r\n      const data=cols.slice(1).filter(Boolean);\r\n      if(data.length>0)cur.items.push({cols:data});\r\n    }\r\n  }\r\n  return secs.filter(s=>s.items.length>0);\r\n}\r\n\r\nfunction extractNishitPlan(rows){\r\n  \/\/ Area\/Platform | Description | Target | Achieved columns\r\n  const sections={};let curArea='';\r\n  for(const row of rows){\r\n    const c0=(row[0]||'').trim(),c1=(row[1]||'').trim(),c2=(row[2]||'').trim(),c3=(row[3]||'').trim();\r\n    if(!c0&&!c1)continue;\r\n    if(c1==='Description'||c0==='Area\/Platform')continue;\r\n    if(c0&&c0!=='')curArea=c0;\r\n    if(c1&&c1.length>2&&c1!=='Description'){\r\n      if(!sections[curArea])sections[curArea]=[];\r\n      sections[curArea].push({desc:c1,target:c2,achieved:c3});\r\n    }\r\n  }\r\n  return sections;\r\n}\r\n\r\n\/\/ \u2500\u2500 OVERVIEW \u2500\u2500\r\nlet _ovSelMember='all';\r\nfunction rOverview(){\r\n  const members=_ovSelMember==='all'?activeMembers():activeMembers().filter(m=>m.id===_ovSelMember);\r\n  let totTotal=0,totDone=0,totProg=0,totPend=0,totCF=0,totMonthPend=0;\r\n  const workloadByMember={},workTypeTally={};\r\n\r\n  const memberBtns=`<div style=\"display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;align-items:center\">\r\n    <span style=\"font-size:12px;color:var(--text2);font-weight:700\">Member:<\/span>\r\n    <button class=\"bm-subtab ${_ovSelMember==='all'?'on':''}\" onclick=\"setOvMember('all')\">All<\/button>\r\n    ${activeMembers().map(m=>`<button class=\"bm-subtab ${_ovSelMember===m.id?'on':''}\" onclick=\"setOvMember('${m.id}')\">${m.name}<\/button>`).join('')}\r\n  <\/div>`;\r\n\r\n  const cards=members.map(m=>{\r\n    const todo=todaysToDo[m.id]||[];\r\n    const done=todo.filter(t=>t.status==='Done').length;\r\n    const prog=todo.filter(t=>t.status==='In Progress').length;\r\n    const pend=todo.filter(t=>t.status==='Pending').length;\r\n    const cf=todo.filter(t=>t.status==='Carried Forward').length;\r\n    totTotal+=todo.length;totDone+=done;totProg+=prog;totPend+=pend;totCF+=cf;totMonthPend+=pend;\r\n    workloadByMember[m.id]=(workloadByMember[m.id]||0)+todo.length;\r\n    todo.forEach(t=>{\r\n      const wt=t.workType||'Not specified';\r\n      workTypeTally[wt]=(workTypeTally[wt]||0)+1;\r\n    });\r\n\r\n    const visibleTodo=todo.filter(t=>t.status!=='Pending'); \/\/ Pending items live in the dedicated box above, not here\r\n    const taskRows=visibleTodo.slice(0,8).map((t,ri)=>`\r\n      <div class=\"bm-task-row\" style=\"background:${!t.workType?'#FEF2F2':ri%2===0?'var(--bg)':'var(--bg2)'};${!t.workType?'border-left:3px solid #e8232a;':''}\">\r\n        <div style=\"flex:1\">\r\n          <div class=\"bm-task-type\" style=\"color:${!t.workType?'#e8232a':'var(--text3)'}\">${t.workType||'Work Type not filled'}<\/div>\r\n          <div class=\"bm-task-desc\">${t.task}<\/div>\r\n        <\/div>\r\n        ${t.count?`<span style=\"font-size:13px;font-weight:800;color:#e8232a;margin:0 6px;white-space:nowrap\">${t.count}<\/span>`:''}\r\n        ${!t.status||t.status===''?'<span class=\"sdb\" style=\"background:#FEF9E7;color:#b45309;border:1px solid rgba(180,83,9,0.2);white-space:nowrap\">New Task<\/span>':pill(t.status)}\r\n      <\/div>`).join('');\r\n\r\n    const footer=visibleTodo.length>8\r\n      ?`<button class=\"bm-view-btn\" onclick=\"bmTab('${m.id}',document.querySelectorAll('.bm-tab')[${MEMBERS.findIndex(x=>x.id===m.id)+1}])\">View all ${visibleTodo.length} \u2192<\/button>`\r\n      :`<span>${visibleTodo.length} task${visibleTodo.length!==1?'s':''}<\/span>`;\r\n\r\n    return`<div class=\"bm-task-block\">\r\n      <div class=\"bm-task-header\">\r\n        <div style=\"display:flex;align-items:center;gap:10px\">\r\n          <div class=\"bm-av ${m.av}\" style=\"overflow:hidden;padding:0\">${m.photo?`<img decoding=\"async\" src=\"${m.photo}\" alt=\"${m.name}\" style=\"width:100%;height:100%;object-fit:cover\" onerror=\"this.style.display='none';this.parentNode.textContent='${ini(m.name)}'\">`:ini(m.name)}<\/div>\r\n          <div><div class=\"bm-task-name\">${m.name}<\/div><div class=\"bm-task-role\">${m.role}<\/div><\/div>\r\n        <\/div>\r\n        <div style=\"text-align:right\">\r\n          <div class=\"bm-task-date\">Today's To-Do<\/div>\r\n          <div style=\"font-size:10px;color:var(--text3);margin-top:3px\">\r\n            <span class=\"sig-dot green\"><\/span>${done}&nbsp;<span class=\"sig-dot yellow\"><\/span>${prog}&nbsp;<span class=\"sig-dot red\"><\/span>${pend}\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n      ${taskRows||(todo.length>0?'<div style=\"padding:14px 13px;font-size:12px;color:var(--text3)\">All pending \u2014 see All Pending Work above<\/div>':'<div style=\"padding:14px 13px;font-size:12px;color:var(--text3)\">Nothing logged yet today<\/div>')}\r\n      <div class=\"bm-task-footer\"><span><\/span>${footer}<\/div>\r\n    <\/div>`;\r\n  }).join('');\r\n\r\n  const warn=!mdApproved?`<div class=\"bm-warn\">Monthly plan not approved \u2014 MD meeting not marked DONE.<\/div>`:'';\r\n\r\n  \/\/ \u2500\u2500 TODAY'S STATUS (live \u2014 based on whether they've logged anything in DailyToDo) \u2500\u2500\r\n  let attendanceHtml='<div class=\"bm-card\" style=\"margin-bottom:12px\"><div class=\"bm-ctitle\">Today\\'s Status<\/div>';\r\n  let alertsHtml='';\r\n  activeMembers().forEach(m=>{\r\n    const todo=todaysToDo[m.id]||[];\r\n    const nonPendingCount=todo.filter(t=>t.status!=='Pending').length;\r\n    const hasSubmitted=nonPendingCount>0;\r\n    const statusLabel=hasSubmitted?nonPendingCount+' task'+(nonPendingCount!==1?'s':'')+' today':'Nothing logged yet today';\r\n    attendanceHtml+=`<div style=\"display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--bg3)\">\r\n      <span class=\"sig-dot ${hasSubmitted?'green':'red'}\"><\/span>\r\n      <span class=\"bm-av ${m.av}\" style=\"width:30px;height:30px;font-size:10px;overflow:hidden;padding:0;flex-shrink:0\">${m.photo?`<img decoding=\"async\" src=\"${m.photo}\" alt=\"${m.name}\" style=\"width:100%;height:100%;object-fit:cover\" onerror=\"this.style.display='none';this.parentNode.textContent='${ini(m.name)}'\">`:ini(m.name)}<\/span>\r\n      <span style=\"flex:1;font-size:13px;font-weight:600\">${m.name}<\/span>\r\n      <span style=\"font-size:11px;color:${hasSubmitted?'var(--green)':'#e8232a'};font-weight:700\">\r\n        ${statusLabel}\r\n      <\/span>\r\n    <\/div>`;\r\n    if(!hasSubmitted){\r\n      alertsHtml+=`<div style=\"background:#FEF2F2;border:1.5px solid rgba(232,35,42,.25);border-left:4px solid #e8232a;border-radius:8px;padding:9px 13px;margin-bottom:8px;font-size:12px;color:#991b1b;font-weight:600\">\r\n        ${m.name} hasn't submitted today's to-do yet\r\n      <\/div>`;\r\n    }\r\n  });\r\n  attendanceHtml+='<\/div>';\r\n\r\n  \/\/ \u2500\u2500 DAILY ATTENDANCE \u2014 Brand & Marketing, live from HR \u2500\u2500\r\n  const attStatusClass={'On Time':'gg','Between 9:01-9:10':'yg','Late':'yg','Absent':'rg','Leave':'rg','Day Off':'bg-b','Shift Duty':'pg'};\r\n  let brandAttHtml='<div class=\"bm-card\" style=\"margin-bottom:12px\"><div class=\"bm-ctitle\">Daily Attendance \u2014 Brand &amp; Marketing (from HR)<\/div>';\r\n  if(brandAttendance.length===0){\r\n    brandAttHtml+='<div style=\"padding:10px;text-align:center;color:var(--text3);font-size:12px\">No attendance data available<\/div>';\r\n  }else{\r\n    brandAttendance.forEach(p=>{\r\n      const st=p.status||'Not marked yet';\r\n      const cls=attStatusClass[p.status]||'gr';\r\n      brandAttHtml+=`<div style=\"display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--bg3);font-size:12px\">\r\n        <span style=\"flex:1;font-weight:600\">${p.name}<\/span>\r\n        <span class=\"sdb ${cls}\">${st}<\/span>\r\n      <\/div>`;\r\n    });\r\n  }\r\n  brandAttHtml+='<\/div>';\r\n\r\n  \/\/ \u2500\u2500 DONUT CHARTS \u2500\u2500\r\n  const statusColors={Done:'#2d7a4f',InProgress:'#b45309',Pending:'#e85d3a',CarriedForward:'#7c3aed'};\r\n  const statusDonut=donutChart('Task Status Breakdown',[\r\n    {label:'Done',value:totDone,color:'#2d7a4f',onclick:\"showStatusTasks('Done')\"},\r\n    {label:'In Progress',value:totProg,color:'#b45309',onclick:\"showStatusTasks('In Progress')\"},\r\n    {label:'Pending',value:totMonthPend,color:'#e85d3a',onclick:\"showStatusTasks('Pending')\"},\r\n    {label:'Carried Forward',value:totCF,color:'#7c3aed',onclick:\"showStatusTasks('Carried Forward')\"},\r\n  ]);\r\n\r\n  const memberPalette=['#e85d3a','#2d7a4f','#2563eb','#7c3aed','#b45309','#0e7490'];\r\n  const workloadDonut=donutChart('Workload Share \u2014 Per Member',\r\n    activeMembers().map((m,i)=>({label:m.name,value:workloadByMember[m.id]||0,color:memberPalette[i%memberPalette.length],onclick:`bmTab('${m.id}',document.getElementById('bm-tabbtn-${m.id}'))`}))\r\n  );\r\n\r\n  const wtPalette=['#e85d3a','#2d7a4f','#2563eb','#7c3aed','#b45309','#0e7490','#c94a28','#16a34a','#9333ea','#0891b2'];\r\n  const wtEntries=Object.entries(workTypeTally).sort((a,b)=>b[1]-a[1]).slice(0,8);\r\n  const workTypeDonut=donutChart('Work Type Distribution',\r\n    wtEntries.map(([label,value],i)=>({label,value,color:wtPalette[i%wtPalette.length]}))\r\n  );\r\n\r\n  const todayCostTotal=sakibTodayLead.reduce((s,r)=>s+(parseFloat(r.cost)||0),0);\r\n  const todayLeadsTotal=sakibTodayLead.reduce((s,r)=>s+(parseFloat(r.leads)||0),0);\r\n\r\n  document.getElementById('bm-main').innerHTML=warn+`\r\n    <div class=\"bm-kgrid\">\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Team<\/span><span class=\"val\">${activeMembers().length}<\/span><span class=\"sub\">Members<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Tasks<\/span><span class=\"val\">${totTotal}<\/span><span class=\"sub\">Latest<\/span><\/div>\r\n      <div class=\"bm-kpi\" style=\"cursor:pointer\" onclick=\"showStatusTasks('Done')\"><span class=\"lbl\">Done<\/span><span class=\"val\" style=\"color:var(--green)\">${totDone}<\/span><span class=\"sub\">Completed \u00b7 click to view<\/span><\/div>\r\n      <div class=\"bm-kpi\" style=\"cursor:pointer\" onclick=\"showStatusTasks('In Progress')\"><span class=\"lbl\">Progress<\/span><span class=\"val\" style=\"color:var(--gold)\">${totProg}<\/span><span class=\"sub\">Active \u00b7 click to view<\/span><\/div>\r\n      <div class=\"bm-kpi\" style=\"cursor:pointer\" onclick=\"showStatusTasks('Pending')\"><span class=\"lbl\">Pending<\/span><span class=\"val\" style=\"color:var(--salmon)\">${totMonthPend}<\/span><span class=\"sub\">This month \u00b7 click to view<\/span><\/div>\r\n      <div class=\"bm-kpi\" style=\"cursor:pointer\" onclick=\"showLeadCostModal()\"><span class=\"lbl\">Lead Cost &amp; Count<\/span><span class=\"val\" style=\"color:var(--purple)\">${todayLeadsTotal}<\/span><span class=\"sub\">BDT ${todayCostTotal.toLocaleString()} today \u00b7 click to view<\/span><\/div>\r\n    <\/div>\r\n    ${alertsHtml}\r\n    <div class=\"bm-g2\">${attendanceHtml}${brandAttHtml}<\/div>\r\n    ${memberBtns}\r\n    <div style=\"font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px\">\u23f3 All Pending Work<\/div>\r\n    <div class=\"bm-card\" style=\"padding:0;overflow:hidden;margin-bottom:16px\">\r\n      ${(()=>{\r\n        const rows=[];\r\n        activeMembers().forEach(m=>{\r\n          (todaysToDo[m.id]||[]).filter(t=>t.status==='Pending').forEach(t=>rows.push({task:t.task,name:m.name}));\r\n        });\r\n        if(rows.length===0)return '<div style=\"padding:16px;text-align:center;color:var(--text3);font-size:13px\">No pending work right now \ud83c\udf89<\/div>';\r\n        return rows.map((r,i)=>`<div style=\"display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 14px;background:${i%2===0?'var(--salmon-soft)':'var(--bg2)'};border-bottom:1px solid var(--bg3)\">\r\n          <span style=\"font-size:13px;color:var(--text)\">${r.task}<\/span>\r\n          <span style=\"font-size:12px;color:var(--text2);font-weight:600;white-space:nowrap\">${r.name}<\/span>\r\n        <\/div>`).join('');\r\n      })()}\r\n    <\/div>\r\n    <div style=\"font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px\">Latest Activity<\/div>\r\n    ${cards}\r\n    <div style=\"font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin:16px 0 8px\">Analytics<\/div>\r\n    <div class=\"bm-g2\">${statusDonut}${workloadDonut}<\/div>\r\n    ${workTypeDonut}`;\r\n}\r\n\r\n\/\/ \u2500\u2500 PERSON TAB \u2014 generic daily work \u2500\u2500\r\nlet _personSubTab={orin:'daily',nishit:'daily',sakib:'daily',sagon:'daily'};\r\nlet _personSearch={orin:'',nishit:'',sakib:'',sagon:''};\r\nlet _personStatus={orin:'all',nishit:'all',sakib:'all',sagon:'all'};\r\nlet _personDF1={orin:'',nishit:'',sakib:'',sagon:''};\r\nlet _personDF2={orin:'',nishit:'',sakib:'',sagon:''};\r\nlet _personPlanMonth={orin:'jul',nishit:'jul',sagon:'jul'};\r\n\/\/ Dedicated month-state for the auto-generated \"Report\" subtab, kept SEPARATE\r\n\/\/ from _personPlanMonth (which uses short keys like 'jul'\/'jun' for the\r\n\/\/ Plan\/Content-Calendar subtabs) to avoid the two colliding when a person\r\n\/\/ has both a Plan\/Calendar subtab and a Report subtab.\r\nlet _personReportMonth={orin:'',nishit:'',sakib:'',sagon:'',riyad:'',afruza:''};\r\n\/\/ For a seat that changed hands (see NAME_TRANSITIONS), the person's own\r\n\/\/ Daily Work \/ Today's-To-Do views default to showing ONLY their own\r\n\/\/ tenure \u2014 off by default means \"hide the previous person's work here.\"\r\n\/\/ Toggle it on to see the full seat history (e.g. for a manager checking\r\n\/\/ continuity across the handover).\r\nlet _personShowFullHistory={};\r\n\r\nasync function rPerson(id){\r\n  const m=MEMBERS.find(x=>x.id===id);\r\n  let tasks=allTasks[id]||[];\r\n  const tr=NAME_TRANSITIONS[id];\r\n  const showFullHistory=!!_personShowFullHistory[id];\r\n  const tasksOwnTenureCount=tr?tasks.filter(t=>{const d=parseTaskDate(t.date);return d&&d>=tr.cutover;}).length:tasks.length;\r\n  if(tr&&!showFullHistory){\r\n    tasks=tasks.filter(t=>{\r\n      const d=parseTaskDate(t.date);\r\n      return d&&d>=tr.cutover;\r\n    });\r\n  }\r\n  const sq=(_personSearch[id]||'').toLowerCase();\r\n  if(sq)tasks=tasks.filter(t=>(t.task||'').toLowerCase().includes(sq)||(t.workType||'').toLowerCase().includes(sq));\r\n  const stF=_personStatus[id]||'all';\r\n  if(stF!=='all'){\r\n    if(stF==='New Task')tasks=tasks.filter(t=>!t.status||t.status==='');\r\n    else tasks=tasks.filter(t=>t.status===stF);\r\n  }\r\n  const pf1=_personDF1[id]||'',pf2=_personDF2[id]||'';\r\n  if(pf1||pf2){\r\n    tasks=tasks.filter(t=>{\r\n      const pd=parseTaskDate(t.date);if(!pd)return false;\r\n      const k=pd.getFullYear()+'-'+String(pd.getMonth()+1).padStart(2,'0')+'-'+String(pd.getDate()).padStart(2,'0');\r\n      if(pf1&&k<pf1)return false;if(pf2&&k>pf2)return false;return true;\r\n    });\r\n  }\r\n  const subTab=_personSubTab[id]||'todo';\r\n\r\n  \/\/ build subtab buttons\r\n  let subtabBtns=`<div class=\"bm-subtabs\">\r\n    <button class=\"bm-subtab ${subTab==='todo'?'on':''}\" onclick=\"setPersonSubTab('${id}','todo')\">Today's To-Do<\/button>\r\n    <button class=\"bm-subtab ${subTab==='daily'?'on':''}\" onclick=\"setPersonSubTab('${id}','daily')\">Daily Work (Archive)<\/button>`;\r\n  if(id==='orin'){\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='plan'?'on':''}\" onclick=\"setPersonSubTab('orin','plan')\">Monthly Plan<\/button>`;\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='report'?'on':''}\" onclick=\"setPersonSubTab('orin','report')\">Report<\/button>`;\r\n  }\r\n  if(id==='nishit'){\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='plan'?'on':''}\" onclick=\"setPersonSubTab('nishit','plan')\">Work Plan<\/button>`;\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='report'?'on':''}\" onclick=\"setPersonSubTab('nishit','report')\">Report<\/button>`;\r\n  }\r\n  if(id==='sagon'){\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='cal'?'on':''}\" onclick=\"setPersonSubTab('sagon','cal')\">Content Calendar<\/button>`;\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='report'?'on':''}\" onclick=\"setPersonSubTab('sagon','report')\">Report<\/button>`;\r\n  }\r\n  if(id==='riyad'||id==='afruza'){\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='report'?'on':''}\" onclick=\"setPersonSubTab('${id}','report')\">Report<\/button>`;\r\n  }\r\n  if(id==='sakib'){\r\n    subtabBtns+=`<button class=\"bm-subtab ${subTab==='leadcost'?'on':''}\" onclick=\"setPersonSubTab('sakib','leadcost')\">Lead Cost &amp; Count<\/button>`;\r\n  }\r\n  subtabBtns+=`<\/div>`;\r\n\r\n  let content='';\r\n\r\n  if(subTab==='todo'){\r\n    const todoItems=todaysToDo[id]||[];\r\n    const hasCount=id==='riyad'||id==='afruza';\r\n    const rows=todoItems.map((t,i)=>`\r\n      <div class=\"bm-task-row\" style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <div style=\"flex:1\">\r\n          <div class=\"bm-task-type\">${t.workType||'\u2014'}<\/div>\r\n          <div class=\"bm-task-desc\">${t.task}<\/div>\r\n          ${t.remarks?`<div style=\"font-size:11px;color:var(--text3);margin-top:2px\">${t.remarks}<\/div>`:''}\r\n        <\/div>\r\n        ${hasCount&&t.count?`<span style=\"font-size:13px;font-weight:800;color:var(--salmon);margin:0 6px;white-space:nowrap\">${t.count}<\/span>`:''}\r\n        ${t.priority?`<span class=\"sdb ${t.priority==='Urgent'||t.priority==='High'?'rg':t.priority==='Medium'||t.priority==='Normal'?'yg':'gr'}\" style=\"margin-right:6px\">${t.priority}<\/span>`:''}\r\n        ${t.status?pill(t.status):'<span class=\"sdb gr\">\u2014<\/span>'}\r\n      <\/div>`).join('');\r\n\r\n    content=`<div class=\"bm-card\" style=\"margin-bottom:0;padding:0;overflow:hidden\">\r\n      <div style=\"background:var(--bg3);padding:9px 13px;font-size:11px;color:var(--text3);font-weight:600\">\r\n        Live from today's work sheet \u2014 anything Done\/Cancelled here moves into the permanent archive automatically overnight. ${todoItems.length} item${todoItems.length!==1?'s':''} right now.\r\n      <\/div>\r\n      ${rows||'<div style=\"padding:20px;text-align:center;color:var(--text3);font-size:13px\">Nothing logged yet today.<\/div>'}\r\n    <\/div>`;\r\n  }\r\n\r\n  else if(subTab==='leadcost' && id==='sakib'){\r\n    const platformRows=sakibTodayLead.map((r,i)=>`\r\n      <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td style=\"font-weight:600\">${r.platform}<\/td>\r\n        <td style=\"text-align:right;font-family:'JetBrains Mono',monospace\">${r.cost||'\u2014'}<\/td>\r\n        <td style=\"text-align:center;font-weight:700;color:var(--salmon)\">${r.leads||'\u2014'}<\/td>\r\n        <td style=\"color:var(--text3);font-size:11px\">${r.remarks||'\u2014'}<\/td>\r\n      <\/tr>`).join('');\r\n\r\n    const todayCostTotal=sakibTodayLead.reduce((s,r)=>s+(parseFloat(r.cost)||0),0);\r\n    const todayLeadsTotal=sakibTodayLead.reduce((s,r)=>s+(parseFloat(r.leads)||0),0);\r\n\r\n    const logRows=sakibLeadLog.slice().reverse().slice(0,200).map((r,i)=>`\r\n      <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap\">${r.date}<\/td>\r\n        <td>${r.platform}<\/td>\r\n        <td style=\"text-align:right;font-family:'JetBrains Mono',monospace\">${r.cost||'\u2014'}<\/td>\r\n        <td style=\"text-align:center;font-weight:700;color:var(--salmon)\">${r.leads||'\u2014'}<\/td>\r\n        <td style=\"color:var(--text3);font-size:11px\">${r.remarks||'\u2014'}<\/td>\r\n      <\/tr>`).join('');\r\n\r\n    content=`<div class=\"bm-kgrid\">\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Today's Cost<\/span><span class=\"val\" style=\"color:var(--salmon)\">${todayCostTotal.toLocaleString()}<\/span><span class=\"sub\">BDT, all platforms<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Today's Leads<\/span><span class=\"val\" style=\"color:var(--green)\">${todayLeadsTotal}<\/span><span class=\"sub\">All platforms<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">History<\/span><span class=\"val\">${sakibLeadLog.length}<\/span><span class=\"sub\">Records logged<\/span><\/div>\r\n    <\/div>\r\n    <div class=\"bm-card\"><div class=\"bm-ctitle\">Today \u2014 By Platform<\/div>\r\n      <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n        <thead><tr><th>Platform<\/th><th>Cost (BDT)<\/th><th>Leads<\/th><th>Remarks<\/th><\/tr><\/thead>\r\n        <tbody>${platformRows||'<tr><td colspan=\"4\" style=\"padding:16px;text-align:center;color:var(--text3)\">No data yet today<\/td><\/tr>'}<\/tbody>\r\n      <\/table><\/div>\r\n    <\/div>\r\n    <div class=\"bm-card\"><div class=\"bm-ctitle\">History \u2014 All Time<\/div>\r\n      <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n        <thead><tr><th>Date<\/th><th>Platform<\/th><th>Cost (BDT)<\/th><th>Leads<\/th><th>Remarks<\/th><\/tr><\/thead>\r\n        <tbody>${logRows||'<tr><td colspan=\"5\" style=\"padding:16px;text-align:center;color:var(--text3)\">No history yet<\/td><\/tr>'}<\/tbody>\r\n      <\/table><\/div>\r\n    <\/div>`;\r\n  }\r\n\r\n\r\n  if(subTab==='daily'){\r\n    const tbody=tasks.length===0\r\n      ?'<tr><td colspan=\"5\" style=\"padding:20px;text-align:center;color:var(--text3)\">No tasks found.<\/td><\/tr>'\r\n      :tasks.slice(0,500).map((t,i)=>`\r\n        <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap\">${t.date||'\u2014'}<\/td>\r\n          <td style=\"color:${!t.workType?'#e8232a':'var(--text3)'};font-size:11px;white-space:nowrap\">${t.workType||'Work Type not filled'}<\/td>\r\n          <td style=\"white-space:normal;line-height:1.4\">${t.task}<\/td>\r\n          ${(id==='riyad'||id==='afruza')?`<td style=\"text-align:center;font-weight:700;color:var(--salmon)\">${t.count||'\u2014'}<\/td>`:''}\r\n          <td>${!t.status||t.status===''?'<span class=\"sdb\" style=\"background:#FEF9E7;color:#b45309;border:1px solid rgba(180,83,9,0.2);white-space:nowrap\">New Task<\/span>':pill(t.status)}<\/td>\r\n          <td style=\"color:var(--text3);font-size:11px;white-space:normal\">${linkify(t.outcome)}<\/td>\r\n        <\/tr>`).join('');\r\n\r\n    const stList=['all','Done','In Progress','Pending','Carried Forward','Cancelled','New Task'];\r\n    const historyToggle=tr?`<div style=\"display:flex;align-items:center;gap:8px;margin-bottom:8px;padding:8px 12px;background:var(--bg3);border-radius:8px;font-size:11px;color:var(--text2)\">\r\n      <span>Showing only ${m.name}'s own work (from ${tr.cutover.toLocaleDateString('en-GB',{day:'numeric',month:'short',year:'numeric'})} onward).<\/span>\r\n      <button class=\"bm-btn\" style=\"margin-left:auto\" onclick=\"togglePersonFullHistory('${id}')\">${showFullHistory?`Hide ${tr.oldName}'s earlier work`:`Show full seat history (incl. ${tr.oldName})`}<\/button>\r\n    <\/div>`:'';\r\n    content=`${historyToggle}<div class=\"bm-subtabs\" style=\"margin-bottom:8px\">\r\n      ${stList.map(s=>`<button class=\"bm-subtab ${stF===s?'on':''}\" onclick=\"setPersonStatus('${id}','${s}')\">${s==='all'?'All Status':s}<\/button>`).join('')}\r\n    <\/div>\r\n    <div class=\"bm-filter\" style=\"margin-bottom:8px\">\r\n      <label>From<\/label><input type=\"date\" id=\"pf1-${id}\" value=\"${pf1}\">\r\n      <label>To<\/label><input type=\"date\" id=\"pf2-${id}\" value=\"${pf2}\">\r\n      <button class=\"bm-apply\" onclick=\"applyPersonDates('${id}')\">Apply<\/button>\r\n      <button class=\"bm-reset\" onclick=\"resetPersonDates('${id}')\">Reset<\/button>\r\n      <input type=\"text\" id=\"search-${id}\" placeholder=\"Search tasks...\" value=\"${_personSearch[id]||''}\"\r\n        style=\"flex:1;min-width:160px;background:var(--bg2);border:1.5px solid var(--border);padding:7px 12px;border-radius:8px;font-size:12px;font-family:'Inter',sans-serif;outline:none\"\r\n        oninput=\"setPersonSearch('${id}',this.value)\" \/>\r\n      <span style=\"font-size:11px;color:var(--text3)\">${tasks.length} tasks<\/span>\r\n    <\/div>\r\n    <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n      <thead><tr><th>Date<\/th><th>Work Type<\/th><th>Task \/ Activity<\/th>${(id==='riyad'||id==='afruza')?'<th>Count<\/th>':''}<th>Status<\/th><th>Outcome<\/th><\/tr><\/thead>\r\n      <tbody>${tbody}<\/tbody>\r\n    <\/table><\/div>`;\r\n  }\r\n\r\n  else if(subTab==='plan'){\r\n    if(id==='orin'){\r\n      \/\/ Month selector for orin plan\r\n      const planMonths=[{label:'July 2026',key:'jul'},{label:'June 2026',key:'jun'},{label:'April 2026',key:'apr'}];\r\n      const selMonth=_personPlanMonth[id]||'jul';\r\n      const monthBtns=`<div class=\"bm-subtabs\" style=\"margin-bottom:12px\">\r\n        ${planMonths.map(pm=>`<button class=\"bm-subtab ${selMonth===pm.key?'on':''}\" onclick=\"setPersonPlanMonth('orin','${pm.key}')\">${pm.label}<\/button>`).join('')}\r\n      <\/div>`;\r\n      const planRows=orinPlanRows[selMonth]||[];\r\n      const sections=extractPlan(planRows);\r\n      const badge=mdApproved?`<span class=\"bm-md-done\">APPROVED<\/span>`:`<span class=\"bm-md-notdone\">NOT DONE<\/span>`;\r\n\r\n      const planHtml=renderPlanSections(sections);\r\n\r\n      content=`<div class=\"bm-md-card\">\r\n        <div style=\"font-size:24px\"><\/div>\r\n        <div style=\"flex:1\"><div style=\"font-size:13px;font-weight:700;color:var(--text)\">Monthly Plan<\/div><div style=\"font-size:11px;color:var(--text3)\">MD Meeting approval required<\/div><\/div>\r\n        ${badge}\r\n      <\/div>${monthBtns}${planHtml}`;\r\n    }\r\n    else if(id==='nishit'){\r\n      const planMonths=[{label:'July 2026',key:'jul'},{label:'June 2026',key:'jun'},{label:'May 2026',key:'may'}];\r\n      const selMonth=_personPlanMonth[id]||'jul';\r\n      const monthBtns=`<div class=\"bm-subtabs\" style=\"margin-bottom:12px\">\r\n        ${planMonths.map(pm=>`<button class=\"bm-subtab ${selMonth===pm.key?'on':''}\" onclick=\"setPersonPlanMonth('nishit','${pm.key}')\">${pm.label}<\/button>`).join('')}\r\n      <\/div>`;\r\n      const planData=nishitPlanRows[selMonth]||[];\r\n      const sections=extractNishitPlan(planData);\r\n      const areaColors={'Website':'ph-blue','Off-page SEO':'ph-teal','Technical SEO':'ph-purple','Facebook':'ph-blue','Instagram':'ph-teal','LinkedIn':'ph-blue','YouTube':'ph-red','TikTok':'ph-purple','Paid Marketing':'ph-gold','Google Map':'ph-teal','Pinterest':'ph-red','Follow-Up':'ph-teal','Email Marketing':'ph-gold'};\r\n\r\n      const planHtml=Object.keys(sections).length===0\r\n        ?'<div style=\"padding:20px;text-align:center;color:var(--text3)\">No plan data found.<\/div>'\r\n        :`<div class=\"bm-plan-grid\">${Object.entries(sections).map(([area,items])=>`\r\n          <div class=\"bm-plan-sec\">\r\n            <div class=\"bm-plan-hdr ${areaColors[area]||'ph-blue'}\">${area}<span style=\"font-weight:400;opacity:.7\">${items.length}<\/span><\/div>\r\n            ${items.map(i=>`<div class=\"bm-plan-row\">\r\n              <div class=\"bm-plan-item\">${i.desc}<\/div>\r\n              <div style=\"display:flex;gap:8px;flex-shrink:0\">\r\n                ${i.target?`<span class=\"sdb gr\">T:${i.target}<\/span>`:''}\r\n                ${i.achieved?`<span class=\"sdb gg\">A:${i.achieved}<\/span>`:''}\r\n              <\/div>\r\n            <\/div>`).join('')}\r\n          <\/div>`).join('')}<\/div>`;\r\n\r\n      content=monthBtns+planHtml;\r\n    }\r\n  }\r\n\r\n  else if(subTab==='cal' && id==='sagon'){\r\n    const calMonths=[{label:'July 2026',key:'jul',mi:6,yr:2026},{label:'June 2026',key:'jun',mi:5,yr:2026},{label:'May 2026',key:'may',mi:4,yr:2026},{label:'April 2026',key:'apr',mi:3,yr:2026}];\r\n    const selMonth=_personPlanMonth[id]||'jul';\r\n    const cfg=calMonths.find(x=>x.key===selMonth)||calMonths[0];\r\n    const monthBtns=`<div class=\"bm-subtabs\" style=\"margin-bottom:12px\">\r\n      ${calMonths.map(pm=>`<button class=\"bm-subtab ${selMonth===pm.key?'on':''}\" onclick=\"setPersonPlanMonth('sagon','${pm.key}')\">${pm.label}<\/button>`).join('')}\r\n    <\/div>`;\r\n    const calData=sagorCalRows[selMonth]||[];\r\n\r\n    \/\/ Parse weeks: a date-row has 3+ pure day numbers in cols 1..7\r\n    const weeks=[];let curW=null;\r\n    const dayNameRe=\/SUNDAY|MONDAY|TUESDAY|WEDNESDAY|THURSDAY|FRIDAY|SATURDAY\/i;\r\n    function isDateRow(r){\r\n      let n=0,bad=0;\r\n      for(let ci=1;ci<=7;ci++){\r\n        const v=(r[ci]||'').trim();\r\n        if(!v)continue;\r\n        if(\/^\\d{1,2}$\/.test(v)&&+v>=1&&+v<=31)n++;else bad++;\r\n      }\r\n      return n>=3&&bad===0;\r\n    }\r\n    for(const r of calData){\r\n      const joined=(r||[]).join(' ');\r\n      if(dayNameRe.test(joined))continue;\r\n      if(\/CONTENT CALENDAR|Current Designer|Change name\/i.test(joined))continue;\r\n      if(isDateRow(r)){\r\n        curW={dates:[],content:[[],[],[],[],[],[],[]]};\r\n        for(let ci=1;ci<=7;ci++)curW.dates.push((r[ci]||'').trim());\r\n        weeks.push(curW);\r\n      } else if(curW){\r\n        for(let ci=1;ci<=7;ci++){\r\n          const v=(r[ci]||'').trim();\r\n          if(v)curW.content[ci-1].push(v);\r\n        }\r\n      }\r\n    }\r\n\r\n    const now=new Date();\r\n    const isCurMonth=cfg.mi===now.getMonth()&&cfg.yr===now.getFullYear();\r\n    const todayD=now.getDate();\r\n    const heads=['SUN','MON','TUE','WED','THU','FRI','SAT'];\r\n\r\n    let calHtml='<div style=\"display:grid;grid-template-columns:repeat(7,1fr);gap:4px\">';\r\n    heads.forEach((h,i)=>{\r\n      calHtml+=`<div style=\"text-align:center;font-size:10px;font-weight:700;padding:7px 2px;border-radius:6px;letter-spacing:.05em;background:${i===0||i===6?'#e8232a':'#fff'};color:${i===0||i===6?'#fff':'#e8232a'};border:1.5px solid #e8232a\">${h}<\/div>`;\r\n    });\r\n    weeks.forEach(w=>{\r\n      for(let ci=0;ci<7;ci++){\r\n        const dt=w.dates[ci];\r\n        const items=w.content[ci]||[];\r\n        const isToday=isCurMonth&&dt&&+dt===todayD;\r\n        if(!dt){\r\n          calHtml+='<div style=\"min-height:78px\"><\/div>';\r\n          continue;\r\n        }\r\n        calHtml+=`<div style=\"background:#fff;border:${isToday?'2px solid #e8232a':'1.5px solid var(--border)'};border-radius:8px;min-height:78px;padding:5px;font-size:10px;overflow:hidden\">\r\n          <div style=\"font-weight:700;font-size:11px;color:${ci===0||ci===6?'#e8232a':'var(--text)'};margin-bottom:3px\">${dt}${isToday?' <span style=\"font-size:8px;background:#e8232a;color:#fff;padding:1px 5px;border-radius:8px;vertical-align:middle\">TODAY<\/span>':''}<\/div>\r\n          ${items.slice(0,4).map(it=>`<div title=\"${it.replace(\/\"\/g,'&quot;')}\" style=\"font-size:9px;line-height:1.3;padding:2px 4px;margin-bottom:2px;border-left:2px solid #e8232a;background:#fff5f5;border-radius:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--text)\">${it}<\/div>`).join('')}\r\n          ${items.length>4?`<div style=\"font-size:9px;color:#e8232a;font-weight:700\">+${items.length-4} more<\/div>`:''}\r\n        <\/div>`;\r\n      }\r\n    });\r\n    calHtml+='<\/div>';\r\n\r\n    content=monthBtns+(weeks.length===0?'<div style=\"padding:20px;text-align:center;color:var(--text3)\">No calendar data found for this month.<\/div>':calHtml);\r\n  }\r\n\r\n  else if(subTab==='report'){\r\n    \/\/ Auto-generate report from daily archive data. Defaults to the\r\n    \/\/ PREVIOUS CALENDAR MONTH (not \"latest month with data\") so it keeps\r\n    \/\/ showing e.g. August all through September, and only flips over once\r\n    \/\/ the calendar actually turns to October \u2014 not the moment the first\r\n    \/\/ September entry gets archived.\r\n    const allMemberTasks=allTasks[id]||[];\r\n    const now=new Date();\r\n    const monthNames=['January','February','March','April','May','June','July','August','September','October','November','December'];\r\n\r\n    const prevMonthDate=new Date(now.getFullYear(),now.getMonth()-1,1);\r\n    const defaultRepMonth=prevMonthDate.getFullYear()+'-'+String(prevMonthDate.getMonth()).padStart(2,'0');\r\n\r\n    \/\/ Month selector \u2014 every month that actually has data, PLUS the default\r\n    \/\/ (previous calendar) month even if it has no data yet, so it's always\r\n    \/\/ pickable\/visible.\r\n    const availMonths=[...new Set([\r\n      defaultRepMonth,\r\n      ...allMemberTasks.map(t=>{\r\n        const pd=parseTaskDate(t.date);\r\n        if(!pd)return null;\r\n        return pd.getFullYear()+'-'+String(pd.getMonth()).padStart(2,'0');\r\n      }).filter(Boolean)\r\n    ])].sort().reverse().slice(0,8);\r\n\r\n    const selRepMonth=_personReportMonth[id]||defaultRepMonth;\r\n    const [selYear,selMon]=selRepMonth.split('-').map(Number);\r\n    const selLabel=monthNames[selMon]+' '+selYear;\r\n\r\n    const monthTasks=allMemberTasks.filter(t=>{\r\n      const pd=parseTaskDate(t.date);\r\n      return pd&&pd.getMonth()===selMon&&pd.getFullYear()===selYear;\r\n    });\r\n\r\n    const monthSelBtns=`<div class=\"bm-subtabs\" style=\"margin-bottom:12px\">\r\n      ${availMonths.map(mk=>{\r\n        const [y,mo]=mk.split('-').map(Number);\r\n        return `<button class=\"bm-subtab ${selRepMonth===mk?'on':''}\" onclick=\"setPersonReportMonth('${id}','${mk}')\">${monthNames[mo]} ${y}<\/button>`;\r\n      }).join('')}\r\n    <\/div>`;\r\n\r\n    \/\/ \u2500\u2500 NISHIT & SAGON: dedicated report matching their existing PDF\r\n    \/\/ report format exactly (same layout\/fields as the July PDFs), instead\r\n    \/\/ of the generic breakdown used for Orin\/Riyad\/Afruza below. \u2500\u2500\r\n    if(id==='nishit'){\r\n      \/\/ PDF format needs per-description Target vs Achieved, which only\r\n      \/\/ exists in the monthly \"<Mon> Plan <Year>\" tab (not the daily log \u2014\r\n      \/\/ Target is a planning input, not something derivable from tasks\r\n      \/\/ done). Fetched live by TAB NAME (v2 proxy) \u2014 works for any month\r\n      \/\/ automatically, no gid or manual wiring needed.\r\n      const monthDateForFetch=new Date(selYear,selMon,1);\r\n      const planData=await fetchNishitPlanForMonth(monthDateForFetch);\r\n      const sections=extractNishitPlan(planData);\r\n      const hasSections=Object.keys(sections).length>0;\r\n\r\n      let tableRows='';\r\n      Object.entries(sections).forEach(([area,items])=>{\r\n        items.forEach((it,ii)=>{\r\n          tableRows+=`<tr style=\"background:${'#fff'}\">\r\n            <td style=\"padding:7px 10px;font-weight:700;background:#D5F5E3;border-bottom:1px solid #eee\">${ii===0?area:''}<\/td>\r\n            <td style=\"padding:7px 10px;background:#F7F8FA;border-bottom:1px solid #eee\">${it.desc}<\/td>\r\n            <td style=\"padding:7px 10px;text-align:center;background:#F7F8FA;border-bottom:1px solid #eee\">${it.target||'\u2014'}<\/td>\r\n            <td style=\"padding:7px 10px;text-align:center;font-weight:700;background:#EAFAF1;border-bottom:1px solid #eee\">${it.achieved||'\u2014'}<\/td>\r\n          <\/tr>`;\r\n        });\r\n      });\r\n\r\n      content=`${monthSelBtns}\r\n      <div style=\"display:flex;justify-content:flex-end;margin-bottom:12px\">\r\n        <button class=\"bm-btn\" onclick=\"printLRReport('${id}')\" style=\"background:#e8232a;color:#fff;border-color:#e8232a\">Print \/ PDF<\/button>\r\n      <\/div>\r\n      <div id=\"lr-report-${id}\">\r\n      <div style=\"background:#145A32;color:#fff;font-weight:800;font-size:15px;padding:10px 14px;border-radius:8px 8px 0 0\">\r\n        DIGITAL MARKETING \u2014 ${selLabel.toUpperCase()} &nbsp;|&nbsp; MONTHLY REPORT\r\n      <\/div>\r\n      <div style=\"background:#F8F8F8;color:#888;font-style:italic;font-size:11px;padding:6px 14px;border:1px solid var(--border);border-top:none\">\r\n        Mr. Nishit &nbsp;|&nbsp; Brand &amp; Marketing &nbsp;|&nbsp; Salmon Developers Ltd. &nbsp;|&nbsp; ${selLabel}\r\n      <\/div>\r\n      ${hasSections?`\r\n      <div class=\"bm-tblwrap\" style=\"border-radius:0 0 8px 8px\"><table style=\"width:100%;border-collapse:collapse;font-size:12px\">\r\n        <thead><tr style=\"background:#145A32;color:#fff\">\r\n          <th style=\"padding:8px 10px;text-align:left\">Area \/ Platform<\/th>\r\n          <th style=\"padding:8px 10px;text-align:left\">Description<\/th>\r\n          <th style=\"padding:8px 10px;text-align:center\">Target<\/th>\r\n          <th style=\"padding:8px 10px;text-align:center\">Output \/ Achieved<\/th>\r\n        <\/tr><\/thead>\r\n        <tbody>${tableRows}<\/tbody>\r\n      <\/table><\/div>`\r\n      :`<div class=\"bm-coming\">No Plan data loaded for ${selLabel} yet. This report reads the \"${selYear} ${monthNames[selMon]} Plan\" tab \u2014 once that tab's gid is added to the dashboard script, it'll show here automatically.<\/div>`}\r\n      <\/div>`;\r\n    }\r\n\r\n    else if(id==='sagon'){\r\n      \/\/ PDF format is Category \/ Details\u00b7Fields \/ Example\u00b7Notes\u00b7Number,\r\n      \/\/ matching Mr. Sagor's \"Work of <Mon> - <Year>\" report. Fully\r\n      \/\/ computable from the live Daily Work Log archive \u2014 no extra gid\r\n      \/\/ or manual tab needed, unlike Nishit's Target\/Achieved report above.\r\n      const MOTION_TYPES=['motion','Motion'];\r\n      const LEARNING_TYPES=['Learning and research','Learning'];\r\n      const wt2={};\r\n      monthTasks.forEach(t=>{const w=t.workType||'Not specified';wt2[w]=(wt2[w]||0)+1;});\r\n      let totalDesigns=0,totalMotion=0,totalLearning=0;\r\n      Object.keys(wt2).forEach(k=>{\r\n        if(MOTION_TYPES.includes(k))totalMotion+=wt2[k];\r\n        else if(LEARNING_TYPES.includes(k))totalLearning+=wt2[k];\r\n        else totalDesigns+=wt2[k];\r\n      });\r\n      const designTypes=Object.keys(wt2).filter(k=>!MOTION_TYPES.includes(k)&&!LEARNING_TYPES.includes(k)).sort((a,b)=>wt2[b]-wt2[a]);\r\n\r\n      function repRow(cat,detail,val){\r\n        return `<tr>\r\n          <td style=\"padding:7px 10px;font-weight:700;border-bottom:1px solid #eee;vertical-align:top\">${cat||''}<\/td>\r\n          <td style=\"padding:7px 10px;border-bottom:1px solid #eee;vertical-align:top\">${detail||''}<\/td>\r\n          <td style=\"padding:7px 10px;border-bottom:1px solid #eee;vertical-align:top;white-space:pre-line\">${val||''}<\/td>\r\n        <\/tr>`;\r\n      }\r\n      const rowsHtml=monthTasks.length===0?'':\r\n        repRow('Graphic Design Monthly Report','Total Designs (excl. motion &amp; research)',String(totalDesigns))+\r\n        repRow('','By Work Type',designTypes.map(t=>`${t}: ${wt2[t]}`).join('\\n'))+\r\n        repRow('','Brand Guideline Followed \/ Client Feedback','Not Available \u2014 not recorded in daily log')+\r\n        repRow('Motion Graphics Monthly Report','Total Motion-related entries',String(totalMotion))+\r\n        repRow('Learning &amp; Research','Total entries',String(totalLearning));\r\n\r\n      content=`${monthSelBtns}\r\n      <div style=\"display:flex;justify-content:flex-end;margin-bottom:12px\">\r\n        <button class=\"bm-btn\" onclick=\"printLRReport('${id}')\" style=\"background:#e8232a;color:#fff;border-color:#e8232a\">Print \/ PDF<\/button>\r\n      <\/div>\r\n      <div id=\"lr-report-${id}\">\r\n      <div style=\"background:#FFF2CC;font-weight:800;font-size:15px;padding:12px 14px;border-radius:8px 8px 0 0\">\r\n        Work of ${selLabel.split(' ')[0].slice(0,3)} - ${selYear}<br><span style=\"font-weight:700;font-size:13px\">Mr. Sagor<\/span>\r\n      <\/div>\r\n      ${monthTasks.length===0?`<div class=\"bm-coming\">No Daily Work Log entries found for ${selLabel}.<\/div>`:`\r\n      <div class=\"bm-tblwrap\" style=\"border-radius:0 0 8px 8px\"><table style=\"width:100%;border-collapse:collapse;font-size:12px\">\r\n        <thead><tr style=\"background:#4A86E8;color:#fff\">\r\n          <th style=\"padding:8px 10px;text-align:left\">Category<\/th>\r\n          <th style=\"padding:8px 10px;text-align:left\">Details \/ Fields<\/th>\r\n          <th style=\"padding:8px 10px;text-align:left\">Example or Notes or Number<\/th>\r\n        <\/tr><\/thead>\r\n        <tbody>${rowsHtml}<\/tbody>\r\n      <\/table><\/div>`}\r\n      <\/div>`;\r\n    }\r\n\r\n    else {\r\n    \/\/ Work type counts\r\n    const wtCounts={};\r\n    monthTasks.forEach(t=>{\r\n      const wt=t.workType||'Not specified';\r\n      wtCounts[wt]=(wtCounts[wt]||0)+1;\r\n    });\r\n\r\n    \/\/ Count\/Number totals per work type\r\n    const countTotals={};\r\n    monthTasks.forEach(t=>{\r\n      if(t.count&&!isNaN(Number(t.count))){\r\n        const wt=t.workType||'Other';\r\n        countTotals[wt]=(countTotals[wt]||0)+Number(t.count);\r\n      }\r\n    });\r\n\r\n    \/\/ Status breakdown\r\n    const done=monthTasks.filter(t=>t.status==='Done').length;\r\n    const prog=monthTasks.filter(t=>t.status==='In Progress').length;\r\n    const pend=monthTasks.filter(t=>t.status==='Pending').length;\r\n    const cf=monthTasks.filter(t=>t.status==='Carried Forward').length;\r\n    const newt=monthTasks.filter(t=>!t.status||t.status==='').length;\r\n\r\n    \/\/ Daily timeline\r\n    const dailyCounts={};\r\n    monthTasks.forEach(t=>{if(t.date)dailyCounts[t.date]=(dailyCounts[t.date]||0)+1;});\r\n    const sortedDays=Object.entries(dailyCounts).sort((a,b)=>new Date(a[0])-new Date(b[0]));\r\n\r\n    content=`${monthSelBtns}\r\n    <div style=\"display:flex;justify-content:flex-end;margin-bottom:12px\">\r\n      <button class=\"bm-btn\" onclick=\"printLRReport('${id}')\" style=\"background:#e8232a;color:#fff;border-color:#e8232a\">Print \/ PDF<\/button>\r\n    <\/div>\r\n    <div id=\"lr-report-${id}\">\r\n    <div style=\"font-size:15px;font-weight:800;color:var(--text);margin-bottom:12px\">${m.name} \u2014 ${selLabel} Report<\/div>\r\n\r\n    <div class=\"bm-kgrid\" style=\"grid-template-columns:repeat(5,1fr);margin-bottom:12px\">\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Total<\/span><span class=\"val\">${monthTasks.length}<\/span><span class=\"sub\">Tasks<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Done<\/span><span class=\"val\" style=\"color:var(--green)\">${done}<\/span><span class=\"sub\">Completed<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Progress<\/span><span class=\"val\" style=\"color:var(--gold)\">${prog}<\/span><span class=\"sub\">Active<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Pending<\/span><span class=\"val\" style=\"color:#e8232a\">${pend}<\/span><span class=\"sub\">Not started<\/span><\/div>\r\n      <div class=\"bm-kpi\"><span class=\"lbl\">Carried<\/span><span class=\"val\" style=\"color:var(--purple)\">${cf}<\/span><span class=\"sub\">Forward<\/span><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"bm-g2\">\r\n      <div class=\"bm-card\">\r\n        <div class=\"bm-ctitle\">Work Type Breakdown<\/div>\r\n        <div class=\"bm-tblwrap\"><table class=\"bmt\"><thead><tr><th>Work Type<\/th><th>Tasks<\/th><th>Total Count\/Number<\/th><\/tr><\/thead><tbody>\r\n          ${Object.entries(wtCounts).sort((a,b)=>b[1]-a[1]).map(([ wt,cnt],i)=>`\r\n            <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n              <td style=\"font-weight:600\">${wt}<\/td>\r\n              <td style=\"text-align:center\"><span class=\"sdb gg\">${cnt}<\/span><\/td>\r\n              <td style=\"text-align:center;font-weight:700;color:var(--salmon)\">${countTotals[wt]?countTotals[wt]:'\u2014'}<\/td>\r\n            <\/tr>`).join('')}\r\n        <\/tbody><\/table><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"bm-card\">\r\n        <div class=\"bm-ctitle\">Daily Activity Timeline<\/div>\r\n        <div class=\"bm-tblwrap\"><table class=\"bmt\"><thead><tr><th>Date<\/th><th>Tasks<\/th><\/tr><\/thead><tbody>\r\n          ${sortedDays.map(([date,cnt],i)=>`\r\n            <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n              <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${date}<\/td>\r\n              <td><div style=\"display:flex;align-items:center;gap:8px\">\r\n                <div style=\"background:#e8232a;height:8px;border-radius:4px;width:${Math.round((cnt\/Math.max(...sortedDays.map(d=>d[1])))*100)}px;min-width:4px\"><\/div>\r\n                <span style=\"font-weight:700\">${cnt}<\/span>\r\n              <\/div><\/td>\r\n            <\/tr>`).join('')||'<tr><td colspan=\"2\" style=\"text-align:center;color:var(--text3);padding:16px\">No data for this month<\/td><\/tr>'}\r\n        <\/tbody><\/table><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    ${Object.keys(countTotals).length?`\r\n    <div class=\"bm-card\">\r\n      <div class=\"bm-ctitle\">Count \/ Number Summary \u2014 ${selLabel}<\/div>\r\n      <div class=\"bm-tblwrap\"><table class=\"bmt\"><thead><tr><th>Work Type<\/th><th>Total Count<\/th><th>Tasks with Count<\/th><\/tr><\/thead><tbody>\r\n        ${Object.entries(countTotals).sort((a,b)=>b[1]-a[1]).map(([wt,total],i)=>`\r\n          <tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n            <td style=\"font-weight:600\">${wt}<\/td>\r\n            <td style=\"font-size:18px;font-weight:800;color:#e8232a;text-align:center\">${total}<\/td>\r\n            <td style=\"text-align:center\">${monthTasks.filter(t=>t.workType===wt&&t.count).length}<\/td>\r\n          <\/tr>`).join('')}\r\n      <\/tbody><\/table><\/div>\r\n    <\/div>`:''}\r\n    <\/div>`;\r\n    }\r\n  }\r\n\r\n  document.getElementById('bm-main').innerHTML=`\r\n    <div style=\"display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)\">\r\n      <div class=\"bm-av ${m.av}\" style=\"width:38px;height:38px;font-size:12px;overflow:hidden;padding:0\">${m.photo?`<img decoding=\"async\" src=\"${m.photo}\" alt=\"${m.name}\" style=\"width:100%;height:100%;object-fit:cover\" onerror=\"this.style.display='none';this.parentNode.textContent='${ini(m.name)}'\">`:ini(m.name)}<\/div>\r\n      <div><div style=\"font-size:15px;font-weight:700;color:var(--text)\">${m.name}<\/div><div style=\"font-size:11px;color:var(--text3)\">${m.role}<\/div><\/div>\r\n      <div style=\"margin-left:auto;font-size:11px;color:var(--text3)\">${(tr&&!showFullHistory?tasksOwnTenureCount:(allTasks[id]||[]).length)} total tasks${tr&&!showFullHistory?' (own tenure)':''}<\/div>\r\n    <\/div>\r\n    ${subtabBtns}${content}`;\r\n}\r\n\r\n\/\/ \u2500\u2500 MONTHLY PLAN (standalone tab \u2014 Orin's plans) \u2500\u2500\r\nlet _planSelMonth='jul';\r\nfunction rMonthly(){\r\n  const planMonths=[{label:'July 2026',key:'jul'},{label:'June 2026',key:'jun'},{label:'April 2026',key:'apr'}];\r\n  const monthBtns=`<div class=\"bm-subtabs\" style=\"margin-bottom:12px\">\r\n    ${planMonths.map(pm=>`<button class=\"bm-subtab ${_planSelMonth===pm.key?'on':''}\" onclick=\"selectPlanMonth('${pm.key}')\">${pm.label}<\/button>`).join('')}\r\n  <\/div>`;\r\n  const planRows=orinPlanRows[_planSelMonth]||[];\r\n  const sections=extractPlan(planRows);\r\n  const badge=mdApproved?`<span class=\"bm-md-done\">APPROVED<\/span>`:`<span class=\"bm-md-notdone\">NOT DONE<\/span>`;\r\n  const planHtml=renderPlanSections(sections);\r\n\r\n  document.getElementById('bm-main').innerHTML=`\r\n    <div class=\"bm-md-card\">\r\n      <div style=\"flex:1\">\r\n        <div style=\"font-size:13px;font-weight:700;color:var(--text)\">Manager Monthly Plan \u2014 ${MEMBERS.find(m=>m.id==='orin').name}<\/div>\r\n        <div style=\"font-size:11px;color:var(--text3)\">MD Meeting approval required before plan is active<\/div>\r\n      <\/div>${badge}\r\n    <\/div>${monthBtns}${planHtml}`;\r\n}\r\n\r\n\/\/ \u2500\u2500 REPORT \u2500\u2500\r\n\/\/ \u2500\u2500 REPORT TABS \u2014 add new gid here each month \u2500\u2500\r\nconst REPORT_TABS=[\r\n  {name:'Mar-2026', gid:'129147853'},\r\n  {name:'Apr-2026', gid:'283556803'},\r\n  {name:'May-2026', gid:'516828015'},\r\n  {name:'Jun-2026', gid:'1809291276'},\r\n  {name:'Jul-2026', gid:'2133073851'},\r\n];\r\nlet _repTabsLoaded=true;\r\nlet _repMonth='Jul-2026';\r\nlet _repRows={};\r\nlet _rep2Month='Jun-2026';\r\nlet _repCompare=false;\r\n\r\nasync function loadReportTabs(){\r\n  \/\/ Already loaded from hardcoded list above\r\n}\r\n\r\nasync function loadReportMonth(month){\r\n  const tab=REPORT_TABS.find(t=>t.name===month);\r\n  const gid=tab?String(tab.gid):'0';\r\n  try{\r\n    const rows=await fetchSheet('reports',gid==='0'?undefined:gid);\r\n    _repRows[month]=rows;\r\n  }catch(e){_repRows[month]=[];}\r\n}\r\n\r\nfunction parseReportRows(rows){\r\n  const data={sections:{}};\r\n  let curSection='';\r\n  \/\/ Exact section header names from the sheet (plain text, no circled numbers)\r\n  const SECTION_HEADERS=[\r\n    '1. Executive Summary',\r\n    '2. Key Metrics Snapshot',\r\n    '3. Social Media Analytics Report',\r\n    '4. Content \/ Production Tracker',\r\n    '5. Media Buying \u2014 Meta Ads Campaign Performance (Salmon Developers Ltd.)',\r\n    '6. Summary',\r\n    '7. Google Ads \/ Other Paid Channels',\r\n    '8. Consolidated Budget vs. Actual Spend (All Channels)',\r\n    '9. Lead & Conversion Report',\r\n    '10. Sales Funnel: Lead \u2192 Site Visit \u2192 Booking',\r\n    '11. Website Analytics Report',\r\n    '12. SEO Report \u2014 Overview',\r\n    '13. Keyword Performance (Top 10)',\r\n    '14. Backlink & Authority Metrics',\r\n    '15. Competitor SEO Benchmark',\r\n    '16. Project Based Work',\r\n    '17. Project \/ Flat Branding',\r\n    '18. PR Coverage (Online & Print)',\r\n    '19. Influencer Collaboration Result',\r\n    '20. Number of Events \/ Activations',\r\n    '21. Leaflet',\r\n    '22. Billboard or Print Media Reach',\r\n    '23. ROI from Offline Campaigns (QR Scans, Coupons, Surveys)',\r\n    '24. Customer Feedback \/ Sentiment Analysis',\r\n    '25. Audience Reached \/ Leads Collected',\r\n    \"26. Next Month's Plan \/ Action Items\",\r\n  ];\r\n  \/\/ Also match without number prefix for backwards compatibility\r\n  const SECTION_HEADERS_SHORT=[\r\n    'Offline Marketing Work & Awareness Report',\r\n  ];\r\n  \/\/ Skip title row (row 0)\r\n  for(const row of rows.slice(1)){\r\n    const a=(row[0]||'').toString().trim();\r\n    if(!a)continue;\r\n    \/\/ Check if this row is a main section header\r\n    const isSection=SECTION_HEADERS.some(s=>a.toLowerCase()===s.toLowerCase())||SECTION_HEADERS_SHORT.some(s=>a.toLowerCase()===s.toLowerCase());\r\n    if(isSection){\r\n      curSection=a;\r\n      if(!data.sections[curSection])data.sections[curSection]={rows:[]};\r\n      continue;\r\n    }\r\n    if(curSection)data.sections[curSection].rows.push(row);\r\n  }\r\n  return data;\r\n}\r\n\r\nfunction renderReportSection(title, rows, bg='#0E3D59'){\r\n  if(!rows||rows.length===0)return '';\r\n  const nonEmpty=rows.filter(r=>r.some(v=>(v||'').toString().trim()));\r\n  if(!nonEmpty.length)return '';\r\n  const maxCol=Math.min(Math.max(...nonEmpty.map(r=>r.length)),10);\r\n\r\n  let html=`<div style=\"margin-bottom:14px;break-inside:avoid;border:1px solid #ddd;border-radius:6px;overflow:hidden\">\r\n    <div style=\"background:${bg};color:#fff;font-weight:700;font-size:12px;padding:8px 14px;letter-spacing:.03em\">${title}<\/div>`;\r\n\r\n  let tableRows='';\r\n  let dataRowIdx=0;\r\n\r\n  function flushTable(){\r\n    if(tableRows){\r\n      html+=`<div style=\"overflow-x:auto\"><table style=\"width:100%;border-collapse:collapse;font-size:11px\"><tbody>${tableRows}<\/tbody><\/table><\/div>`;\r\n      tableRows='';\r\n      dataRowIdx=0;\r\n    }\r\n  }\r\n\r\n  \/\/ Sub-section header keywords for \u246b offline section\r\n  const subHdrKeywords=['Offline Marketing Work & Awareness Report'];\r\n\r\n  nonEmpty.forEach((r,i)=>{\r\n    const vals=r.map(v=>(v||'').toString().trim());\r\n    const filled=vals.filter(Boolean);\r\n    if(!filled.length)return;\r\n\r\n    \/\/ Detect sub-header: only col0 filled, or matches known sub-header keyword\r\n    const onlyFirst=filled.length===1&&vals[0];\r\n    const isKnownSubHdr=subHdrKeywords.some(k=>vals[0].toLowerCase().includes(k.toLowerCase()));\r\n    const isSubHdr=onlyFirst||isKnownSubHdr;\r\n\r\n    \/\/ Detect table header row: first row after sub-header with 3+ filled cols\r\n    const prevRow=i>0?nonEmpty[i-1]:null;\r\n    const prevFilled=prevRow?prevRow.filter(v=>(v||'').toString().trim()).length:0;\r\n    const isTblHdr=filled.length>=3&&(i===0||(prevFilled<=1));\r\n\r\n    if(isSubHdr&&!isTblHdr){\r\n      flushTable();\r\n      html+=`<div style=\"background:#EEF2FF;font-weight:700;font-size:11px;padding:6px 14px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;color:#1e3a6e\">${vals[0]}<\/div>`;\r\n    } else {\r\n      const rowBg=isTblHdr?'#dce8f7':(dataRowIdx%2===0?'#fff':'#f8f9fa');\r\n      const fntWt=isTblHdr?'700':'400';\r\n      let tr=`<tr style=\"background:${rowBg}\">`;\r\n      for(let ci=0;ci<maxCol;ci++){\r\n        const v=vals[ci]||'';\r\n        tr+=`<td style=\"padding:5px 9px;border-bottom:1px solid #eee;border-right:1px solid #f0f0f0;font-weight:${ci===0&&!isTblHdr?'600':fntWt};color:${isTblHdr?'#1e3a6e':'#1a1a1a'};vertical-align:top;white-space:normal;line-height:1.45;font-size:11px\">${v}<\/td>`;\r\n      }\r\n      tr+='<\/tr>';\r\n      tableRows+=tr;\r\n      if(!isTblHdr)dataRowIdx++;\r\n    }\r\n  });\r\n  flushTable();\r\n  html+='<\/div>';\r\n  return html;\r\n}\r\n\r\nasync function rReport(){\r\n  document.getElementById('bm-main').innerHTML='<div class=\"bm-coming\">Loading reports...<\/div>';\r\n  await loadReportTabs();\r\n  const months=REPORT_TABS.map(t=>t.name);\r\n  if(!months.length){document.getElementById('bm-main').innerHTML='<div class=\"bm-coming\">No report tabs found.<\/div>';return;}\r\n  if(!_repMonth)_repMonth=months[months.length-1];\r\n  if(!_rep2Month)_rep2Month=months.length>1?months[months.length-2]:months[0];\r\n  \r\n  \/\/ Month selector \u2014 pill style\r\n  const monthBtns=`<div style=\"display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px\">\r\n    <span style=\"font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.06em\">Month:<\/span>\r\n    ${months.map(m=>`<button class=\"bm-subtab ${_repMonth===m?'on':''}\" onclick=\"selectReportMonth('${m}')\">${m}<\/button>`).join('')}\r\n    <button class=\"bm-btn\" onclick=\"toggleReportCompare()\" style=\"margin-left:auto;${_repCompare?'background:#e8232a;color:#fff;border-color:#e8232a':''}\">\r\n      ${_repCompare?'Cancel Compare':'Compare Months'}\r\n    <\/button>\r\n  <\/div>\r\n  ${_repCompare?`<div style=\"display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;padding:10px 12px;background:var(--bg2);border-radius:8px\">\r\n    <span style=\"font-size:11px;font-weight:700;color:var(--text3)\">Compare with:<\/span>\r\n    ${months.filter(m=>m!==_repMonth).map(m=>`<button class=\"bm-subtab ${_rep2Month===m?'on':''}\" onclick=\"selectReport2Month('${m}')\">${m}<\/button>`).join('')}\r\n  <\/div>`:''}`;\r\n\r\n  document.getElementById('bm-main').innerHTML=`\r\n    ${monthBtns}\r\n    <div id=\"rpt-content\"><div class=\"bm-coming\">Loading ${_repMonth}...<\/div><\/div>`;\r\n\r\n  \/\/ Load data\r\n  if(!_repRows[_repMonth]){await loadReportMonth(_repMonth);}\r\n  if(_repCompare&&!_repRows[_rep2Month]){await loadReportMonth(_rep2Month);}\r\n\r\n  const rows=_repRows[_repMonth]||[];\r\n  const data=parseReportRows(rows);\r\n  const sectionColors={\r\n    '\u2460':'#0E3D59','\u2461':'#1A4A6E','\u2462':'#0E3D59','\u2463':'#0F766E',\r\n    '\u2464':'#6B21A8','\u2465':'#166534','\u2466':'#B45309','\u2467':'#C0392B',\r\n    '\u2468':'#C0392B','\u2469':'#0F766E','\u246a':'#166534','\u246b':'#0E3D59',\r\n    '\u246c':'#B45309','\u246d':'#C0392B','\u246e':'#0E3D59',\r\n  };\r\n\r\n  if(!_repCompare){\r\n    \/\/ Single month view\r\n    let html=`<div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:12px\">\r\n      <div style=\"font-size:16px;font-weight:800;color:var(--text)\">${_repMonth} \u2014 Brand & Marketing Report<\/div>\r\n      <button class=\"bm-btn\" onclick=\"printReport()\" style=\"background:#e8232a;color:#fff;border-color:#e8232a\">Print \/ PDF<\/button>\r\n    <\/div>`;\r\n    Object.entries(data.sections).forEach(([title,sec])=>{\r\n      const num=title.match(\/^([\u2460-\u246e])\/)?.[1]||'\u2460';\r\n      const bg=sectionColors[num]||'#0E3D59';\r\n      html+=renderReportSection(title,sec.rows,bg);\r\n    });\r\n    if(!Object.keys(data.sections).length){\r\n      html+='<div class=\"bm-coming\">No data found for '+_repMonth+'. Fill in the report sheet and refresh.<\/div>';\r\n    }\r\n    document.getElementById('rpt-content').innerHTML=html;\r\n\r\n  } else {\r\n    \/\/ Compare two months\r\n    const rows2=_repRows[_rep2Month]||[];\r\n    const data2=parseReportRows(rows2);\r\n    let html=`<div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:12px\">\r\n      <div style=\"font-size:15px;font-weight:800;color:var(--text)\">Comparing: ${_repMonth} vs ${_rep2Month}<\/div>\r\n      <button class=\"bm-btn\" onclick=\"printReport()\" style=\"background:#e8232a;color:#fff;border-color:#e8232a\">Print \/ PDF<\/button>\r\n    <\/div>\r\n    <div class=\"bm-g2\">\r\n      <div><div style=\"font-weight:700;font-size:13px;color:#e8232a;margin-bottom:8px;text-align:center\">${_repMonth}<\/div>`;\r\n    Object.entries(data.sections).forEach(([title,sec])=>{\r\n      const num=title.match(\/^([\u2460-\u246e])\/)?.[1]||'\u2460';\r\n      html+=renderReportSection(title,sec.rows,sectionColors[num]||'#0E3D59');\r\n    });\r\n    html+=`<\/div><div><div style=\"font-weight:700;font-size:13px;color:#2d7a4f;margin-bottom:8px;text-align:center\">${_rep2Month}<\/div>`;\r\n    Object.entries(data2.sections).forEach(([title,sec])=>{\r\n      const num=title.match(\/^([\u2460-\u246e])\/)?.[1]||'\u2460';\r\n      html+=renderReportSection(title,sec.rows,sectionColors[num]||'#0E3D59');\r\n    });\r\n    html+='<\/div><\/div>';\r\n    document.getElementById('rpt-content').innerHTML=html;\r\n  }\r\n}\r\n\r\n\/\/ \u2500\u2500 TEAM \u2500\u2500\r\nfunction rTeam(){\r\n  if(empRows.length<3){document.getElementById('bm-main').innerHTML='<div class=\"bm-err\">Could not load employee data.<\/div>';return;}\r\n  const members=empRows.slice(1).filter(r=>(r[1]||'').trim());\r\n  document.getElementById('bm-main').innerHTML=`\r\n    <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n      <thead><tr><th>ID<\/th><th>Name<\/th><th>Designation<\/th><th>Role \/ Work Area<\/th><th>Personal Phone<\/th><th>Office Phone<\/th><th>Personal Email<\/th><th>Office Email<\/th><th>Join Date<\/th><th>DOB<\/th><th>Status<\/th><\/tr><\/thead>\r\n      <tbody>${members.map(r=>`\r\n        <tr>\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r[0]||'\u2014'}<\/td>\r\n          <td><strong>${r[1]||'\u2014'}<\/strong><\/td>\r\n          <td>${r[2]||'\u2014'}<\/td>\r\n          <td style=\"color:var(--text2)\">${r[3]||'\u2014'}<\/td>\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r[4]||'\u2014'}<\/td>\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r[5]||'\u2014'}<\/td>\r\n          <td style=\"font-size:11px\">${r[6]||'\u2014'}<\/td>\r\n          <td style=\"font-size:11px\">${r[7]||'\u2014'}<\/td>\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r[8]||'\u2014'}<\/td>\r\n          <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px\">${r[9]||'\u2014'}<\/td>\r\n          <td>${pill(r[11]||'Active')}<\/td>\r\n        <\/tr>`).join('')}\r\n      <\/tbody>\r\n    <\/table><\/div>`;\r\n}\r\n\r\n\/\/ \u2500\u2500 INSIGHTS \u2500\u2500\r\nlet _cmpPerson='orin',_cmpA='jun',_cmpB='may';\r\nconst CMP_MONTHS=[{key:'jun',label:'June 2026',mi:5},{key:'may',label:'May 2026',mi:4},{key:'apr',label:'April 2026',mi:3}];\r\n\r\nfunction monthStats(id,mi){\r\n  const mt=(allTasks[id]||[]).filter(t=>{const pd=parseTaskDate(t.date);return pd&&pd.getMonth()===mi;});\r\n  return {\r\n    total:mt.length,\r\n    done:mt.filter(t=>t.status==='Done').length,\r\n    prog:mt.filter(t=>t.status==='In Progress').length,\r\n    pend:mt.filter(t=>t.status==='Pending').length,\r\n    cf:mt.filter(t=>t.status==='Carried Forward').length,\r\n    nowt:mt.filter(t=>!t.workType).length,\r\n  };\r\n}\r\n\r\nfunction rInsights(){\r\n  \/\/ 1) WEEKLY SUMMARY FIRST\r\n  let sumHtml=`<div class=\"bm-card\"><div class=\"bm-ctitle\">Weekly Summary \u2014 last 7 days per member<\/div>\r\n  <div class=\"bm-tblwrap\"><table class=\"bmt\"><thead><tr><th>Member<\/th><th>Total Tasks<\/th><th>Done<\/th><th>In Progress<\/th><th>Pending<\/th><th>Carried Fwd<\/th><th>Missing Work Type<\/th><\/tr><\/thead><tbody>`;\r\n  activeMembers().forEach((m,i)=>{\r\n    const mt=(allTasks[m.id]||[]).filter(t=>{const pd=parseTaskDate(t.date);return pd&&dayDiff(pd)<=7;});\r\n    sumHtml+=`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td style=\"font-weight:600\">${m.name}<\/td>\r\n      <td><strong>${mt.length}<\/strong><\/td>\r\n      <td><span class=\"sdb gg\">${mt.filter(t=>t.status==='Done').length}<\/span><\/td>\r\n      <td><span class=\"sdb yg\">${mt.filter(t=>t.status==='In Progress').length}<\/span><\/td>\r\n      <td><span class=\"sdb rg\">${mt.filter(t=>t.status==='Pending').length}<\/span><\/td>\r\n      <td><span class=\"sdb pg\">${mt.filter(t=>t.status==='Carried Forward').length}<\/span><\/td>\r\n      <td>${mt.filter(t=>!t.workType).length>0?`<span class=\"sdb\" style=\"background:#FEF2F2;color:#e8232a\">${mt.filter(t=>!t.workType).length}<\/span>`:'<span class=\"sdb gr\">0<\/span>'}<\/td>\r\n    <\/tr>`;\r\n  });\r\n  sumHtml+='<\/tbody><\/table><\/div><\/div>';\r\n\r\n  \/\/ \u2500\u2500 DONUT CHARTS (last 7 days) \u2500\u2500\r\n  let wkDone=0,wkProg=0,wkPend=0,wkCF=0;\r\n  const wkWorkload={},wkTypeTally={};\r\n  activeMembers().forEach(m=>{\r\n    const mt=(allTasks[m.id]||[]).filter(t=>{const pd=parseTaskDate(t.date);return pd&&dayDiff(pd)<=7;});\r\n    wkDone+=mt.filter(t=>t.status==='Done').length;\r\n    wkProg+=mt.filter(t=>t.status==='In Progress').length;\r\n    wkPend+=mt.filter(t=>t.status==='Pending').length;\r\n    wkCF+=mt.filter(t=>t.status==='Carried Forward').length;\r\n    wkWorkload[m.id]=mt.length;\r\n    mt.forEach(t=>{const wt=t.workType||'Not specified';wkTypeTally[wt]=(wkTypeTally[wt]||0)+1;});\r\n  });\r\n\r\n  const wkStatusDonut=donutChart('Task Status \u2014 Last 7 Days',[\r\n    {label:'Done',value:wkDone,color:'#2d7a4f'},\r\n    {label:'In Progress',value:wkProg,color:'#b45309'},\r\n    {label:'Pending',value:wkPend,color:'#e85d3a'},\r\n    {label:'Carried Forward',value:wkCF,color:'#7c3aed'},\r\n  ]);\r\n  const memberPalette2=['#e85d3a','#2d7a4f','#2563eb','#7c3aed','#b45309','#0e7490'];\r\n  const wkWorkloadDonut=donutChart('Workload Share \u2014 Last 7 Days',\r\n    activeMembers().map((m,i)=>({label:m.name,value:wkWorkload[m.id]||0,color:memberPalette2[i%memberPalette2.length]}))\r\n  );\r\n  const wtPalette2=['#e85d3a','#2d7a4f','#2563eb','#7c3aed','#b45309','#0e7490','#c94a28','#16a34a','#9333ea','#0891b2'];\r\n  const wkWtEntries=Object.entries(wkTypeTally).sort((a,b)=>b[1]-a[1]).slice(0,8);\r\n  const wkWorkTypeDonut=donutChart('Work Type Distribution \u2014 Last 7 Days',\r\n    wkWtEntries.map(([label,value],i)=>({label,value,color:wtPalette2[i%wtPalette2.length]}))\r\n  );\r\n\r\n  const chartsHtml=`<div class=\"bm-g2\">${wkStatusDonut}${wkWorkloadDonut}<\/div>${wkWorkTypeDonut}`;\r\n\r\n  \/\/ 2) MONTH COMPARISON\r\n  const pm=MEMBERS.find(x=>x.id===_cmpPerson)||MEMBERS[0];\r\n  const mA=CMP_MONTHS.find(x=>x.key===_cmpA)||CMP_MONTHS[0];\r\n  const mB=CMP_MONTHS.find(x=>x.key===_cmpB)||CMP_MONTHS[1];\r\n  const sA=monthStats(_cmpPerson,mA.mi), sB=monthStats(_cmpPerson,mB.mi);\r\n  function diffCell(a,b){\r\n    const d=a-b;\r\n    if(d>0)return `<span style=\"color:var(--green);font-weight:700\">+${d}<\/span>`;\r\n    if(d<0)return `<span style=\"color:#e8232a;font-weight:700\">${d}<\/span>`;\r\n    return '<span style=\"color:var(--text3)\">0<\/span>';\r\n  }\r\n  const cmpRows=[\r\n    ['Total Tasks',sA.total,sB.total],\r\n    ['Done',sA.done,sB.done],\r\n    ['In Progress',sA.prog,sB.prog],\r\n    ['Pending',sA.pend,sB.pend],\r\n    ['Carried Forward',sA.cf,sB.cf],\r\n    ['Missing Work Type',sA.nowt,sB.nowt],\r\n  ];\r\n  let cmpHtml=`<div class=\"bm-card\"><div class=\"bm-ctitle\">Compare Two Months \u2014 Any Person<\/div>\r\n  <div class=\"bm-filter\" style=\"margin-bottom:10px\">\r\n    <label>Person<\/label>\r\n    <select onchange=\"setCmp('person',this.value)\">\r\n      ${MEMBERS.map(x=>`<option value=\"${x.id}\" ${_cmpPerson===x.id?'selected':''}>${x.name}<\/option>`).join('')}\r\n    <\/select>\r\n    <label>Month A<\/label>\r\n    <select onchange=\"setCmp('a',this.value)\">\r\n      ${CMP_MONTHS.map(x=>`<option value=\"${x.key}\" ${_cmpA===x.key?'selected':''}>${x.label}<\/option>`).join('')}\r\n    <\/select>\r\n    <label>vs Month B<\/label>\r\n    <select onchange=\"setCmp('b',this.value)\">\r\n      ${CMP_MONTHS.map(x=>`<option value=\"${x.key}\" ${_cmpB===x.key?'selected':''}>${x.label}<\/option>`).join('')}\r\n    <\/select>\r\n  <\/div>\r\n  <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n    <thead><tr><th>Metric \u2014 ${pm.name}<\/th><th>${mA.label}<\/th><th>${mB.label}<\/th><th>Change (A\u2212B)<\/th><\/tr><\/thead>\r\n    <tbody>${cmpRows.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n      <td style=\"font-weight:600\">${r[0]}<\/td><td><strong>${r[1]}<\/strong><\/td><td>${r[2]}<\/td><td>${diffCell(r[1],r[2])}<\/td>\r\n    <\/tr>`).join('')}<\/tbody>\r\n  <\/table><\/div><\/div>`;\r\n\r\n  \/\/ 3) 14-DAY TRENDS\r\n  const days=[];const today=new Date();\r\n  for(let i=13;i>=0;i--){const d=new Date(today);d.setDate(today.getDate()-i);days.push(d);}\r\n  const dns=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];\r\n  let trendHtml='<div class=\"bm-g2\">';\r\n  activeMembers().forEach(m=>{\r\n    const mt=allTasks[m.id]||[];\r\n    const counts=days.map(d=>{const k=d.toDateString();return mt.filter(t=>{const pd=parseTaskDate(t.date);return pd&&pd.toDateString()===k;}).length;});\r\n    const maxC=Math.max(...counts,1);\r\n    trendHtml+=`<div class=\"bm-card\"><div class=\"bm-ctitle\">${m.name} \u2014 Tasks (last 14 days)<\/div>`;\r\n    days.forEach((d,i)=>{\r\n      const isToday=i===13;const pct=Math.round((counts[i]\/maxC)*100);\r\n      trendHtml+=`<div style=\"display:flex;align-items:center;gap:6px;padding:3px 0;border-bottom:1px solid var(--bg3)\">\r\n        <span style=\"width:28px;font-size:10px;color:${isToday?'var(--green)':'var(--text3)'};font-weight:700\">${dns[d.getDay()]}<\/span>\r\n        <span style=\"width:55px;font-size:10px;color:var(--text3);font-family:'JetBrains Mono',monospace\">${d.toLocaleDateString('en-GB',{day:'2-digit',month:'short'})}<\/span>\r\n        <div style=\"flex:1;background:var(--bg3);border-radius:4px;height:7px;overflow:hidden\">\r\n          <div style=\"height:100%;border-radius:4px;width:${pct}%;background:${isToday?'var(--green)':'var(--salmon)'};transition:width .5s\"><\/div>\r\n        <\/div>\r\n        <span style=\"width:30px;text-align:right;font-size:10px;color:var(--text2);font-family:'JetBrains Mono',monospace\">${counts[i]||'\u2014'}<\/span>\r\n      <\/div>`;\r\n    });\r\n    trendHtml+='<\/div>';\r\n  });\r\n  trendHtml+='<\/div>';\r\n\r\n  document.getElementById('bm-main').innerHTML=sumHtml+chartsHtml+cmpHtml+trendHtml;\r\n}\r\n\r\nfunction doRender(tab){\r\n  if(tab==='overview')rOverview();\r\n  else if(tab==='insights')rInsights();\r\n  else if(['orin','nishit','sakib','sagon','riyad','afruza'].includes(tab))rPerson(tab);\r\n  else if(tab==='monthly')rMonthly();\r\n  else if(tab==='report')rReport();\r\n  else if(tab==='team')rTeam();\r\n}\r\n\r\n\/\/ \u2500\u2500 LOAD \u2500\u2500\r\nwindow.bmLoad=async function(){\r\n  document.getElementById('bm-sync').textContent='Syncing...';\r\n  document.getElementById('bm-main').innerHTML='<div class=\"bm-loading\"><div class=\"bm-spin\"><\/div><span>Loading data...<\/span><\/div>';\r\n  try{\r\n    const [eR,dR,nR,oR,sR,oJul,oJun,oApr,nJul,nJun,nMay,nMayRep,sJul,sJun,sMay,sApr,rR,aR,\r\n           oTodo,sgTodo,nTodo,skTodo,rTodo,aTodo,skTodayLead,skLeadLog,brandAtt,\r\n           salesSakibToday,salesRiyadToday,salesSakibRange,salesRiyadRange]=await Promise.all([\r\n      fetchSheet('emp'),\r\n      fetchSheet('designer', GIDS.sagon_daily),\r\n      fetchSheet('nishit', GIDS.nishit_daily),\r\n      fetchSheet('orin', GIDS.orin_daily),\r\n      fetchSheet('sakib', GIDS.sakib_daily),\r\n      fetchSheet('orin', GIDS.orin_jul_plan),\r\n      fetchSheet('orin', GIDS.orin_jun_plan),\r\n      fetchSheet('orin', GIDS.orin_apr_plan),\r\n      fetchSheet('nishit', GIDS.nishit_jul_plan),\r\n      fetchSheet('nishit', GIDS.nishit_jun_plan),\r\n      fetchSheet('nishit', GIDS.nishit_may_plan),\r\n      fetchSheet('nishit', GIDS.nishit_may_rep),\r\n      fetchSheet('designer', GIDS.sagon_jul_cal),\r\n      fetchSheet('designer', GIDS.sagon_jun_cal),\r\n      fetchSheet('designer', GIDS.sagon_may_cal),\r\n      fetchSheet('designer', GIDS.sagon_apr_cal),\r\n      fetchSheet('riyad', GIDS.riyad_daily),\r\n      fetchSheet('afruza', GIDS.afruza_daily),\r\n      fetchSheet('orin', GIDS.orin_todo),\r\n      fetchSheet('designer', GIDS.sagon_todo),\r\n      fetchSheet('nishit', GIDS.nishit_todo),\r\n      fetchSheet('sakib', GIDS.sakib_todo),\r\n      fetchSheet('riyad', GIDS.riyad_todo),\r\n      fetchSheet('afruza', GIDS.afruza_todo),\r\n      fetchSheet('sakib', GIDS.sakib_todaylead),\r\n      fetchSheet('sakib', GIDS.sakib_leadlog),\r\n      loadBrandAttendance(),\r\n      loadJSONP(SALES_TODO_URLS.sakib),\r\n      loadJSONP(SALES_TODO_URLS.riyad),\r\n      loadJSONP(SALES_TODO_URLS.sakib+'?action=range'),\r\n      loadJSONP(SALES_TODO_URLS.riyad+'?action=range'),\r\n    ]);\r\n    brandAttendance=brandAtt;\r\n\r\n    empRows=eR;rawOrin=oR;rawNishit=nR;rawSagon=dR;\r\n    syncMembersFromEmpList();\r\n    orinPlanRows={jul:oJul,jun:oJun,apr:oApr};\r\n    nishitPlanRows={jul:nJul,jun:nJun,may:nMay};\r\n    nishitRepRows={may:nMayRep};\r\n    sagorCalRows={jul:sJul,jun:sJun,may:sMay,apr:sApr};\r\n\r\n    todaysToDo={\r\n      orin:   extractDailyToDo(oTodo,false),\r\n      nishit: extractDailyToDo(nTodo,false),\r\n      sakib:  extractDailyToDo(skTodo,false),\r\n      sagon:  extractDailyToDo(sgTodo,false),\r\n      riyad:  extractDailyToDo(rTodo,true),\r\n      afruza: extractDailyToDo(aTodo,true),\r\n    };\r\n    sakibTodayLead=extractTodaysLeadCost(skTodayLead);\r\n    sakibLeadLog=extractLeadCostLog(skLeadLog);\r\n\r\n    allTasks={\r\n      orin:   extractTasks(oR,MEMBERS.find(m=>m.id==='orin').name,false),\r\n      nishit: extractTasks(nR,personNameForId('nishit',MEMBERS.find(m=>m.id==='nishit').name),false),\r\n      sakib:  extractTasks(sR,MEMBERS.find(m=>m.id==='sakib').name,false),\r\n      sagon:  extractTasks(dR,MEMBERS.find(m=>m.id==='sagon').name,false),\r\n      riyad:  extractTasks(rR,MEMBERS.find(m=>m.id==='riyad').name,true),\r\n      afruza: extractTasks(aR,MEMBERS.find(m=>m.id==='afruza').name,true),\r\n    };\r\n\r\n    \/\/ \u2500\u2500 Sakib & Riyad now work in Sales \u2014 override Today's To-Do with their\r\n    \/\/ NEW sheet's custom tasks (not the 10 fixed Google-Form metric rows,\r\n    \/\/ which already live on the Sales Dashboard), and MERGE the new sheet's\r\n    \/\/ archived history into their existing Brand archive so nothing is lost. \u2500\u2500\r\n    if(salesSakibToday&&!salesSakibToday.error){\r\n      todaysToDo.sakib=salesTasksToTodaysToDo(salesSakibToday.tasks,false);\r\n    }\r\n    if(salesRiyadToday&&!salesRiyadToday.error){\r\n      todaysToDo.riyad=salesTasksToTodaysToDo(salesRiyadToday.tasks,true);\r\n    }\r\n    if(salesSakibRange&&!salesSakibRange.error){\r\n      const newSakibArchive=salesTasksToArchive(salesSakibRange.tasks,MEMBERS.find(m=>m.id==='sakib').name,false);\r\n      allTasks.sakib=[...newSakibArchive,...allTasks.sakib].sort((a,b)=>(parseTaskDate(b.date)||0)-(parseTaskDate(a.date)||0));\r\n    }\r\n    if(salesRiyadRange&&!salesRiyadRange.error){\r\n      const newRiyadArchive=salesTasksToArchive(salesRiyadRange.tasks,MEMBERS.find(m=>m.id==='riyad').name,true);\r\n      allTasks.riyad=[...newRiyadArchive,...allTasks.riyad].sort((a,b)=>(parseTaskDate(b.date)||0)-(parseTaskDate(a.date)||0));\r\n    }\r\n\r\n    mdApproved=checkMD(oJul);\r\n    loaded=true;\r\n\r\n    const now=new Date();\r\n    const total=Object.values(allTasks).flat().length;\r\n    document.getElementById('bm-sync').textContent='Updated '+ft(now);\r\n    document.getElementById('bm-pagedate').textContent=now.toLocaleDateString('en-GB',{weekday:'long',day:'numeric',month:'long',year:'numeric'});\r\n    document.getElementById('bm-toggle-sub').textContent=total+' total tasks \u00b7 Updated '+ft(now);\r\n    doRender(currentTab);\r\n  }catch(e){\r\n    document.getElementById('bm-main').innerHTML=`<div class=\"bm-err\">Error: ${e.message}<\/div>`;\r\n    document.getElementById('bm-sync').textContent='Error';\r\n  }\r\n};\r\n\r\nwindow.bmToggle=function(){\r\n  isOpen=!isOpen;\r\n  document.getElementById('bm-panel').classList.toggle('open',isOpen);\r\n  document.getElementById('bm-toggle').classList.toggle('open',isOpen);\r\n  document.getElementById('bm-toggle-sub').textContent=isOpen?'Click to close':'Click to open';\r\n  if(isOpen&&!loaded)bmLoad();\r\n};\r\n\r\nwindow.bmTab=function(tab,btn){\r\n  currentTab=tab;\r\n  document.querySelectorAll('.bm-tab').forEach(b=>b.classList.remove('on'));\r\n  if(btn)btn.classList.add('on');\r\n  if(loaded)doRender(tab);\r\n};\r\n\r\nsetInterval(()=>{if(isOpen)bmLoad();},5*60*1000);\r\n\r\n\/\/ Detect real mobile devices (works even inside iframes) and show Share button\r\n(function(){\r\n  const ua=navigator.userAgent||'';\r\n  const isMobileUA=\/Android|iPhone|iPad|iPod|Mobile\/i.test(ua);\r\n  const hasShareAPI=!!navigator.share;\r\n  if(isMobileUA && hasShareAPI){\r\n    const sb=document.querySelector('.bm-share-btn');\r\n    if(sb)sb.style.display='inline-flex';\r\n  }\r\n})();\r\n\r\nwindow.printLRReport=function(id){\r\n  var content=document.getElementById('lr-report-'+id);\r\n  if(!content)return;\r\n  var pw=window.open('','_blank','width=1200,height=900');\r\n  pw.document.write(`<!DOCTYPE html><html><head><meta charset=\"UTF-8\">\r\n  <title>Lead Response Report<\/title>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <style>\r\n  @page{size:A4 portrait;margin:12mm 10mm}\r\n  *{box-sizing:border-box;font-family:'Inter',sans-serif;-webkit-print-color-adjust:exact!important}\r\n  body{background:#fff;padding:10px;font-size:11px}\r\n  button{display:none!important}\r\n  .bm-kgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:10px}\r\n  .bm-kpi{border:1px solid #e2ddd6;border-radius:6px;padding:7px;background:#f5f3ef}\r\n  .bm-kpi .lbl{font-size:8px;color:#888;font-weight:700;text-transform:uppercase;display:block}\r\n  .bm-kpi .val{font-size:18px;font-weight:800;display:block}\r\n  .bm-kpi .sub{font-size:9px;color:#888;display:block}\r\n  .bm-g2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}\r\n  .bm-card{border:1px solid #e2ddd6;border-radius:6px;padding:8px;break-inside:avoid}\r\n  .bm-ctitle{font-size:10px;font-weight:700;text-transform:uppercase;color:#0e3d59;margin-bottom:6px}\r\n  table{width:100%;border-collapse:collapse;font-size:10px}\r\n  th{background:#ede9e3;padding:4px 7px;font-weight:700;text-align:left;font-size:9px}\r\n  td{padding:4px 7px;border-bottom:1px solid #f0ede8}\r\n  .sdb{display:inline-flex;font-size:9px;font-weight:700;padding:1px 6px;border-radius:20px}\r\n  .gg{background:#edf7f1;color:#2d7a4f}\r\n  <\/style><\/head><body>${content.innerHTML}\r\n  <script>window.onload=function(){setTimeout(()=>{window.print();setTimeout(()=>window.close(),1500)},500)}<\\\/script>\r\n  <\/body><\/html>`);\r\n  pw.document.close();\r\n};\r\n\r\nwindow.setPersonSubTab=function(id,tab){\r\n  _personSubTab[id]=tab;\r\n  rPerson(id);\r\n};\r\n\r\nlet _searchTimer=null;\r\nwindow.setPersonSearch=function(id,val){\r\n  _personSearch[id]=val;\r\n  clearTimeout(_searchTimer);\r\n  _searchTimer=setTimeout(()=>{\r\n    const el=document.getElementById('search-'+id);\r\n    const pos=el?el.selectionStart:0;\r\n    rPerson(id);\r\n    const el2=document.getElementById('search-'+id);\r\n    if(el2){el2.focus();el2.setSelectionRange(pos,pos);}\r\n  },400);\r\n};\r\n\r\nwindow.setOvMember=function(id){\r\n  _ovSelMember=id;\r\n  rOverview();\r\n};\r\n\r\nwindow.showStatusTasks=function(status){\r\n  const tasks=Object.values(allTasks).flat().filter(t=>status==='New Task'?(!t.status||t.status===''):t.status===status);\r\n  document.getElementById('bm-main').innerHTML=`\r\n    <button class=\"bm-reset\" onclick=\"backOverview()\" style=\"margin-bottom:12px\">&larr; Back to Overview<\/button>\r\n    <div class=\"bm-card\"><div class=\"bm-ctitle\">${status} Tasks \u2014 All Members (${tasks.length})<\/div>\r\n    <div class=\"bm-tblwrap\"><table class=\"bmt\">\r\n      <thead><tr><th>Date<\/th><th>Person<\/th><th>Work Type<\/th><th>Task<\/th><th>Status<\/th><\/tr><\/thead>\r\n      <tbody>${tasks.slice(0,300).map((t,i)=>`<tr style=\"background:${i%2===0?'var(--bg)':'var(--bg2)'}\">\r\n        <td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap\">${t.date||''}<\/td>\r\n        <td><span class=\"sdb bg-b\" style=\"font-size:10px\">${t.person}<\/span><\/td>\r\n        <td style=\"color:${!t.workType?'#e8232a':'var(--text3)'};font-size:11px\">${t.workType||'Not filled'}<\/td>\r\n        <td style=\"white-space:normal;line-height:1.4\">${t.task}<\/td>\r\n        <td>${pill(t.status)}<\/td><\/tr>`).join('')||'<tr><td colspan=\"5\" style=\"padding:16px;text-align:center;color:var(--text3)\">No tasks found<\/td><\/tr>'}<\/tbody>\r\n    <\/table><\/div><\/div>`;\r\n};\r\nwindow.backOverview=function(){rOverview();};\r\n\r\nwindow.setPersonStatus=function(id,s){\r\n  _personStatus[id]=s;\r\n  rPerson(id);\r\n};\r\nwindow.applyPersonDates=function(id){\r\n  const f1=document.getElementById('pf1-'+id),f2=document.getElementById('pf2-'+id);\r\n  if(f1)_personDF1[id]=f1.value;\r\n  if(f2)_personDF2[id]=f2.value;\r\n  rPerson(id);\r\n};\r\nwindow.resetPersonDates=function(id){\r\n  _personDF1[id]='';_personDF2[id]='';_personStatus[id]='all';_personSearch[id]='';\r\n  rPerson(id);\r\n};\r\nwindow.selectReportMonth=function(m){_repMonth=m;rReport();};\r\nwindow.selectReport2Month=function(m){_rep2Month=m;rReport();};\r\nwindow.toggleReportCompare=function(){_repCompare=!_repCompare;rReport();};\r\nwindow.printReport=function(){\r\n  var content=document.getElementById('rpt-content').innerHTML;\r\n  var pw=window.open('','_blank','width=1200,height=900');\r\n  pw.document.write(`<!DOCTYPE html><html><head><meta charset=\"UTF-8\">\r\n  <title>Brand & Marketing Report \u2014 Salmon Developers Ltd.<\/title>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <style>\r\n  @page{size:A4 portrait;margin:12mm 10mm}\r\n  *{box-sizing:border-box;margin:0;padding:0;font-family:'Inter',sans-serif;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}\r\n  body{background:#fff;color:#1a1612;font-size:10px;padding:8px}\r\n  button{display:none!important}\r\n  .bm-card{border:1px solid #e2ddd6;border-radius:6px;margin-bottom:8px;padding:8px;break-inside:avoid}\r\n  .bm-ctitle{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:5px 8px;border-radius:4px 4px 0 0;margin:-8px -8px 6px -8px;color:#fff}\r\n  .bm-tblwrap{overflow:visible}\r\n  table{width:100%;border-collapse:collapse}\r\n  td{padding:3px 6px;border-bottom:1px solid #f0ede8;vertical-align:top;font-size:9px;line-height:1.4}\r\n  .bm-g2{display:grid;grid-template-columns:1fr 1fr;gap:8px}\r\n  .bm-coming{padding:20px;text-align:center;color:#888}\r\n  <\/style><\/head><body>${content}<script>window.onload=function(){setTimeout(()=>{window.print();setTimeout(()=>window.close(),1500);},500);}<\\\/script><\/body><\/html>`);\r\n  pw.document.close();\r\n};\r\n\r\nwindow.setCmp=function(field,val){\r\n  if(field==='person')_cmpPerson=val;\r\n  else if(field==='a')_cmpA=val;\r\n  else _cmpB=val;\r\n  rInsights();\r\n};\r\n\r\nwindow.bmPrint=function(){\r\n  var content=document.getElementById('bm-main').innerHTML;\r\n  var pw=window.open('','_blank','width=1200,height=900');\r\n  pw.document.write(`<!DOCTYPE html><html><head><meta charset=\"UTF-8\">\r\n  <title>Brand & Marketing Dashboard \u2014 Salmon Developers<\/title>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <style>\r\n  @page{size:A4 landscape;margin:12mm 10mm}\r\n  *{box-sizing:border-box;margin:0;padding:0;font-family:'Inter',sans-serif;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}\r\n  body{background:#fff;color:#1a1612;font-size:11px;padding:10px}\r\n  .pdf-header{display:flex;justify-content:space-between;margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid #e85d3a}\r\n  .pdf-title{font-size:16px;font-weight:800;color:#e85d3a}\r\n  .pdf-date{font-size:11px;color:#a89e93}\r\n  button,.bm-subtabs,.bm-filter{display:none!important}\r\n  .bm-kgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:10px}\r\n  .bm-kpi{background:#f5f3ef;border:1px solid #e2ddd6;border-radius:8px;padding:8px}\r\n  .bm-kpi .lbl{font-size:8px;color:#a89e93;font-weight:700;text-transform:uppercase;display:block;margin-bottom:4px}\r\n  .bm-kpi .val{font-size:20px;font-weight:800;display:block}\r\n  .bm-kpi .sub{font-size:9px;color:#a89e93;display:block}\r\n  .bm-task-block{border:1px solid #e2ddd6;border-radius:8px;margin-bottom:8px;break-inside:avoid}\r\n  .bm-task-header{background:#ede9e3;padding:8px 12px;display:flex;justify-content:space-between}\r\n  .bm-task-name{font-size:12px;font-weight:700}\r\n  .bm-task-role{font-size:10px;color:#6b6257}\r\n  .bm-task-date{font-size:10px;font-weight:700;color:#c94a28}\r\n  .bm-task-row{display:flex;justify-content:space-between;padding:6px 12px;border-bottom:1px solid #f5f3ef;font-size:11px}\r\n  .bm-task-footer{display:none}\r\n  .bm-task-type{font-size:9px;color:#a89e93;text-transform:uppercase}\r\n  .bm-task-desc{color:#1a1612}\r\n  .bm-av{display:none}\r\n  .sdb{display:inline-flex;font-size:9px;font-weight:700;padding:1px 6px;border-radius:20px}\r\n  .gg{background:#edf7f1;color:#2d7a4f}.yg{background:#fef9ee;color:#b45309}.rg{background:#fdf0ed;color:#c94a28}.pg{background:#f5f3ff;color:#7c3aed}.gr{background:#ede9e3;color:#a89e93}\r\n  table{width:100%;border-collapse:collapse;font-size:10px}\r\n  th{background:#ede9e3;padding:5px 8px;text-align:left;font-weight:700;font-size:9px;text-transform:uppercase;border-bottom:1px solid #e2ddd6}\r\n  td{padding:5px 8px;border-bottom:1px solid #f5f3ef}\r\n  .bm-plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}\r\n  .bm-plan-sec{border:1px solid #e2ddd6;border-radius:6px;break-inside:avoid}\r\n  .bm-plan-hdr{padding:6px 10px;font-size:9px;font-weight:700;text-transform:uppercase}\r\n  .ph-blue{background:#eff4ff;color:#2563eb}.ph-teal{background:#edf7f1;color:#2d7a4f}.ph-purple{background:#f5f3ff;color:#7c3aed}.ph-gold{background:#fef9ee;color:#b45309}.ph-red{background:#fdf0ed;color:#c94a28}\r\n  .bm-plan-row{display:flex;padding:5px 10px;border-bottom:1px solid #f5f3ef;font-size:10px}\r\n  .bm-plan-item{flex:2;color:#1a1612}.bm-plan-meta{flex:1;color:#6b6257;text-align:right}\r\n  .sig-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:2px}\r\n  .sig-dot.green{background:#16a34a}.sig-dot.red{background:#e8232a}.sig-dot.yellow{background:#ca8a04}\r\n  <\/style><\/head><body>\r\n  <div class=\"pdf-header\">\r\n    <div class=\"pdf-title\">Brand & Marketing Dashboard \u2014 Salmon Developers Ltd.<\/div>\r\n    <div class=\"pdf-date\">${new Date().toLocaleDateString('en-GB',{weekday:'long',day:'numeric',month:'long',year:'numeric',hour:'2-digit',minute:'2-digit'})}<\/div>\r\n  <\/div>\r\n  ${content}\r\n  <script>window.onload=function(){setTimeout(()=>{window.print();setTimeout(()=>window.close(),1500);},800);}<\\\/script>\r\n  <\/body><\/html>`);\r\n  pw.document.close();\r\n};\r\n\r\nwindow.bmShare=async function(){\r\n  const btn=document.querySelector('.bm-share-btn');\r\n  const orig=btn?btn.textContent:'';\r\n  if(btn){btn.textContent='Preparing...';btn.disabled=true;}\r\n  try{\r\n    const main=document.getElementById('bm-main');\r\n    const wrap=document.createElement('div');\r\n    wrap.style.cssText='background:#fff;padding:16px;font-family:Inter,sans-serif';\r\n    wrap.innerHTML='<div style=\"font-size:16px;font-weight:800;color:#e8232a;margin-bottom:4px\">Brand & Marketing Dashboard \u2014 Salmon Developers Ltd.<\/div>'\r\n      +'<div style=\"font-size:11px;color:#888;margin-bottom:12px\">'+new Date().toLocaleDateString('en-GB',{weekday:'long',day:'numeric',month:'long',year:'numeric'})+'<\/div>'\r\n      +main.innerHTML;\r\n    const opt={margin:6,filename:'brand-marketing-dashboard.pdf',image:{type:'jpeg',quality:0.95},\r\n      html2canvas:{scale:2,useCORS:true},jsPDF:{unit:'mm',format:'a4',orientation:'landscape'}};\r\n    const blob=await html2pdf().set(opt).from(wrap).outputPdf('blob');\r\n    const file=new File([blob],'brand-marketing-dashboard.pdf',{type:'application\/pdf'});\r\n    if(navigator.canShare&&navigator.canShare({files:[file]})){\r\n      await navigator.share({files:[file],title:'Brand & Marketing Dashboard',text:'Brand & Marketing Dashboard \u2014 Salmon Developers Ltd.'});\r\n    }else{\r\n      \/\/ fallback: download\r\n      const url=URL.createObjectURL(blob);\r\n      const a=document.createElement('a');a.href=url;a.download='brand-marketing-dashboard.pdf';a.click();\r\n      URL.revokeObjectURL(url);\r\n    }\r\n  }catch(e){\r\n    if(e&&e.name!=='AbortError')alert('Could not prepare share: '+e.message);\r\n  }finally{\r\n    if(btn){btn.textContent=orig;btn.disabled=false;}\r\n  }\r\n};\r\n\r\nwindow.selectPlanMonth=function(month){\r\n  _planSelMonth=month;\r\n  rMonthly();\r\n};\r\n\r\nwindow.setPersonPlanMonth=function(id,month){\r\n  _personPlanMonth[id]=month;\r\n  rPerson(id);\r\n};\r\n\r\nwindow.setPersonReportMonth=function(id,month){\r\n  _personReportMonth[id]=month;\r\n  rPerson(id);\r\n};\r\n\r\nwindow.togglePersonFullHistory=function(id){\r\n  _personShowFullHistory[id]=!_personShowFullHistory[id];\r\n  rPerson(id);\r\n};\r\n\r\n\/\/ \u2500\u2500 LEAD COST & COUNT MODAL \u2500\u2500\r\nfunction localDateKey(d){return d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0')+'-'+String(d.getDate()).padStart(2,'0');}\r\nfunction parseLeadCostDate(dStr){\r\n  if(!dStr)return null;\r\n  const m=dStr.match(\/^(\\d{1,2})\\\/(\\d{1,2})\\\/(\\d{4})$\/);\r\n  if(m)return new Date(+m[3],+m[1]-1,+m[2]);\r\n  const dd=new Date(dStr);\r\n  return isNaN(dd)?null:dd;\r\n}\r\nfunction getAllLeadCostEntries(){\r\n  const todayStr=localDateKey(new Date());\r\n  const todayEntries=sakibTodayLead.filter(r=>r.cost||r.leads).map(r=>({date:todayStr,platform:r.platform,cost:r.cost,leads:r.leads,remarks:r.remarks}));\r\n  const histEntries=sakibLeadLog.map(r=>{\r\n    const d=parseLeadCostDate(r.date);\r\n    return {date:d?localDateKey(d):'',platform:r.platform,cost:r.cost,leads:r.leads,remarks:r.remarks};\r\n  });\r\n  return [...histEntries,...todayEntries];\r\n}\r\n\r\nwindow.showLeadCostModal=function(){\r\n  window.closeLeadCostModal();\r\n  const overlay=document.createElement('div');\r\n  overlay.id='bm-leadcost-modal';\r\n  overlay.style.cssText='position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:99999;display:flex;align-items:center;justify-content:center;padding:1rem';\r\n  overlay.onclick=function(e){if(e.target===overlay)window.closeLeadCostModal();};\r\n  overlay.innerHTML=`\r\n    <div style=\"background:#fff;border-radius:14px;padding:1.5rem;max-width:720px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.3);font-family:'Inter',sans-serif\">\r\n      <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem\">\r\n        <h3 style=\"font-size:16px;font-weight:800;margin:0;color:#1a1612\">Lead Cost &amp; Count \u2014 Mr. Sakib<\/h3>\r\n        <button onclick=\"window.closeLeadCostModal()\" style=\"background:#f0ede8;border:none;border-radius:6px;padding:4px 10px;cursor:pointer;font-size:16px\">\u2715<\/button>\r\n      <\/div>\r\n      <div style=\"display:flex;gap:8px;flex-wrap:wrap;padding:.7rem;background:#f5f3ef;border-radius:8px;margin-bottom:1rem;align-items:center\">\r\n        <label style=\"font-size:11px;font-weight:700;color:#6b6257\">View<\/label>\r\n        <select id=\"lcMode\" onchange=\"window.rebuildLeadCostInputs()\" style=\"background:#fff;border:1.5px solid #e2ddd6;padding:5px 8px;border-radius:6px;font-size:12px\">\r\n          <option value=\"today\">Today<\/option>\r\n          <option value=\"range\">Date Range<\/option>\r\n          <option value=\"date\">Specific Date<\/option>\r\n          <option value=\"month\">Specific Month<\/option>\r\n        <\/select>\r\n        <span id=\"lcModeInputs\"><\/span>\r\n        <button onclick=\"window.updateLeadCostModal()\" style=\"background:#e85d3a;color:#fff;border:none;border-radius:6px;padding:6px 14px;cursor:pointer;font-size:12px;font-weight:700\">Apply<\/button>\r\n      <\/div>\r\n      <div id=\"lcModalBody\"><\/div>\r\n    <\/div>`;\r\n  document.body.appendChild(overlay);\r\n  window.rebuildLeadCostInputs();\r\n  window.updateLeadCostModal();\r\n};\r\n\r\nwindow.closeLeadCostModal=function(){\r\n  const el=document.getElementById('bm-leadcost-modal');\r\n  if(el)el.remove();\r\n};\r\n\r\nwindow.rebuildLeadCostInputs=function(){\r\n  const mode=document.getElementById('lcMode').value;\r\n  const span=document.getElementById('lcModeInputs');\r\n  if(mode==='range'){\r\n    span.innerHTML=`<input type=\"date\" id=\"lcFrom\" style=\"padding:5px 8px;border:1.5px solid #e2ddd6;border-radius:6px;font-size:12px\"> <span style=\"color:#a89e93\">to<\/span> <input type=\"date\" id=\"lcTo\" style=\"padding:5px 8px;border:1.5px solid #e2ddd6;border-radius:6px;font-size:12px\">`;\r\n  }else if(mode==='date'){\r\n    span.innerHTML=`<input type=\"date\" id=\"lcDate\" style=\"padding:5px 8px;border:1.5px solid #e2ddd6;border-radius:6px;font-size:12px\">`;\r\n  }else if(mode==='month'){\r\n    span.innerHTML=`<input type=\"month\" id=\"lcMonth\" style=\"padding:5px 8px;border:1.5px solid #e2ddd6;border-radius:6px;font-size:12px\">`;\r\n  }else{\r\n    span.innerHTML='';\r\n  }\r\n};\r\n\r\nwindow.updateLeadCostModal=function(){\r\n  const mode=document.getElementById('lcMode').value;\r\n  const all=getAllLeadCostEntries();\r\n  let filtered=[];\r\n  let rangeLabel='';\r\n  if(mode==='today'){\r\n    const t=localDateKey(new Date());\r\n    filtered=all.filter(e=>e.date===t);\r\n    rangeLabel='Today';\r\n  }else if(mode==='range'){\r\n    const from=document.getElementById('lcFrom')?.value||'';\r\n    const to=document.getElementById('lcTo')?.value||'';\r\n    filtered=all.filter(e=>{\r\n      if(from&&e.date<from)return false;\r\n      if(to&&e.date>to)return false;\r\n      return true;\r\n    });\r\n    rangeLabel=(from||'\u2026')+' to '+(to||'\u2026');\r\n  }else if(mode==='date'){\r\n    const d=document.getElementById('lcDate')?.value||'';\r\n    filtered=all.filter(e=>e.date===d);\r\n    rangeLabel=d||'No date selected';\r\n  }else if(mode==='month'){\r\n    const mo=document.getElementById('lcMonth')?.value||'';\r\n    filtered=all.filter(e=>e.date.startsWith(mo));\r\n    rangeLabel=mo||'No month selected';\r\n  }\r\n\r\n  const totalCost=filtered.reduce((s,e)=>s+(parseFloat(e.cost)||0),0);\r\n  const totalLeads=filtered.reduce((s,e)=>s+(parseFloat(e.leads)||0),0);\r\n\r\n  const byPlatform={};\r\n  filtered.forEach(e=>{\r\n    if(!byPlatform[e.platform])byPlatform[e.platform]={cost:0,leads:0};\r\n    byPlatform[e.platform].cost+=parseFloat(e.cost)||0;\r\n    byPlatform[e.platform].leads+=parseFloat(e.leads)||0;\r\n  });\r\n\r\n  const body=document.getElementById('lcModalBody');\r\n  const avgCostPerLead=totalLeads>0?(totalCost\/totalLeads):null;\r\n  body.innerHTML=`\r\n    <div style=\"background:#f5f3ef;border-radius:8px;padding:.7rem 1rem;margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px\">\r\n      <span style=\"font-weight:700;font-size:13px;color:#1a1612\">${rangeLabel}<\/span>\r\n      <div style=\"display:flex;gap:16px\">\r\n        <span style=\"font-size:13px;color:#1a1612\"><strong style=\"color:#e85d3a\">BDT ${totalCost.toLocaleString()}<\/strong> cost<\/span>\r\n        <span style=\"font-size:13px;color:#1a1612\"><strong style=\"color:#2d7a4f\">${totalLeads}<\/strong> leads<\/span>\r\n        <span style=\"font-size:13px;color:#1a1612\"><strong style=\"color:#7c3aed\">${avgCostPerLead!==null?'BDT '+avgCostPerLead.toFixed(0):'\u2014'}<\/strong> \/ lead<\/span>\r\n      <\/div>\r\n    <\/div>\r\n    <table style=\"width:100%;border-collapse:collapse;font-size:12px\">\r\n      <thead><tr style=\"background:#ede9e3\"><th style=\"padding:6px 10px;text-align:left\">Platform<\/th><th style=\"padding:6px 10px;text-align:right\">Cost (BDT)<\/th><th style=\"padding:6px 10px;text-align:center\">Leads<\/th><th style=\"padding:6px 10px;text-align:right\">Cost \/ Lead<\/th><\/tr><\/thead>\r\n      <tbody>\r\n        ${Object.entries(byPlatform).sort((a,b)=>b[1].cost-a[1].cost).map(([p,v],i)=>{\r\n          const perLead=v.leads>0?(v.cost\/v.leads):null;\r\n          return`\r\n          <tr style=\"background:${i%2===0?'#fff':'#f8f9fa'}\">\r\n            <td style=\"padding:6px 10px;font-weight:600;color:#1a1612\">${p}<\/td>\r\n            <td style=\"padding:6px 10px;text-align:right;font-family:'JetBrains Mono',monospace;color:#1a1612\">${v.cost.toLocaleString()}<\/td>\r\n            <td style=\"padding:6px 10px;text-align:center;font-weight:700;color:#e85d3a\">${v.leads}<\/td>\r\n            <td style=\"padding:6px 10px;text-align:right;font-family:'JetBrains Mono',monospace;color:${perLead!==null?'#7c3aed':'#a89e93'};font-weight:${perLead!==null?'700':'400'}\">${perLead!==null?perLead.toFixed(0):'\u2014'}<\/td>\r\n          <\/tr>`;}).join('')||'<tr><td colspan=\"4\" style=\"padding:16px;text-align:center;color:#a89e93\">No data for this range<\/td><\/tr>'}\r\n      <\/tbody>\r\n    <\/table>`;\r\n};\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<div class=\"elementor-element elementor-element-641d780 e-flex e-con-boxed e-con e-parent\" data-id=\"641d780\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-acf92a6 elementor-widget elementor-widget-html\" data-id=\"acf92a6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Sales Dashboard \u2014 Salmon Developers<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n:root{--sd-bg:#f5f3ef;--sd-bg2:#ffffff;--sd-bg3:#ede9e3;--sd-border:#e2ddd6;--sd-border2:#c8c0b4;--sd-text:#1a1612;--sd-text2:#6b6257;--sd-text3:#a89e93;--sd-salmon:#e85d3a;--sd-salmon-dark:#c94a28;--sd-salmon-soft:#fdf0ed;--sd-salmon-border:rgba(232,93,58,0.2);--sd-green:#2d7a4f;--sd-green-soft:#edf7f1;--sd-green-border:rgba(45,122,79,0.2);--sd-blue:#2563eb;--sd-blue-soft:#eff4ff;--sd-gold:#b45309;--sd-gold-soft:#fef9ee;--sd-shadow-sm:0 1px 3px rgba(26,22,18,0.08);--sd-shadow:0 4px 16px rgba(26,22,18,0.1);--sd-shadow-lg:0 8px 32px rgba(26,22,18,0.14)}\r\n.sd-toggle-btn{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--sd-bg2);border:2px solid var(--sd-border);border-radius:14px;padding:14px 18px;cursor:pointer;font-family:'Inter',sans-serif;transition:all 0.2s;box-shadow:var(--sd-shadow-sm);margin:0}\r\n.sd-toggle-btn:hover{border-color:var(--sd-salmon);box-shadow:var(--sd-shadow)}\r\n.sd-toggle-btn.open{border-color:var(--sd-salmon);border-radius:14px 14px 0 0;background:var(--sd-salmon-soft)}\r\n.sd-toggle-left{display:flex;align-items:center;gap:12px}\r\n.sd-toggle-icon{width:36px;height:36px;background:var(--sd-salmon);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}\r\n.sd-toggle-icon svg{width:18px;height:18px;color:#fff}\r\n.sd-toggle-title{font-size:15px;font-weight:700;color:var(--sd-text)}\r\n.sd-toggle-sub{font-size:11px;color:var(--sd-text3);display:block;margin-top:1px;font-weight:500}\r\n.sd-toggle-right{display:flex;align-items:center;gap:10px}\r\n.sd-live-pill{display:flex;align-items:center;gap:5px;background:var(--sd-green-soft);border:1px solid var(--sd-green-border);border-radius:50px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--sd-green);font-family:'Inter',sans-serif}\r\n.sd-live-dot{width:6px;height:6px;background:var(--sd-green);border-radius:50%;animation:sd-blink 1.8s infinite}\r\n@keyframes sd-blink{0%,100%{opacity:1}50%{opacity:.3}}\r\n.sd-chevron{font-size:13px;color:var(--sd-text3);transition:transform 0.3s}\r\n.sd-toggle-btn.open .sd-chevron{transform:rotate(180deg);color:var(--sd-salmon)}\r\n.sd-panel{display:none;background:var(--sd-bg2);border:2px solid var(--sd-salmon);border-top:none;border-radius:0 0 14px 14px;overflow:hidden;box-shadow:var(--sd-shadow-lg);font-family:'Inter',sans-serif}\r\n.sd-panel.open{display:block}\r\n.sd-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--sd-border);flex-wrap:wrap;gap:8px;background:var(--sd-bg3)}\r\n.sd-toolbar-info{font-size:12px;color:var(--sd-text3);font-weight:600}\r\n.sd-toolbar-info strong{color:var(--sd-text);font-size:12px}\r\n.sd-toolbar-right{display:flex;align-items:center;gap:8px}\r\n.sd-sync-badge{font-size:11px;color:var(--sd-text2);display:flex;align-items:center;gap:5px;font-weight:600}\r\n.sd-btn{background:var(--sd-bg2);border:1.5px solid var(--sd-border);color:var(--sd-text2);padding:6px 13px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}\r\n.sd-btn:hover{border-color:var(--sd-salmon);color:var(--sd-salmon)}\r\n.sd-btn-pdf{background:var(--sd-salmon);color:#fff;border-color:var(--sd-salmon)}\r\n.sd-btn-pdf:hover{background:var(--sd-salmon-dark);border-color:var(--sd-salmon-dark);color:#fff}\r\n.sd-tabs{display:flex;gap:3px;padding:8px 12px;background:var(--sd-bg2);border-bottom:1px solid var(--sd-border);overflow-x:auto;-webkit-overflow-scrolling:touch}\r\n.sd-tab{padding:8px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:var(--sd-text2);transition:all .15s;border:none;background:none;font-family:'Inter',sans-serif;white-space:nowrap;flex-shrink:0}\r\n.sd-tab:hover{color:var(--sd-text);background:var(--sd-bg3)}\r\n.sd-tab.on{background:var(--sd-salmon);color:#fff;box-shadow:0 2px 8px rgba(232,93,58,0.3)}\r\n.sd-main{padding:14px;background:var(--sd-bg)}\r\n.sd-kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:10px}\r\n.sd-kpi{background:var(--sd-bg2);border:1.5px solid var(--sd-border);border-radius:12px;padding:12px 13px;transition:all .15s;box-shadow:var(--sd-shadow-sm)}\r\n.sd-kpi:hover{border-color:var(--sd-border2);box-shadow:var(--sd-shadow)}\r\n.sd-kpi .lbl{font-size:9px;color:var(--sd-text3);font-weight:700;text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px;display:block}\r\n.sd-kpi .val{font-size:24px;font-weight:700;line-height:1;color:var(--sd-text);display:block}\r\n.sd-kpi .sub{font-size:11px;color:var(--sd-text3);margin-top:5px;display:block;font-weight:500}\r\n.sd-g2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}\r\n@media(max-width:620px){.sd-g2{grid-template-columns:1fr}}\r\n.sd-card{background:var(--sd-bg2);border:1.5px solid var(--sd-border);border-radius:12px;padding:13px;margin-bottom:10px;box-shadow:var(--sd-shadow-sm)}\r\n.sd-ctitle{font-size:10px;font-weight:700;color:var(--sd-text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}\r\n.sd-absent{background:var(--sd-salmon-soft);border:1px solid var(--sd-salmon-border);border-radius:8px;padding:8px 11px;display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:13px}\r\n.sd-absent .an{font-weight:700;color:var(--sd-salmon);flex:1}\r\n.sd-absent .al{font-size:10px;color:var(--sd-text3);font-family:'JetBrains Mono',monospace}\r\n.sd-allgood{background:var(--sd-green-soft);border:1px solid var(--sd-green-border);border-radius:8px;padding:8px 11px;font-size:13px;color:var(--sd-green);font-weight:700;display:flex;align-items:center;gap:6px;margin-bottom:6px}\r\n.sd-subrow{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--sd-bg3)}\r\n.sd-subrow:last-child{border-bottom:none}\r\n.sd-av{width:30px;height:30px;border-radius:50%;background:var(--sd-blue-soft);border:1.5px solid rgba(37,99,235,0.2);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--sd-blue);flex-shrink:0}\r\n.sd-av.g{background:var(--sd-green-soft);border-color:var(--sd-green-border);color:var(--sd-green)}\r\n.sd-av.gm{background:var(--sd-gold-soft);border-color:rgba(180,83,9,0.2);color:var(--sd-gold)}\r\n.sd-rank{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--sd-bg3)}\r\n.sd-rank:last-child{border-bottom:none}\r\n.sd-rn{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}\r\n.r1{background:var(--sd-gold-soft);color:var(--sd-gold)}.r2{background:var(--sd-bg3);color:var(--sd-text2)}.r3{background:#fff4ee;color:#c05621}.rn{background:var(--sd-bg3);color:var(--sd-text3)}\r\n.sd-rname{flex:1;font-weight:600;font-size:13px}\r\n.sd-rstats{display:flex;gap:12px}\r\n.sd-rs .v{font-size:12px;font-weight:700;font-family:'JetBrains Mono',monospace}\r\n.sd-rs .l{font-size:9px;color:var(--sd-text3);font-weight:700;text-transform:uppercase}\r\n.sd-comp{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--sd-bg3)}\r\n.sd-comp:last-child{border-bottom:none}\r\n.sd-cm{font-size:12px;color:var(--sd-text2);font-weight:500}\r\n.sd-cv{display:flex;align-items:center;gap:10px}\r\n.sd-ct{font-size:14px;font-weight:700;font-family:'JetBrains Mono',monospace}\r\n.sd-cy{font-size:11px;color:var(--sd-text3);font-family:'JetBrains Mono',monospace}\r\n.sd-chg{font-size:11px;font-weight:700;min-width:50px;text-align:right;font-family:'JetBrains Mono',monospace}\r\n.up{color:var(--sd-green)}.dn{color:var(--sd-salmon)}.neu{color:var(--sd-text3)}\r\n.sdb{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;font-family:'JetBrains Mono',monospace}\r\n.bg{background:var(--sd-blue-soft);color:var(--sd-blue);border:1px solid rgba(37,99,235,0.15)}\r\n.gg{background:var(--sd-green-soft);color:var(--sd-green);border:1px solid var(--sd-green-border)}\r\n.yg{background:var(--sd-gold-soft);color:var(--sd-gold);border:1px solid rgba(180,83,9,0.15)}\r\n.gr{background:var(--sd-bg3);color:var(--sd-text3);border:1px solid var(--sd-border)}\r\n.sd-filter{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 0;margin-bottom:10px}\r\n.sd-filter label{font-size:12px;color:var(--sd-text2);font-weight:700}\r\n.sd-filter select,.sd-filter input[type=date]{background:var(--sd-bg2);border:1.5px solid var(--sd-border);color:var(--sd-text);padding:6px 10px;border-radius:8px;font-size:12px;font-family:'Inter',sans-serif;outline:none;transition:border-color .15s}\r\n.sd-filter select:focus,.sd-filter input:focus{border-color:var(--sd-salmon)}\r\n.sd-rst{background:var(--sd-bg2);border:1.5px solid var(--sd-border);color:var(--sd-text2);padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}\r\n.sd-rst:hover{border-color:var(--sd-salmon);color:var(--sd-salmon)}\r\n.sd-tblwrap{overflow-x:auto;border-radius:8px;border:1.5px solid var(--sd-border);-webkit-overflow-scrolling:touch}\r\ntable.sdt{width:100%;border-collapse:collapse;font-size:12px}\r\ntable.sdt thead th{background:var(--sd-bg3);padding:8px 10px;text-align:left;font-weight:700;color:var(--sd-text3);font-size:10px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1.5px solid var(--sd-border);white-space:nowrap}\r\ntable.sdt tbody td{padding:8px 10px;border-bottom:1px solid var(--sd-bg3);color:var(--sd-text);white-space:nowrap}\r\ntable.sdt tbody tr:last-child td{border-bottom:none}\r\ntable.sdt tbody tr:hover td{background:var(--sd-bg)}\r\ntable.sdt tfoot td{padding:8px 10px;background:var(--sd-bg3);font-weight:700;font-family:'Inter',sans-serif}\r\n.sd-dhead{background:var(--sd-blue-soft);border:1.5px solid rgba(37,99,235,0.15);border-radius:8px 8px 0 0;padding:8px 13px;font-size:12px;font-weight:700;color:var(--sd-blue);display:flex;justify-content:space-between}\r\n.sd-dtbl{border:1.5px solid var(--sd-border);border-top:none;border-radius:0 0 8px 8px;overflow:hidden;margin-bottom:10px}\r\n.sd-phead{background:var(--sd-green-soft);border:1.5px solid var(--sd-green-border);border-radius:8px 8px 0 0;padding:10px 13px;display:flex;align-items:center;gap:10px}\r\n.sd-phead.gm-head{background:var(--sd-gold-soft);border-color:rgba(180,83,9,0.2)}\r\n.sd-ptbl{border:1.5px solid var(--sd-border);border-top:none;border-radius:0 0 8px 8px;overflow:hidden;margin-bottom:10px}\r\n.sd-brow{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--sd-bg3)}\r\n.sd-brow:last-child{border-bottom:none}\r\n.sd-bday{width:30px;font-size:11px;color:var(--sd-text3);font-weight:700}\r\n.sd-bdate{width:72px;font-size:11px;color:var(--sd-text3);font-family:'JetBrains Mono',monospace}\r\n.sd-btrack{flex:1;background:var(--sd-bg3);border-radius:4px;height:7px;overflow:hidden}\r\n.sd-bfill{height:100%;border-radius:4px;background:var(--sd-salmon);transition:width .5s ease}\r\n.sd-bfill.today{background:var(--sd-green)}\r\n.sd-bval{width:90px;text-align:right;font-size:11px;color:var(--sd-text2);font-family:'JetBrains Mono',monospace}\r\n.sd-btoday .sd-bday,.sd-btoday .sd-bdate,.sd-btoday .sd-bval{color:var(--sd-green);font-weight:700}\r\n.sd-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;color:var(--sd-text3);gap:10px}\r\n.sd-spin{width:26px;height:26px;border:2.5px solid var(--sd-border);border-top-color:var(--sd-salmon);border-radius:50%;animation:sd-spin .7s linear infinite}\r\n@keyframes sd-spin{to{transform:rotate(360deg)}}\r\n.sd-err{background:var(--sd-salmon-soft);border:1.5px solid var(--sd-salmon-border);border-radius:8px;padding:13px;color:var(--sd-salmon);font-size:13px;text-align:center;font-weight:700}\r\n\/* Calendar *\/\r\n.sd-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}\r\n.sd-cal-head{font-size:10px;font-weight:700;text-align:center;padding:5px 2px;color:var(--sd-text3);text-transform:uppercase;letter-spacing:.04em}\r\n.sd-cal-day{background:var(--sd-bg2);border:1.5px solid var(--sd-border);border-radius:8px;padding:5px;min-height:70px;font-size:10px}\r\n.sd-cal-day.today{border-color:var(--sd-salmon);background:var(--sd-salmon-soft)}\r\n.sd-cal-day.empty{background:transparent;border:none;min-height:0}\r\n.sd-cal-date{font-weight:700;font-size:11px;color:var(--sd-text2);margin-bottom:3px}\r\n.sd-cal-day.today .sd-cal-date{color:var(--sd-salmon)}\r\n.sd-cal-visit{font-size:10px;font-weight:600;padding:2px 5px;border-radius:4px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\r\n\/* Booking by person bars *\/\r\n.sd-pbar-row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--sd-bg3)}\r\n.sd-pbar-row:last-child{border-bottom:none}\r\n.sd-pbar-name{width:110px;font-size:12px;font-weight:600;color:var(--sd-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\r\n.sd-pbar-track{flex:1;background:var(--sd-bg3);border-radius:4px;height:8px;overflow:hidden}\r\n.sd-pbar-fill{height:100%;border-radius:4px;background:var(--sd-salmon);transition:width .5s ease}\r\n.sd-pbar-val{width:100px;text-align:right;font-size:11px;color:var(--sd-text2);font-family:'JetBrains Mono',monospace}\r\n\/* Traffic light signals *\/\r\n.sig-green{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}\r\n.sig-yellow{background:#fef9c3;color:#854d0e;border:1px solid #fde047}\r\n.sig-red{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}\r\n.sig-dot{display:inline-block;width:8px;height:8px;border-radius:50%;vertical-align:middle;margin-right:3px;flex-shrink:0}\r\n.sig-dot.green{background:#16a34a;box-shadow:0 0 4px rgba(22,163,74,0.4)}\r\n.sig-dot.red{background:#dc2626;box-shadow:0 0 4px rgba(220,38,38,0.4)}\r\n.sig-dot.yellow{background:#ca8a04;box-shadow:0 0 4px rgba(202,138,4,0.4)}\r\n.sd-absent .sig-dot{margin-right:0}\r\n.sd-allgood .sig-dot{margin-right:4px}\r\n\/* KPI signal borders *\/\r\n.sd-kpi.kpi-good{border-color:#bbf7d0}\r\n.sd-kpi.kpi-warn{border-color:#fde047}\r\n.sd-kpi.kpi-bad{border-color:#fca5a5}\r\n@media print{\r\n  body *{visibility:hidden!important}\r\n  #sd-root,#sd-root *{visibility:visible!important}\r\n  #sd-root{position:absolute;left:0;top:0;width:100%}\r\n  #sd-root .sd-toggle-btn,#sd-root .sd-toolbar,#sd-root .sd-tabs,#sd-root .sd-filter{display:none!important;visibility:hidden!important}\r\n  #sd-root .sd-panel{display:block!important;border:none!important;box-shadow:none!important;border-radius:0!important;position:static!important}\r\n  #sd-root .sd-main{background:#fff!important;padding:0!important}\r\n  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}\r\n}\r\n@media(max-width:480px){.sd-kgrid{grid-template-columns:1fr 1fr}.sd-kpi .val{font-size:18px}.sd-toggle-title{font-size:14px}.sd-live-pill{display:none}.sd-toolbar-info{display:none}.sd-rstats{gap:8px}.sd-rs .v{font-size:11px}}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div id=\"sd-root\">\r\n  <button class=\"sd-toggle-btn\" id=\"sd-toggle\" onclick=\"sdToggle()\">\r\n    <div class=\"sd-toggle-left\">\r\n      <div class=\"sd-toggle-icon\">\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"10\"\/><line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"4\"\/><line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"14\"\/><\/svg>\r\n      <\/div>\r\n      <div>\r\n        <div class=\"sd-toggle-title\">Sales Dashboard<\/div>\r\n        <span class=\"sd-toggle-sub\" id=\"sd-toggle-sub\">Click to open<\/span>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"sd-toggle-right\">\r\n      <div class=\"sd-live-pill\"><div class=\"sd-live-dot\"><\/div>Live<\/div>\r\n      <span class=\"sd-chevron\">\u25bc<\/span>\r\n    <\/div>\r\n  <\/button>\r\n\r\n  <div class=\"sd-panel\" id=\"sd-panel\">\r\n    <div class=\"sd-toolbar\">\r\n      <div class=\"sd-toolbar-info\"><strong id=\"sd-pagedate\">Loading...<\/strong><\/div>\r\n      <div class=\"sd-toolbar-right\">\r\n        <div class=\"sd-sync-badge\"><div class=\"sd-live-dot\"><\/div><span id=\"sd-sync\">Loading...<\/span><\/div>\r\n        <button class=\"sd-btn\" onclick=\"sdLoad()\">\u21bb Refresh<\/button>\r\n        <button class=\"sd-btn sd-btn-pdf\" onclick=\"sdPrintOnly()\">\u2b07 PDF<\/button>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"sd-tabs\">\r\n      <button class=\"sd-tab on\" onclick=\"sdTab('summary',this)\">Summary<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('daily',this)\">Daily View<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('person',this)\">Per Person<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('trend',this)\">Trend & Booking<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('calendar',this)\">Visit Calendar<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('todo',this)\">Daily To-Do<\/button>\r\n      <button class=\"sd-tab\" onclick=\"sdTab('report',this)\">Report<\/button>\r\n    <\/div>\r\n    <div class=\"sd-main\" id=\"sd-main\">\r\n      <div class=\"sd-loading\"><div class=\"sd-spin\"><\/div><span>Loading...<\/span><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nconst CSV='https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vTzPUbd3GUudeFRQXkHTL-Nc0qjmY-Ubv0P54zu1fz82QuOVORygWqU1PXLdG_U1Ba3-0y9KN-Y-Rwa\/pub?output=csv';\r\nconst HR_PROXY='https:\/\/script.google.com\/macros\/s\/AKfycbzTaarHHDvIJE0WNz7djT135QOwz5RkakgDI1YRbDSEOEm4fV1y-Zd8NCn72Bz5tu9x\/exec';\r\n\/\/ TEAM is ALWAYS sourced live from HR's EmployeeMaster sheet (Department = \"Sales\", Employment\r\n\/\/ Status = \"Active\") \u2014 HR is the single source of truth, no separate roster sheet to maintain.\r\n\/\/ Old\/departed people's past submissions stay in DATA for historical analysis, but they\r\n\/\/ never appear as current team members unless HR still lists them Active + Sales.\r\nlet TEAM = [];\r\nconst PERSON_COLORS = [\"#b45309\",\"#2563eb\",\"#2d7a4f\",\"#7c3aed\",\"#be185d\",\"#0891b2\"];\r\n\r\nlet DATA=[],TAB='summary',isOpen=false,loaded=false,rosterLoaded=false,rosterError=false;\r\n\r\n\/\/ \u2500\u2500 HR DATA \u2014 pulled directly via the existing HR proxy (sheet=<name>) \u2500\u2500\r\n\/\/ Raw sheets have summary rows (Total\/Active\/Inactive counts etc.) ABOVE the real table,\r\n\/\/ so we search for the row whose first cell matches the expected header and treat that as\r\n\/\/ the header row \u2014 same approach the HR dashboard itself uses (extractTable in its own code).\r\nfunction parseHRRows(t){\r\n  return t.trim().split('\\n').map(line=>{\r\n    const v=[];let c='',q=false;\r\n    for(let ch of line){if(ch==='\"'){q=!q}else if(ch===','&&!q){v.push(c.trim());c=''}else c+=ch;}\r\n    v.push(c.trim());\r\n    return v.map(s=>s.replace(\/^\"|\"$\/g,'').trim());\r\n  });\r\n}\r\nfunction extractHRTable(rows,headerMatch){\r\n  const hIdx=rows.findIndex(r=>r.some(c=>(c||'').trim()===headerMatch));\r\n  if(hIdx===-1) return [];\r\n  const headers=rows[hIdx].map(h=>(h||'').trim());\r\n  return rows.slice(hIdx+1).filter(r=>r.some(c=>(c||'').trim())).map(r=>{\r\n    const obj={};\r\n    headers.forEach((h,i)=>obj[h]=(r[i]||'').trim());\r\n    return obj;\r\n  });\r\n}\r\nasync function fetchHRSheet(sheetName,headerMatch){\r\n  const r=await fetch(HR_PROXY+'?sheet='+encodeURIComponent(sheetName)+'&nocache='+Date.now());\r\n  const t=await r.text();\r\n  return extractHRTable(parseHRRows(t),headerMatch);\r\n}\r\n\r\nlet ATTENDANCE_TODAY={}; \/\/ { \"Najmus Sakib\": \"On Time\" | \"Late\" | \"Absent\" | ... }\r\n\/\/ Hardcoded name -> ToDo Sheet web app URL. No HR column needed \u2014 add a line here\r\n\/\/ whenever someone new joins Sales and gets a DailyToDo sheet deployed.\r\nconst TODO_URL_MAP = {\r\n  \"Najmus Sakib\": \"https:\/\/script.google.com\/macros\/s\/AKfycbyY0XODNjgQM5wiReougffmyZub6ZCgyM7clJqthUyHAKL5kBkY1AjaiAuZT_o58JTvZQ\/exec\",\r\n  \"Md. Riad Mia\": \"https:\/\/script.google.com\/macros\/s\/AKfycbx4MClXagprtxRxdsDFbLpqcHNOKAlM5-7Q9dNM6CUkHFIgUgg5ZRHkMxjgRLVfTTmP\/exec\",\r\n  \"Asheq Iqbal Chowdhury\": \"https:\/\/script.google.com\/macros\/s\/AKfycbxgO3n-k9pQ3UOh5A3st6RsozVx1o-GpDsh53jfBHOPMnnWaAMZDvMfd-Ezg-QaI0kSHw\/exec\",\r\n  \"Meer Mehzabin Mostofa Mohua\": \"https:\/\/script.google.com\/macros\/s\/AKfycbx57d2Q9oZ7-1U3z8KaYxxwMdc9eM1Nom59iIeIUtRWqqOB0DAu7NpZzVhneS_azlO_Tg\/exec\",\r\n  \"N. M. Ashraf\": \"https:\/\/script.google.com\/macros\/s\/AKfycby65uVYwy1qVSbydz_HjlKd-1ktO3mhq-ajwI9OU1Bl6nuLkUfzFPWyksHMCUYVtN4k\/exec\"\r\n};\r\nlet TODO_URLS={};        \/\/ { \"Najmus Sakib\": \"https:\/\/script.google.com\/...\/exec\" }\r\nlet TODO_DATA={};        \/\/ { \"Najmus Sakib\": {name,designation,tasks:[...],metrics:[...]} | null }\r\nlet ALL_SALES_PEOPLE=[]; \/\/ [{name,status}] \u2014 Department=Sales, ANY status (for Per Person dropdown)\r\n\r\nasync function loadRosterFromHR(){\r\n  try{\r\n    const employees=await fetchHRSheet('EmployeeMaster','Emp ID');\r\n    const salesAll=employees.filter(e=>e['Department']==='Sales');\r\n    ALL_SALES_PEOPLE=salesAll.map(e=>({name:e['Name'],status:e['Employment Status']||'',designation:e['Designation']||''}));\r\n    const active=salesAll.filter(e=>e['Employment Status']==='Active');\r\n    if(active.length===0){ rosterError=true; TEAM=[]; TODO_URLS={}; return; }\r\n    TEAM=active.map(e=>e['Name']);\r\n    TODO_URLS={};\r\n    active.forEach(e=>{ TODO_URLS[e['Name']]=TODO_URL_MAP[e['Name']]||''; });\r\n    rosterLoaded=true; rosterError=false;\r\n  }catch(e){\r\n    rosterError=true; TEAM=[]; TODO_URLS={};\r\n  }\r\n}\r\nasync function loadAttendanceFromHR(){\r\n  try{\r\n    const rows=await fetchHRSheet('TodaysAttendance','Name');\r\n    const m={};\r\n    rows.forEach(r=>{ if(r['Name']) m[r['Name']]=r['Status']||''; });\r\n    ATTENDANCE_TODAY=m;\r\n  }catch(e){\r\n    ATTENDANCE_TODAY={}; \/\/ attendance is supplementary \u2014 a failure here shouldn't break the dashboard\r\n  }\r\n}\r\n\/\/ Generic JSONP loader \u2014 each person's ToDo sheet is a separate Apps Script deployment,\r\n\/\/ so plain fetch() would hit CORS; a <script> tag callback avoids that entirely.\r\nfunction loadJSONP(url){\r\n  return new Promise(function(resolve){\r\n    if(!url){ resolve(null); return; }\r\n    var cbName='_todoCb_'+Date.now()+'_'+Math.floor(Math.random()*1e6);\r\n    var done=false;\r\n    function finish(v){ if(done)return; done=true; resolve(v); delete window[cbName]; if(script.parentNode)script.remove(); }\r\n    window[cbName]=function(data){ finish(data); };\r\n    var script=document.createElement('script');\r\n    script.src=url+(url.indexOf('?')>-1?'&':'?')+'callback='+cbName;\r\n    script.onerror=function(){ finish(null); };\r\n    document.body.appendChild(script);\r\n    setTimeout(function(){ finish(null); },8000);\r\n  });\r\n}\r\nasync function loadAllTodos(){\r\n  const entries=await Promise.all(TEAM.map(async name=>{\r\n    const data=await loadJSONP(TODO_URLS[name]);\r\n    return [name,(data&&!data.error)?data:null];\r\n  }));\r\n  TODO_DATA=Object.fromEntries(entries);\r\n}\r\n\r\nfunction sdToggle(){\r\n  isOpen=!isOpen;\r\n  document.getElementById('sd-panel').classList.toggle('open',isOpen);\r\n  document.getElementById('sd-toggle').classList.toggle('open',isOpen);\r\n  document.getElementById('sd-toggle-sub').textContent=isOpen?'Click to close':'Click to open';\r\n  if(isOpen&&!loaded)sdLoad();\r\n};\r\n\r\nfunction parseCSV(t){\r\n  const lines=t.trim().split('\\n');\r\n  const h=lines[0].split(',').map(s=>s.replace(\/^\"|\"$\/g,'').trim());\r\n  return lines.slice(1).map(l=>{\r\n    const v=[];let c='',q=false;\r\n    for(let ch of l){if(ch==='\"'){q=!q}else if(ch===','&&!q){v.push(c.trim());c=''}else c+=ch;}\r\n    v.push(c.trim());\r\n    const r={};h.forEach((k,i)=>r[k]=(v[i]||'').replace(\/^\"|\"$\/g,'').trim());\r\n    \/\/ Normalize name variations\r\n    if(r['Your name']){\r\n      var n=r['Your name'].trim();\r\n      \/\/ All Mehedi\/Mehed\/Mehd variations \u2192 Mr. Mehedi\r\n      if(\/mr\\.?\\s*\\.?\\s*mehed\/i.test(n)) r['Your name']='Mr. Mehedi';\r\n      else if(\/mehedi\/i.test(n)) r['Your name']='Mr. Mehedi';\r\n      else if(\/mehed$\/i.test(n)) r['Your name']='Mr. Mehedi';\r\n      else r['Your name']=n.replace(\/Mr\\s+\\.\/,'Mr.').trim();\r\n    }\r\n    return r;\r\n  }).filter(r=>r['Timestamp']);\r\n}\r\n\/\/ \u2500\u2500 MERGE: combine multiple same-person same-day rows into one \u2500\u2500\r\nfunction mergeData(rows){\r\n  const merged={};\r\n  rows.forEach(r=>{\r\n    const d=new Date(r['Timestamp']);\r\n    if(isNaN(d))return;\r\n    const key=dk(d)+'__'+(r['Your name']||'').trim();\r\n    if(!merged[key]){\r\n      \/\/ first submission \u2014 clone it\r\n      merged[key]={...r};\r\n    } else {\r\n      \/\/ subsequent submission \u2014 add numeric fields, keep latest timestamp\r\n      const existing=merged[key];\r\n      \/\/ keep latest timestamp\r\n      if(new Date(r['Timestamp'])>new Date(existing['Timestamp'])){\r\n        existing['Timestamp']=r['Timestamp'];\r\n      }\r\n      \/\/ sum all numeric fields\r\n      [\"Team meeting\",\"Today's leads\",\"Outdoor meeting\",\r\n       \"Project visit done for today\",\"Project visit for tomorrow\",\r\n       \"Followup call\",\"WhatsApp message\",\"Meeting at HO\",\r\n       \"Booking amount for today\"].forEach(f=>{\r\n        existing[f]=String(nv(existing[f])+nv(r[f]));\r\n      });\r\n    }\r\n  });\r\n  return Object.values(merged);\r\n}\r\n\r\nfunction dk(d){return`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`;}\r\nfunction fd(d){return d.toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'});}\r\nfunction ft(d){return d.toLocaleTimeString('en-GB',{hour:'2-digit',minute:'2-digit'});}\r\nfunction nv(v){if(typeof v==='number')return isNaN(v)?0:v;const n=parseFloat((v||'').trim());return isNaN(n)?0:n;}\r\nfunction ini(n){return(n||'').split(' ').filter(w=>w.length>1).map(w=>w[0]).join('').toUpperCase().slice(0,2);}\r\nfunction chg(a,b,cur){const d=a-b;if(d>0)return`<span class=\"sig-green\" style=\"font-weight:700\">\u25b2 +${cur?d.toLocaleString():d}<\/span>`;if(d<0)return`<span class=\"sig-red\" style=\"font-weight:700\">\u25bc ${cur?d.toLocaleString():d}<\/span>`;return`<span class=\"neu\">\u2014<\/span>`;}\r\nfunction bdg(v,ctx){\r\n  const n=nv(v);\r\n  if(n===0) return`<span class=\"sdb gr\">\u2014<\/span>`;\r\n  \/\/ context-aware coloring\r\n  if(ctx==='booking') return n>0?`<span class=\"sdb sig-green\">${n.toLocaleString()}<\/span>`:`<span class=\"sdb gr\">\u2014<\/span>`;\r\n  if(ctx==='leads') return n>=3?`<span class=\"sdb sig-green\">${n}<\/span>`:n>=1?`<span class=\"sdb sig-yellow\">${n}<\/span>`:`<span class=\"sdb gr\">\u2014<\/span>`;\r\n  if(ctx==='visits') return n>0?`<span class=\"sdb sig-green\">${n}<\/span>`:`<span class=\"sdb gr\">\u2014<\/span>`;\r\n  if(ctx==='followup'||ctx==='whatsapp') return n>=10?`<span class=\"sdb sig-green\">${n}<\/span>`:n>=1?`<span class=\"sdb sig-yellow\">${n}<\/span>`:`<span class=\"sdb gr\">\u2014<\/span>`;\r\n  \/\/ default: any positive = blue\r\n  return`<span class=\"sdb bg\">${n.toLocaleString()}<\/span>`;\r\n}\r\nfunction sig(val, type){\r\n  \/\/ returns a colored dot signal\r\n  if(type==='attendance') return val?'<span class=\"sig-dot green\"><\/span>':'<span class=\"sig-dot red\"><\/span>';\r\n  if(type==='number'){const n=nv(val);return n>0?'<span class=\"sig-dot green\"><\/span>':'<span class=\"sig-dot red\"><\/span>';}\r\n  return '';\r\n}\r\nfunction filterByDate(rows,f1,f2){\r\n  return rows.filter(r=>{\r\n    const d=new Date(r['Timestamp']);if(isNaN(d))return false;\r\n    const k=dk(d);\r\n    if(f1&&k<f1)return false;\r\n    if(f2&&k>f2)return false;\r\n    return true;\r\n  });\r\n}\r\n\r\nfunction sdPrintOnly(){\r\n  window.print();\r\n}\r\n\r\nlet SD_LOADING=false;\r\nasync function sdLoad(){\r\n  if(!isOpen)return;\r\n  if(SD_LOADING)return; \/\/ a load is already in progress \u2014 don't start a second overlapping one\r\n  SD_LOADING=true;\r\n  document.getElementById('sd-sync').textContent='Syncing...';\r\n  try{\r\n    VISIT_DATA_CACHE=null;\r\n    PERSON_RANGE_CACHE={};\r\n    await loadRosterFromHR();\r\n    await loadAttendanceFromHR();\r\n    await loadAllTodos();\r\n    const r=await fetch(CSV+'&t='+Date.now());\r\n    const t=await r.text();\r\n    DATA=mergeData(parseCSV(t));loaded=true;\r\n    const now=new Date();\r\n    document.getElementById('sd-sync').textContent='Updated '+ft(now);\r\n    document.getElementById('sd-pagedate').textContent=fd(now)+' \u00b7 '+DATA.length+' submissions \u00b7 '+TEAM.length+' active members';\r\n    document.getElementById('sd-toggle-sub').textContent=DATA.length+' reports \u00b7 Updated '+ft(now);\r\n    if(rosterError){\r\n      document.getElementById('sd-main').innerHTML='<div class=\"sd-err\">Could not load the active Sales team from HR (EmployeeMaster). Check that the HR proxy is reachable and at least one employee has Department = \"Sales\" and Employment Status = \"Active\".<\/div>';\r\n      return;\r\n    }\r\n    sdRender(TAB);\r\n  }catch(e){\r\n    document.getElementById('sd-main').innerHTML='<div class=\"sd-err\">Could not load data: '+e.message+'. Check sheet is published as CSV.<\/div>';\r\n    document.getElementById('sd-sync').textContent='Error';\r\n    console.error('Dashboard load error:', e);\r\n  }finally{\r\n    SD_LOADING=false;\r\n  }\r\n};\r\n\r\nlet RENDER_GEN=0;\r\nfunction sdTab(tab,btn){\r\n  TAB=tab;\r\n  RENDER_GEN++;\r\n  document.querySelectorAll('.sd-tab').forEach(b=>b.classList.remove('on'));\r\n  btn.classList.add('on');\r\n  sdRender(tab);\r\n};\r\nasync function sdRender(tab){\r\n  if(tab==='summary')rSummary();\r\n  else if(tab==='daily')rDaily();\r\n  else if(tab==='person')await rPerson();\r\n  else if(tab==='trend')rTrend();\r\n  else if(tab==='todo')rTodo();\r\n  else if(tab==='report')await rReport();\r\n  else await rCalendar();\r\n}\r\n\r\n\/\/ \u2500\u2500 SUMMARY \u2500\u2500\r\nfunction rSummary(){\r\n  const myGen=++RENDER_GEN;\r\n  const f1=document.getElementById('smf1')?.value||'';\r\n  const f2=document.getElementById('smf2')?.value||'';\r\n  const today=new Date(),tk=dk(today);\r\n  const yest=new Date(today);yest.setDate(today.getDate()-1);const yk=dk(yest);\r\n\r\n  \/\/ filtered data for KPIs\r\n  const isFiltered=!!(f1||f2);\r\n  let fData=isFiltered?filterByDate(DATA,f1,f2):DATA;\r\n  const tR=DATA.filter(r=>{const d=new Date(r['Timestamp']);return!isNaN(d)&&dk(d)===tk;});\r\n  const yR=DATA.filter(r=>{const d=new Date(r['Timestamp']);return!isNaN(d)&&dk(d)===yk;});\r\n  const tP=[...new Set(tR.map(r=>r['Your name']).filter(Boolean))];\r\n  const absent=TEAM.filter(p=>!tP.includes(p));\r\n  const tL=tR.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0),yL=yR.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n  const tB=tR.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0),yB=yR.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n  const allL=fData.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n  const allB=fData.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n\r\n  \/\/ Top performer: scored by followup + visits + calls + leads\r\n  \/\/ Top performer: today by default, filtered range if filter applied\r\n  const perfRows = isFiltered ? fData : tR;\r\n  const scores={};\r\n  perfRows.forEach(r=>{\r\n    const p=r['Your name'];if(!scores[p])scores[p]={leads:0,booking:0,pipeline:0,followup:0,visits:0,whatsapp:0};\r\n    scores[p].leads+=nv(r[\"Today's leads\"]);\r\n    scores[p].booking+=nv(r[\"Booking amount for today\"]);\r\n    scores[p].followup+=nv(r[\"Followup call\"]);\r\n    scores[p].visits+=nv(r[\"Project visit done for today\"]);\r\n    scores[p].whatsapp+=nv(r[\"WhatsApp message\"]);\r\n    scores[p].pipeline+=(nv(r[\"Pipeline Client\"])||0);\r\n    scores[p].teamMtg+=nv(r[\"Team meeting\"]);\r\n    scores[p].outdoor+=nv(r[\"Outdoor meeting\"]);\r\n  });\r\n  \/\/ Score = followup*2 + visits*3 + whatsapp + leads*2 + booking\/10000\r\n  const ranked=Object.entries(scores).map(([p,s])=>({name:p,\r\n    score:s.followup*2+s.visits*3+s.whatsapp+s.leads*2+s.booking\/10000+(s.pipeline||0),\r\n    leads:s.leads,booking:s.booking,pipeline:s.pipeline||0,followup:s.followup,visits:s.visits,whatsapp:s.whatsapp})).sort((a,b)=>b.score-a.score);\r\n  const rkc=['r1','r2','r3'],rkl=['1st','2nd','3rd','4th','5th'];\r\n\r\n  const now2=new Date(),ms2=new Date(now2.getFullYear(),now2.getMonth(),1);\r\n  const monthLeads=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n  const monthBook=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n  let h=`<div class=\"sd-filter\">\r\n    <label>From<\/label><input type=\"date\" id=\"smf1\" value=\"${f1}\" onchange=\"sdRender('summary')\">\r\n    <span style=\"color:var(--sd-text3)\">\u2192<\/span>\r\n    <label>To<\/label><input type=\"date\" id=\"smf2\" value=\"${f2}\" onchange=\"sdRender('summary')\">\r\n    <button class=\"sd-rst\" onclick=\"document.getElementById('smf1').value=\\'\\';document.getElementById('smf2').value=\\'\\';sdRender('summary')\">Reset<\/button>\r\n    ${f1||f2?'<span style=\"font-size:11px;color:var(--sd-salmon);font-weight:700\">Filtered view<\/span>':'<span style=\"font-size:11px;color:var(--sd-text3)\">Showing today<\/span>'}\r\n  <\/div>\r\n  <div class=\"sd-kgrid\">\r\n    <div class=\"sd-kpi\"><span class=\"lbl\">Today Submissions<\/span><span class=\"val\" style=\"color:var(--sd-blue)\">${tR.length}<\/span><span class=\"sub\">of ${TEAM.length} members<\/span><\/div>\r\n    <div class=\"sd-kpi\"><span class=\"lbl\">Today Leads<\/span><span class=\"val\" style=\"color:var(--sd-green)\">${tL}<\/span><span class=\"sub\">${chg(tL,yL)} vs yesterday<\/span><\/div>\r\n    <div class=\"sd-kpi\"><span class=\"lbl\">Today Booking<\/span><span class=\"val\" style=\"color:var(--sd-salmon);font-size:18px\">BDT ${tB.toLocaleString()}<\/span><span class=\"sub\">${chg(tB,yB,true)} vs yesterday<\/span><\/div>\r\n    <div class=\"sd-kpi\" style=\"cursor:pointer\" onclick=\"window._sdShowModal('leads')\"><span class=\"lbl\">${now2.toLocaleDateString('en-GB',{month:'short',year:'numeric'})} Leads<\/span><span class=\"val\">${monthLeads}<\/span><span class=\"sub\" style=\"color:var(--sd-salmon)\">\u2197 view all<\/span><\/div>\r\n    <div class=\"sd-kpi\" style=\"cursor:pointer\" onclick=\"window._sdShowModal('booking')\"><span class=\"lbl\">${now2.toLocaleDateString('en-GB',{month:'short',year:'numeric'})} Booking<\/span><span class=\"val\" style=\"font-size:16px\">BDT ${monthBook.toLocaleString()}<\/span><span class=\"sub\" style=\"color:var(--sd-salmon)\">\u2197 view all<\/span><\/div>\r\n  <\/div>\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">\ud83c\udfc6 Top Performer ${f1||f2?'(filtered)':`Today`}<\/div>`;\r\n  if(ranked.length===0)h+=`<div style=\"color:var(--sd-text3);font-size:13px\">No data for selected range<\/div>`;\r\n  else ranked.forEach((p,i)=>{h+=`<div class=\"sd-rank\">\r\n    <div class=\"sd-rn ${i<3?rkc[i]:'rn'}\">${rkl[i]||i+1}<\/div>\r\n    <div class=\"sd-rname\">${p.name}<\/div>\r\n    <div class=\"sd-rstats\">\r\n      <div class=\"sd-rs\"><div class=\"v\">${p.followup}<\/div><div class=\"l\">Calls<\/div><\/div>\r\n      <div class=\"sd-rs\"><div class=\"v\">${p.visits}<\/div><div class=\"l\">Visits<\/div><\/div>\r\n      <div class=\"sd-rs\"><div class=\"v\">${p.leads}<\/div><div class=\"l\">Leads<\/div><\/div>\r\n      <div class=\"sd-rs\"><div class=\"v\">${p.pipeline||0}<\/div><div class=\"l\">Pipeline<\/div><\/div>\r\n    <\/div><\/div>`;});\r\n  if(ranked.length>0){\r\n    const tC=ranked.reduce((s,p)=>s+p.followup,0);\r\n    const tV=ranked.reduce((s,p)=>s+p.visits,0);\r\n    const tL2=ranked.reduce((s,p)=>s+p.leads,0);\r\n    const tP2=ranked.reduce((s,p)=>s+(p.pipeline||0),0);\r\n    h+=`<div style=\"display:flex;justify-content:space-between;align-items:center;padding:7px 10px;margin-top:6px;background:var(--sd-bg3);border-radius:8px\"><span style=\"font-size:11px;font-weight:700;color:var(--sd-text2)\">Day Total<\/span><div class=\"sd-rstats\"><div class=\"sd-rs\"><div class=\"v\" style=\"color:var(--sd-salmon)\">${tC}<\/div><div class=\"l\">Calls<\/div><\/div><div class=\"sd-rs\"><div class=\"v\" style=\"color:var(--sd-green)\">${tV}<\/div><div class=\"l\">Visits<\/div><\/div><div class=\"sd-rs\"><div class=\"v\" style=\"color:var(--sd-blue)\">${tL2}<\/div><div class=\"l\">Leads<\/div><\/div><div class=\"sd-rs\"><div class=\"v\" style=\"color:var(--sd-gold)\">${tP2}<\/div><div class=\"l\">Pipeline<\/div><\/div><\/div><\/div>`;\r\n  }\r\n  h+=`<\/div>\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">\ud83d\udd50 Attendance Today (from HR)<\/div>\r\n    ${TEAM.map(p=>{\r\n      const status=ATTENDANCE_TODAY[p];\r\n      let cls='gr',label=status||'Not marked yet';\r\n      if(status==='On Time'||status==='Between 9:01-9:10')cls='sig-green';\r\n      else if(status==='Late')cls='sig-yellow';\r\n      else if(status==='Absent'||status==='Leave')cls='sig-red';\r\n      else if(status==='Day Off'||status==='Shift Duty')cls='bg';\r\n      return `<div class=\"sd-subrow\"><div class=\"sd-av g\">${ini(p)}<\/div><div style=\"flex:1;font-weight:700;font-size:13px\">${p}<\/div><span class=\"sdb ${cls}\">${label}<\/span><\/div>`;\r\n    }).join('')||'<div style=\"color:var(--sd-text3);font-size:13px\">No active team members<\/div>'}\r\n  <\/div>\r\n  <div class=\"sd-ctitle\" style=\"margin:14px 2px 8px;font-size:11px\">\ud83d\udcdd Daily To-Do<\/div>\r\n  ${TEAM.map(todoCardHTML).join('')||'<div style=\"color:var(--sd-text3);font-size:13px\">No active team members<\/div>'}\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">\ud83d\udcca Today vs Yesterday<\/div>\r\n    <div class=\"sd-comp\"><span class=\"sd-cm\">Submissions<\/span><div class=\"sd-cv\"><span class=\"sd-ct\">${tR.length}<\/span><span class=\"sd-cy\">\/ ${yR.length} yest<\/span><span class=\"sd-chg\">${chg(tR.length,yR.length)}<\/span><\/div><\/div>\r\n    <div class=\"sd-comp\"><span class=\"sd-cm\">Total Leads<\/span><div class=\"sd-cv\"><span class=\"sd-ct\">${tL}<\/span><span class=\"sd-cy\">\/ ${yL} yest<\/span><span class=\"sd-chg\">${chg(tL,yL)}<\/span><\/div><\/div>\r\n    <div class=\"sd-comp\"><span class=\"sd-cm\">Booking (BDT)<\/span><div class=\"sd-cv\"><span class=\"sd-ct\">BDT ${tB.toLocaleString()}<\/span><span class=\"sd-cy\">\/ BDT ${yB.toLocaleString()} yest<\/span><span class=\"sd-chg\">${chg(tB,yB,true)}<\/span><\/div><\/div>\r\n  <\/div>`;\r\n  if(myGen!==RENDER_GEN)return;\r\n  document.getElementById('sd-main').innerHTML=h;\r\n}\r\n\r\n\/\/ \u2500\u2500 DAILY \u2500\u2500\r\nfunction rDaily(){\r\n  const myGen=++RENDER_GEN;\r\n  const byDate={};\r\n  DATA.forEach(r=>{const d=new Date(r['Timestamp']);if(isNaN(d))return;const k=dk(d);if(!byDate[k])byDate[k]=[];byDate[k].push(r);});\r\n  const f1=document.getElementById('sdf1')?.value||'',f2=document.getElementById('sdf2')?.value||'';\r\n  const now2=new Date(),ms2=new Date(now2.getFullYear(),now2.getMonth(),1);\r\n  const monthLeads=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n  const monthBook=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n  let h=`<div class=\"sd-filter\"><label>From<\/label><input type=\"date\" id=\"sdf1\" value=\"${f1}\"><span style=\"color:var(--sd-text3)\">\u2192<\/span><label>To<\/label><input type=\"date\" id=\"sdf2\" value=\"${f2}\"><button class=\"sd-btn\" onclick=\"applyDailyFilter()\">Apply<\/button><button class=\"sd-rst\" onclick=\"resetDailyFilter()\">Reset<\/button><\/div>`;\r\n  let found=false;\r\n  Object.keys(byDate).sort().reverse().forEach(key=>{\r\n    if(f1&&key<f1)return;if(f2&&key>f2)return;\r\n    found=true;\r\n    const rows=byDate[key],d=new Date(key+'T00:00:00');\r\n    h+=`<div class=\"sd-dhead\"><span>${fd(d)}<\/span><span>${rows.length} report${rows.length>1?'s':''}<\/span><\/div>\r\n    <div class=\"sd-dtbl sd-tblwrap\"><table class=\"sdt\"><thead><tr><th>Name<\/th><th>Desig.<\/th><th>Leads<\/th><th>Followup<\/th><th>Visit Done<\/th><th>Est.Tmrw<\/th><th>WhatsApp<\/th><th>Booking<\/th><th>Pipeline<\/th><\/tr><\/thead><tbody>`;\r\n    rows.forEach(r=>{h+=`<tr>\r\n        <td><div style=\"display:flex;align-items:center;gap:6px\"><div class=\"sd-av\">${ini(r['Your name'])}<\/div>${r['Your name']}<\/div><\/td>\r\n        <td style=\"color:var(--sd-text2)\">${r['Your Designation']||'\u2014'}<\/td>\r\n        <td>${bdg(r[\"Today's leads\"],\"leads\")}<\/td>\r\n        <td>${bdg(r[\"Followup call\"],\"followup\")}<\/td>\r\n        <td>${bdg(r[\"Project visit done for today\"],\"visits\")}<\/td>\r\n        <td>${bdg(r[\"Project visit for tomorrow\"],\"visits\")}<\/td>\r\n        <td>${bdg(r[\"WhatsApp message\"],\"whatsapp\")}<\/td>\r\n        <td>${bdg(r[\"Booking amount for today\"],\"booking\")}<\/td>\r\n        <td>${bdg(r[\"Pipeline Client\"],\"leads\")}<\/td>\r\n      <\/tr>`;});\r\n    h+=`<\/tbody><\/table><\/div>`;\r\n  });\r\n  if(!found)h+=`<div style=\"color:var(--sd-text3);font-size:13px;padding:1rem 0;text-align:center\">No data for selected range<\/div>`;\r\n  if(myGen!==RENDER_GEN)return;\r\n  document.getElementById('sd-main').innerHTML=h;\r\n}\r\n\r\n\/\/ \u2500\u2500 PER PERSON \u2500\u2500\r\nlet PERSON_RANGE_CACHE={};\r\nasync function fetchPersonRangeTodo(name,f1,f2){\r\n  const url=TODO_URL_MAP[name];\r\n  if(!url) return null;\r\n  const key=name+'|'+f1+'|'+f2;\r\n  if(PERSON_RANGE_CACHE[key]!==undefined) return PERSON_RANGE_CACHE[key];\r\n  const qUrl=url+(url.indexOf('?')>-1?'&':'?')+'action=range&from='+encodeURIComponent(f1||'')+'&to='+encodeURIComponent(f2||'');\r\n  const data=await loadJSONP(qUrl);\r\n  const result=(data&&!data.error)?data:null;\r\n  PERSON_RANGE_CACHE[key]=result;\r\n  return result;\r\n}\r\nfunction personRangeTodoHTML(person,rangeData,f1,f2){\r\n  if(!TODO_URL_MAP[person]) return ''; \/\/ no ToDo sheet deployed for this person yet \u2014 nothing to show\r\n  const rangeLabel=(f1||f2)?`${f1||'\u2026'} \u2192 ${f2||'\u2026'}`:'All time';\r\n  let h=`<div class=\"sd-card\"><div class=\"sd-ctitle\">\ud83d\udcdd Daily To-Do \u2014 ${rangeLabel}<\/div>`;\r\n  if(!rangeData){\r\n    h+=`<div style=\"color:var(--sd-text3);font-size:12px\">Could not load ToDo history for this person right now.<\/div><\/div>`;\r\n    return h;\r\n  }\r\n  const tasks=(rangeData.tasks||[]).slice().sort((a,b)=>String(b.date).localeCompare(String(a.date)));\r\n  const metricsByDate=rangeData.metricsByDate||{};\r\n  if(tasks.length===0){\r\n    h+=`<div style=\"color:var(--sd-salmon);font-weight:600;font-size:12px;margin-bottom:8px\">No todo list submitted in this range.<\/div>`;\r\n  }else{\r\n    tasks.forEach(x=>{\r\n      h+=`<div style=\"display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--sd-bg3)\">\r\n        <span style=\"font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--sd-text3);width:72px;flex-shrink:0\">${x.date}<\/span>\r\n        <div style=\"flex:1;min-width:0\">\r\n          <div style=\"font-size:9px;color:var(--sd-text3);text-transform:uppercase;font-weight:700\">${x.category||'\u2014'}<\/div>\r\n          <div style=\"font-size:13px\">${x.task||''}<\/div>\r\n          ${x.outcome?`<div style=\"font-size:11px;color:var(--sd-text2);margin-top:2px\">Output: ${x.outcome}<\/div>`:''}\r\n        <\/div>\r\n        <span class=\"sdb ${todoStatusCls(x.status)}\">${todoStatusLabel(x.status)}<\/span>\r\n      <\/div>`;\r\n    });\r\n  }\r\n  const dateKeys=Object.keys(metricsByDate).sort().reverse();\r\n  if(dateKeys.length>0){\r\n    h+=`<div style=\"margin-top:10px;font-size:9px;font-weight:700;color:var(--sd-text3);text-transform:uppercase;letter-spacing:.06em\">Form \/ Metric Counts by Day<\/div>`;\r\n    dateKeys.forEach(dt=>{\r\n      h+=`<div style=\"margin-top:6px;padding:8px;background:var(--sd-bg);border-radius:8px\">\r\n        <div style=\"font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--sd-text3);margin-bottom:5px\">${dt}<\/div>\r\n        <div style=\"display:flex;flex-direction:column;gap:4px\">\r\n          ${metricsByDate[dt].map(metricRowHTML).join('')}\r\n        <\/div>\r\n      <\/div>`;\r\n    });\r\n  }\r\n  h+='<\/div>';\r\n  return h;\r\n}\r\nasync function rPerson(){\r\n  const myGen=++RENDER_GEN;\r\n  const fp=document.getElementById('sdpf')?.value||'';\r\n  const f1=document.getElementById('spf1')?.value||'';\r\n  const f2=document.getElementById('spf2')?.value||'';\r\n  const hrNames=ALL_SALES_PEOPLE.map(p=>p.name);\r\n  const dataNames=[...new Set(DATA.map(r=>r['Your name']).filter(Boolean))];\r\n  const allPersons=[...new Set([...hrNames,...dataNames])].sort();\r\n  let h=`<div class=\"sd-filter\">\r\n    <label>Person<\/label>\r\n    <select id=\"sdpf\" onchange=\"sdRender('person')\"><option value=\"\">All persons<\/option>${allPersons.map(p=>`<option value=\"${p}\" ${fp===p?'selected':''}>${p}<\/option>`).join('')}<\/select>\r\n    <label>From<\/label><input type=\"date\" id=\"spf1\" value=\"${f1}\" onchange=\"sdRender('person')\">\r\n    <span style=\"color:var(--sd-text3)\">\u2192<\/span>\r\n    <label>To<\/label><input type=\"date\" id=\"spf2\" value=\"${f2}\" onchange=\"sdRender('person')\">\r\n    <button class=\"sd-rst\" onclick=\"document.getElementById('spf1').value='';document.getElementById('spf2').value='';sdRender('person')\">Reset<\/button>\r\n  <\/div>`;\r\n  document.getElementById('sd-main').innerHTML=h+'<div style=\"padding:20px;text-align:center;color:var(--sd-text3);font-size:13px\">Loading report\u2026<\/div>';\r\n\r\n  const persons=fp?[fp]:allPersons;\r\n  const rangeEntries=await Promise.all(persons.map(async person=>[person,await fetchPersonRangeTodo(person,f1,f2)]));\r\n  const rangeMap=Object.fromEntries(rangeEntries);\r\n\r\n  persons.forEach(person=>{\r\n    let pr=DATA.filter(r=>r['Your name']===person);\r\n    pr=filterByDate(pr,f1,f2);\r\n    pr.sort((a,b)=>new Date(b['Timestamp'])-new Date(a['Timestamp']));\r\n    const tL=pr.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0),tB=pr.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n    const notCurrent=TEAM.length>0&&!TEAM.includes(person);\r\n    const hasTodoSheet=!!TODO_URL_MAP[person];\r\n    h+=`<div class=\"sd-phead\"><div class=\"sd-av g\">${ini(person)}<\/div><div><div style=\"font-weight:700;font-size:13px\">${person}${notCurrent?' <span style=\"font-size:10px;color:var(--sd-text3);background:var(--sd-bg3);padding:1px 6px;border-radius:10px;margin-left:4px\">Not current team<\/span>':''}<\/div><div style=\"font-size:11px;color:var(--sd-text2)\">${pr[0]?.['Your Designation']||''} \u00b7 ${pr.length} reports \u00b7 ${tL} leads \u00b7 BDT ${tB.toLocaleString()}<\/div><\/div><\/div>`;\r\n    if(!hasTodoSheet){\r\n      \/\/ No ToDo sheet for this person (e.g. departed before this system existed) \u2014\r\n      \/\/ the raw Form submission table is their only available data source.\r\n      h+=`<div class=\"sd-ptbl sd-tblwrap\"><table class=\"sdt\"><thead><tr><th>Date<\/th><th>Team Mtg<\/th><th>Leads<\/th><th>Outdoor Mtg<\/th><th>Visit Done<\/th><th>Est.Tmrw<\/th><th>Followup<\/th><th>WhatsApp<\/th><th>Mtg at HO<\/th><th>Booking<\/th><th>Pipeline<\/th><\/tr><\/thead><tbody>`;\r\n      if(pr.length===0){h+=`<tr><td colspan=\"10\" style=\"color:var(--sd-text3);text-align:center;padding:12px\">No data for selected range<\/td><\/tr>`;}\r\n      else pr.forEach(r=>{const d=new Date(r['Timestamp']);h+=`<tr><td style=\"font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--sd-text3)\">${isNaN(d)?'\u2014':fd(d)}<\/td><td>${bdg(r[\"Team meeting\"],\"default\")}<\/td><td>${bdg(r[\"Today's leads\"],\"leads\")}<\/td><td>${bdg(r[\"Outdoor meeting\"],\"visits\")}<\/td><td>${bdg(r[\"Project visit done for today\"],\"visits\")}<\/td><td>${bdg(r[\"Project visit for tomorrow\"],\"visits\")}<\/td><td>${bdg(r[\"Followup call\"],\"followup\")}<\/td><td>${bdg(r[\"WhatsApp message\"],\"whatsapp\")}<\/td><td>${bdg(r[\"Meeting at HO\"],\"default\")}<\/td><td>${bdg(r[\"Booking amount for today\"],\"booking\")}<\/td><td>${bdg(r[\"Pipeline Client\"],\"leads\")}<\/td><\/tr>`;});\r\n      h+=`<\/tbody><\/table><\/div>`;\r\n    }\r\n    h+=personRangeTodoHTML(person,rangeMap[person],f1,f2);\r\n  });\r\n  if(myGen!==RENDER_GEN)return; \/\/ a newer tab switch\/filter happened while this was loading \u2014 discard this stale result\r\n  document.getElementById('sd-main').innerHTML=h;\r\n}\r\n\r\n\/\/ \u2500\u2500 TREND & BOOKING \u2500\u2500\r\nfunction rTrend(){\r\n  const myGen=++RENDER_GEN;\r\n  const today=new Date(),tk=dk(today);\r\n  const f1=document.getElementById('trf1')?.value||'';\r\n  const f2=document.getElementById('trf2')?.value||'';\r\n  const d14=[],d7=[];\r\n  for(let i=13;i>=0;i--){const d=new Date(today);d.setDate(today.getDate()-i);d14.push(d);}\r\n  for(let i=6;i>=0;i--){const d=new Date(today);d.setDate(today.getDate()-i);d7.push(d);}\r\n\r\n  \/\/ Booking by person \u2014 filtered\r\n  let fData=f1||f2?filterByDate(DATA,f1,f2):DATA;\r\n  const persons=TEAM;\r\n  const bookByPerson={};\r\n  persons.forEach(p=>{bookByPerson[p]=fData.filter(r=>r['Your name']===p).reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);});\r\n  const maxPBook=Math.max(...Object.values(bookByPerson),1);\r\n\r\n  const maxB=Math.max(...d14.map(d=>{const k=dk(d);return DATA.filter(r=>{const rd=new Date(r['Timestamp']);return!isNaN(rd)&&dk(rd)===k;}).reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);}),1);\r\n  const maxL=Math.max(...d14.map(d=>{const k=dk(d);return DATA.filter(r=>{const rd=new Date(r['Timestamp']);return!isNaN(rd)&&dk(rd)===k;}).reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);}),1);\r\n  const dns=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];\r\n\r\n  const now2=new Date(),ms2=new Date(now2.getFullYear(),now2.getMonth(),1);\r\n  const monthLeads=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n  const monthBook=DATA.filter(r=>{const d=new Date(r['Timestamp']);return !isNaN(d)&&d>=ms2;}).reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n  let h=`<div class=\"sd-filter\"><label>Filter range<\/label><input type=\"date\" id=\"trf1\" value=\"${f1}\" onchange=\"sdRender('trend')\"><span style=\"color:var(--sd-text3)\">\u2192<\/span><input type=\"date\" id=\"trf2\" value=\"${f2}\" onchange=\"sdRender('trend')\"><button class=\"sd-rst\" onclick=\"document.getElementById('trf1').value='';document.getElementById('trf2').value='';sdRender('trend')\">Reset<\/button><\/div>`;\r\n\r\n  h+=`<div class=\"sd-g2\">\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">Booking by person${f1||f2?' (filtered)':' (all time)'}<\/div>`;\r\n  persons.forEach((p,i)=>{\r\n    const book=bookByPerson[p]||0;\r\n    const pct=Math.round((book\/maxPBook)*100);\r\n    const col=PERSON_COLORS[i]||'#2563eb';\r\n    h+=`<div class=\"sd-pbar-row\"><div class=\"sd-pbar-name\">${p}<\/div><div class=\"sd-pbar-track\"><div class=\"sd-pbar-fill\" style=\"width:${pct}%;background:${col}\"><\/div><\/div><div class=\"sd-pbar-val\">BDT ${book>0?book.toLocaleString():'\u2014'}<\/div><\/div>`;\r\n  });\r\n  h+=`<\/div>\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">Booking trend \u2014 last 14 days<\/div>`;\r\n  d14.forEach(d=>{const k=dk(d),it=k===tk;const rows=DATA.filter(r=>{const rd=new Date(r['Timestamp']);return!isNaN(rd)&&dk(rd)===k;});const book=rows.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);const pct=Math.round((book\/maxB)*100);h+=`<div class=\"sd-brow ${it?'sd-btoday':''}\"><div class=\"sd-bday\">${dns[d.getDay()]}<\/div><div class=\"sd-bdate\">${d.toLocaleDateString('en-GB',{day:'2-digit',month:'short'})}<\/div><div class=\"sd-btrack\"><div class=\"sd-bfill ${it?'today':''}\" style=\"width:${pct}%\"><\/div><\/div><div class=\"sd-bval\">BDT ${book>0?book.toLocaleString():'\u2014'}<\/div><\/div>`;});\r\n  h+=`<\/div><\/div>\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">Leads trend \u2014 last 14 days<\/div>`;\r\n  d14.forEach(d=>{const k=dk(d),it=k===tk;const rows=DATA.filter(r=>{const rd=new Date(r['Timestamp']);return!isNaN(rd)&&dk(rd)===k;});const leads=rows.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);const pct=Math.round((leads\/maxL)*100);h+=`<div class=\"sd-brow ${it?'sd-btoday':''}\"><div class=\"sd-bday\">${dns[d.getDay()]}<\/div><div class=\"sd-bdate\">${d.toLocaleDateString('en-GB',{day:'2-digit',month:'short'})}<\/div><div class=\"sd-btrack\"><div class=\"sd-bfill ${it?'today':''}\" style=\"width:${pct}%\"><\/div><\/div><div class=\"sd-bval\">${leads>0?leads:'\u2014'} leads<\/div><\/div>`;});\r\n  h+=`<\/div>\r\n  <div class=\"sd-card\"><div class=\"sd-ctitle\">Weekly summary \u2014 last 7 days (per person)<\/div><div class=\"sd-tblwrap\"><table class=\"sdt\"><thead><tr><th>Date<\/th><th>Day<\/th><th>Person<\/th><th>Attendance<\/th><th>Leads<\/th><th>Visits<\/th><th>Booking (BDT)<\/th><\/tr><\/thead><tbody>`;\r\n  d7.forEach(d=>{const k=dk(d),it=k===tk;\r\n    const dayRows=DATA.filter(r=>{const rd=new Date(r['Timestamp']);return!isNaN(rd)&&dk(rd)===k;});\r\n    const submittedPersons=[...new Set(dayRows.map(r=>r['Your name']).filter(Boolean))];\r\n    const allPersons=TEAM;\r\n    let firstRow=true;\r\n    allPersons.forEach(person=>{\r\n      const submitted=submittedPersons.includes(person);\r\n      const pr=dayRows.filter(r=>r['Your name']===person);\r\n      const leads=pr.reduce((s,r)=>s+nv(r[\"Today's leads\"]),0);\r\n      const visits=pr.reduce((s,r)=>s+nv(r[\"Project visit done for today\"])+nv(r[\"Project visit for tomorrow\"]),0);\r\n      const book=pr.reduce((s,r)=>s+nv(r[\"Booking amount for today\"]),0);\r\n      h+=`<tr ${it?'style=\"background:var(--sd-green-soft)\"':''}>`;\r\n      if(firstRow){h+=`<td rowspan=\"${allPersons.length}\" style=\"font-weight:${it?'700':'400'};color:${it?'var(--sd-green)':'var(--sd-text)'};vertical-align:top;padding-top:10px\">${fd(d)}<\/td><td rowspan=\"${allPersons.length}\" style=\"color:var(--sd-text3);vertical-align:top;padding-top:10px\">${dns[d.getDay()]}<\/td>`;firstRow=false;}\r\n      h+=`<td><div style=\"display:flex;align-items:center;gap:5px\"><div class=\"sd-av\" style=\"width:22px;height:22px;font-size:9px\">${ini(person)}<\/div>${person}<\/div><\/td>`;\r\n      h+=`<td>${submitted?'<span class=\"sdb sig-green\"><span class=\"sig-dot green\"><\/span>Present<\/span>':'<span class=\"sdb sig-red\"><span class=\"sig-dot red\"><\/span>Absent<\/span>'}<\/td>`;\r\n      h+=`<td>${leads>0?`<span class=\"sdb ${leads>=3?'sig-green':'sig-yellow'}\">${leads}<\/span>`:'<span class=\"sdb gr\">\u2014<\/span>'}<\/td>`;\r\n      h+=`<td>${visits>0?`<span class=\"sdb sig-green\">${visits}<\/span>`:'<span class=\"sdb gr\">\u2014<\/span>'}<\/td>`;\r\n      h+=`<td>${book>0?`<span class=\"sdb sig-green\">BDT ${book.toLocaleString()}<\/span>`:'<span class=\"sdb gr\">\u2014<\/span>'}<\/td>`;\r\n      h+=`<\/tr>`;\r\n    });\r\n  });\r\n  h+=`<\/tbody><\/table><\/div><\/div>`;\r\n  if(myGen!==RENDER_GEN)return;\r\n  document.getElementById('sd-main').innerHTML=h;\r\n}\r\n\r\n\/\/ \u2500\u2500 DAILY TO-DO (per person: manual tasks first, Form\/metric counts always below) \u2500\u2500\r\nfunction metricCtx(cat){\r\n  if(cat===\"Today's leads\"||cat==='Pipeline Client')return'leads';\r\n  if(cat==='Project visit done for today'||cat==='Project visit for tomorrow'||cat==='Outdoor meeting')return'visits';\r\n  if(cat==='Followup call')return'followup';\r\n  if(cat==='WhatsApp message')return'whatsapp';\r\n  if(cat==='Booking amount for today')return'booking';\r\n  return'default';\r\n}\r\nfunction todoStatusCls(status){\r\n  if(status==='Done')return'sig-green';\r\n  if(status==='In Progress')return'sig-yellow';\r\n  if(status==='Cancelled')return'gr';\r\n  if(!status)return'bg'; \/\/ blank status = New Task\r\n  return'sig-red'; \/\/ Pending\r\n}\r\nfunction todoStatusLabel(status){\r\n  return status||'New Task';\r\n}\r\nfunction metricRowHTML(m){\r\n  const targetDisplay=(m.target!==undefined&&m.target!==''&&m.target!==null)?m.target:'\u2014';\r\n  return `<div style=\"display:flex;justify-content:space-between;align-items:center;font-size:12px\">\r\n    <span style=\"color:var(--sd-text2)\">${m.category}<\/span>\r\n    <span style=\"display:flex;gap:6px;align-items:center\">\r\n      <span class=\"sdb gr\" style=\"font-family:'JetBrains Mono',monospace\">Target: ${targetDisplay}<\/span>\r\n      ${bdg(m.finalCount,metricCtx(m.category))}\r\n    <\/span>\r\n  <\/div>`;\r\n}\r\nfunction todoCardHTML(name){\r\n  const snap=TODO_DATA[name];\r\n  const tasks=(snap&&snap.tasks)||[];\r\n  const metrics=(snap&&snap.metrics)||[];\r\n  const done=tasks.filter(x=>x.status==='Done').length;\r\n  const inProg=tasks.filter(x=>x.status==='In Progress').length;\r\n  const pending=tasks.filter(x=>x.status!=='Done'&&x.status!=='In Progress'&&x.status!=='Cancelled').length;\r\n\r\n  let h=`<div class=\"sd-card\" style=\"padding:0;overflow:hidden;margin-bottom:12px\">\r\n      <div style=\"display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--sd-bg3)\">\r\n        <div class=\"sd-av g\">${ini(name)}<\/div>\r\n        <div style=\"flex:1;min-width:0\">\r\n          <div style=\"font-weight:700;font-size:14px\">${name}<\/div>\r\n          <div style=\"font-size:11px;color:var(--sd-text3)\">${(snap&&snap.designation)||''}<\/div>\r\n        <\/div>\r\n        <div style=\"text-align:right\">\r\n          <span class=\"sdb yg\" style=\"display:inline-block;margin-bottom:5px\">Today's To-Do<\/span>\r\n          <div style=\"font-size:10px;color:var(--sd-text2);white-space:nowrap\"><span class=\"sig-dot green\"><\/span>${done}&nbsp;&nbsp;<span class=\"sig-dot yellow\"><\/span>${inProg}&nbsp;&nbsp;<span class=\"sig-dot red\"><\/span>${pending}<\/div>\r\n        <\/div>\r\n      <\/div>`;\r\n\r\n  if(!snap){\r\n    h+=`<div style=\"padding:12px 14px;color:var(--sd-text3);font-size:12px\">Could not load this person's ToDo sheet \u2014 check its deployment \/ URL.<\/div>`;\r\n  }else{\r\n    \/\/ Manual tasks FIRST\r\n    if(tasks.length===0){\r\n      h+=`<div style=\"padding:10px 14px;color:var(--sd-salmon);font-weight:600;font-size:12px;border-bottom:1px solid var(--sd-bg3)\">No todo list submitted.<\/div>`;\r\n    }else{\r\n      tasks.forEach(x=>{\r\n        h+=`<div style=\"display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--sd-bg3)\">\r\n            <div style=\"flex:1;min-width:0\">\r\n              <div style=\"font-size:9px;color:var(--sd-text3);text-transform:uppercase;font-weight:700;letter-spacing:.04em\">${x.category||'\u2014'}<\/div>\r\n              <div style=\"font-size:13px\">${x.task||''}<\/div>\r\n              ${x.outcome?`<div style=\"font-size:11px;color:var(--sd-text2);margin-top:2px\">Output: ${x.outcome}<\/div>`:''}\r\n            <\/div>\r\n            <span class=\"sdb ${todoStatusCls(x.status)}\">${todoStatusLabel(x.status)}<\/span>\r\n          <\/div>`;\r\n      });\r\n    }\r\n    \/\/ Form\/metric counts ALWAYS below the manual task list \u2014 Target beside Actual\r\n    h+=`<div style=\"padding:10px 14px;background:var(--sd-bg)\">\r\n        <div style=\"font-size:9px;font-weight:700;color:var(--sd-text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:7px\">Form \/ Metric Counts \u2014 Target set at 9am \u00b7 Actual via Form at 6pm<\/div>\r\n        <div style=\"display:flex;flex-direction:column;gap:5px\">\r\n          ${metrics.map(metricRowHTML).join('')}\r\n        <\/div>\r\n      <\/div>`;\r\n  }\r\n  h+='<\/div>';\r\n  return h;\r\n}\r\nfunction rTodo(){\r\n  const myGen=++RENDER_GEN;\r\n  if(TEAM.length===0){\r\n    document.getElementById('sd-main').innerHTML='<div style=\"color:var(--sd-text3);font-size:13px\">No active team members<\/div>';\r\n    return;\r\n  }\r\n  if(myGen!==RENDER_GEN)return;\r\n  document.getElementById('sd-main').innerHTML=TEAM.map(todoCardHTML).join('');\r\n}\r\n\r\n\/\/ \u2500\u2500 REPORT (printable Daily Sales Report table, any date range, from Google Form data) \u2500\u2500\r\nasync function rReport(){\r\n  const myGen=++RENDER_GEN;\r\n  const today=dk(new Date());\r\n  const f1=document.getElementById('rpf1')?.value||today;\r\n  const f2=document.getElementById('rpf2')?.value||today;\r\n  const rangeRows=filterByDate(DATA,f1,f2);\r\n\r\n  const d1=new Date(f1+'T00:00:00'),d2=new Date(f2+'T00:00:00');\r\n  const monthLabel=(f1===f2)?d1.toLocaleDateString('en-GB',{month:'long',year:'numeric'})\r\n    :(d1.getMonth()===d2.getMonth()&&d1.getFullYear()===d2.getFullYear())?d1.toLocaleDateString('en-GB',{month:'long',year:'numeric'})\r\n    :d1.toLocaleDateString('en-GB',{month:'short',year:'numeric'})+' \u2013 '+d2.toLocaleDateString('en-GB',{month:'short',year:'numeric'});\r\n  const dateLabel=d1.toLocaleDateString('en-GB',{day:'2-digit',month:'2-digit',year:'numeric'})+' to '+d2.toLocaleDateString('en-GB',{day:'2-digit',month:'2-digit',year:'numeric'});\r\n\r\n  const cols=[\r\n    {key:'teamMtg',label:'Team\\nMeeting',field:'Team meeting'},\r\n    {key:'leads',label:'Today\\nLead',field:\"Today's leads\"},\r\n    {key:'outdoor',label:'Outdoor\\nMeeting',field:'Outdoor meeting'},\r\n    {key:'visitDone',label:'Today\\nProject Visit',field:'Project visit done for today'},\r\n    {key:'visitTmrw',label:'Tomorrow\\nProject Visit',field:'Project visit for tomorrow'},\r\n    {key:'followup',label:'Follow Up\/\\nCold Call',field:'Followup call'},\r\n    {key:'whatsapp',label:'What-\\nsApp',field:'WhatsApp message'},\r\n    {key:'mtgHO',label:'Meeting\\nat HO',field:'Meeting at HO'},\r\n    {key:'pipeline',label:'Pipeline\\nClient',field:'Pipeline Client'},\r\n    {key:'booking',label:'Today Booking\\nAmount',field:'Booking amount for today'}\r\n  ];\r\n\r\n  document.getElementById('sd-main').innerHTML='<div style=\"padding:20px;text-align:center;color:var(--sd-text3);font-size:13px\">Loading report\u2026<\/div>';\r\n\r\n  \/\/ Pull each person's ToDo-sheet Final Count (Form-first, manual-fallback) for this range,\r\n  \/\/ where they have a deployed ToDo sheet. Falls back to raw Form CSV for anyone who doesn't.\r\n  const rangeEntries=await Promise.all(TEAM.map(async name=>[name,await fetchPersonRangeTodo(name,f1,f2)]));\r\n  const rangeMap=Object.fromEntries(rangeEntries);\r\n\r\n  const rows=TEAM.map((name,i)=>{\r\n    const pr=rangeRows.filter(r=>r['Your name']===name);\r\n    const hrInfo=ALL_SALES_PEOPLE.find(p=>p.name===name)||{};\r\n    const designation=pr[0]?.['Your Designation']||hrInfo.designation||'';\r\n    const row={sl:i+1,name,designation};\r\n    const rd=rangeMap[name];\r\n    cols.forEach(c=>{\r\n      if(rd&&rd.metricsByDate){\r\n        let total=0;\r\n        Object.keys(rd.metricsByDate).forEach(dt=>{\r\n          rd.metricsByDate[dt].forEach(m=>{ if(m.category===c.field) total+=nv(m.finalCount); });\r\n        });\r\n        row[c.key]=total;\r\n      }else{\r\n        row[c.key]=pr.reduce((s,r)=>s+nv(r[c.field]),0);\r\n      }\r\n    });\r\n    return row;\r\n  });\r\n  const subtotal={};\r\n  cols.forEach(c=>{ subtotal[c.key]=rows.reduce((s,r)=>s+r[c.key],0); });\r\n\r\n  let h=`<div class=\"sd-filter\">\r\n    <label>From<\/label><input type=\"date\" id=\"rpf1\" value=\"${f1}\">\r\n    <span style=\"color:var(--sd-text3)\">\u2192<\/span>\r\n    <label>To<\/label><input type=\"date\" id=\"rpf2\" value=\"${f2}\">\r\n    <button class=\"sd-btn\" onclick=\"sdRender('report')\">Apply<\/button>\r\n    <button class=\"sd-rst\" onclick=\"document.getElementById('rpf1').value='';document.getElementById('rpf2').value='';sdRender('report')\">Reset (Today)<\/button>\r\n    <button class=\"sd-btn\" style=\"margin-left:auto;background:var(--sd-salmon);color:#fff;border-color:var(--sd-salmon)\" onclick=\"printSalesReport()\">\ud83d\udda8 Print \/ Share<\/button>\r\n  <\/div>\r\n  <div class=\"sd-card\" id=\"sales-report-print-area\" style=\"padding:0;overflow:hidden\">\r\n    <div style=\"padding:16px 18px 4px;text-align:center\">\r\n      <div style=\"font-size:20px;font-weight:800;font-style:italic;color:var(--sd-text)\">Salmon Developers Sales Report<\/div>\r\n      <div style=\"font-size:14px;color:var(--sd-text2);margin-top:2px\">${monthLabel}<\/div>\r\n      <div style=\"font-size:11px;color:var(--sd-text3);margin-top:4px\">Total Emp: <strong style=\"color:var(--sd-text)\">${rows.length}<\/strong><\/div>\r\n    <\/div>\r\n    <div style=\"background:var(--sd-salmon);color:#fff;text-align:center;padding:6px;font-weight:700;font-size:12px\">Date: ${dateLabel}<\/div>\r\n    <div class=\"sd-tblwrap\" style=\"border:none;border-radius:0\">\r\n      <table class=\"sdt\" style=\"font-size:11px\">\r\n        <thead><tr>\r\n          <th style=\"white-space:nowrap\">SL<\/th><th style=\"white-space:nowrap\">Sales Person Name<\/th><th style=\"white-space:nowrap\">Designation<\/th>\r\n          ${cols.map(c=>`<th style=\"white-space:pre-line;text-align:center;line-height:1.3\">${c.label}<\/th>`).join('')}\r\n        <\/tr><\/thead>\r\n        <tbody>\r\n          ${rows.length===0?`<tr><td colspan=\"${3+cols.length}\" style=\"text-align:center;padding:16px;color:var(--sd-text3)\">No active team members<\/td><\/tr>`:\r\n            rows.map((r,i)=>`<tr style=\"background:${i%2===0?'var(--sd-bg2)':'var(--sd-green-soft)'}\">\r\n              <td>${r.sl}<\/td><td style=\"font-weight:600;white-space:nowrap\">${r.name}<\/td><td style=\"white-space:nowrap\">${r.designation}<\/td>\r\n              ${cols.map(c=>`<td style=\"text-align:center\">${r[c.key]||0}<\/td>`).join('')}\r\n            <\/tr>`).join('')}\r\n        <\/tbody>\r\n        ${rows.length>0?`<tfoot><tr style=\"background:var(--sd-green-soft)\">\r\n          <td colspan=\"3\" style=\"text-align:right;font-weight:800\">Sub-Total =<\/td>\r\n          ${cols.map(c=>`<td style=\"text-align:center;font-weight:800\">${subtotal[c.key]}<\/td>`).join('')}\r\n        <\/tr><\/tfoot>`:''}\r\n      <\/table>\r\n    <\/div>\r\n  <\/div>`;\r\n  if(myGen!==RENDER_GEN)return; \/\/ a newer tab switch\/filter happened while this was loading \u2014 discard this stale result\r\n  document.getElementById('sd-main').innerHTML=h;\r\n}\r\nwindow.printSalesReport=function(){\r\n  const content=document.getElementById('sales-report-print-area').innerHTML;\r\n  const pw=window.open('','_blank','width=1100,height=750');\r\n  pw.document.write(`<!DOCTYPE html><html><head><meta charset=\"UTF-8\">\r\n  <title>Salmon Developers Sales Report<\/title>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <style>\r\n  @page{size:A4 landscape;margin:10mm}\r\n  *{box-sizing:border-box;font-family:'Inter',sans-serif;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}\r\n  body{padding:10px;background:#fff}\r\n  table{width:100%;border-collapse:collapse;table-layout:fixed}\r\n  th,td{border:1px solid #ccc;padding:4px 5px;font-size:10px;word-wrap:break-word}\r\n  <\/style><\/head><body>\r\n  ${content}\r\n  <script>window.onload=function(){setTimeout(()=>{window.print();setTimeout(()=>window.close(),1500)},400)}<\\\/script>\r\n  <\/body><\/html>`);\r\n  pw.document.close();\r\n};\r\n\r\n\/\/ \u2500\u2500 VISIT CALENDAR \u2500\u2500\r\nvar _calOffset=0;\r\nvar _graphF1=null,_graphF2=null; \/\/ Planned vs Done graph date filter (default = current week)\r\nvar _dropMonthA=null,_dropMonthB=null; \/\/ Drop-off month comparison selectors\r\n\r\nfunction _sdCurrentWeekRange(){\r\n  var t=new Date();\r\n  var dow=t.getDay();\r\n  var daysSinceSat=dow===6?0:(dow+1);\r\n  var ws=new Date(t); ws.setDate(t.getDate()-daysSinceSat); ws.setHours(0,0,0,0);\r\n  var we=new Date(ws); we.setDate(ws.getDate()+6);\r\n  return [dk(ws),dk(we)];\r\n}\r\nfunction _sdAvailableMonths(){\r\n  var seen={},months=[];\r\n  DATA.forEach(function(r){\r\n    var d=new Date(r['Timestamp']);if(isNaN(d))return;\r\n    var k=d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0');\r\n    if(!seen[k]){seen[k]=1;months.push({k:k,l:d.toLocaleDateString('en-GB',{month:'long',year:'numeric'})});}\r\n  });\r\n  months.sort(function(a,b){return b.k.localeCompare(a.k);});\r\n  return months;\r\n}\r\nfunction _sdMonthStats(monthKey){\r\n  var stats={};\r\n  TEAM.forEach(function(p){stats[p]={done:0,est:0};});\r\n  if(!monthKey) return stats;\r\n  DATA.forEach(function(r){\r\n    var p=(r['Your name']||'').trim();\r\n    if(!stats[p])return;\r\n    var rd=new Date(r['Timestamp']);if(isNaN(rd))return;\r\n    var k=rd.getFullYear()+'-'+String(rd.getMonth()+1).padStart(2,'0');\r\n    if(k!==monthKey)return;\r\n    stats[p].done+=nv(r[\"Project visit done for today\"]);\r\n    stats[p].est+=nv(r[\"Project visit for tomorrow\"]);\r\n  });\r\n  return stats;\r\n}\r\nfunction applyGraphFilter(){\r\n  _graphF1=document.getElementById('gpf1').value||null;\r\n  _graphF2=document.getElementById('gpf2').value||null;\r\n  rCalendar();\r\n}\r\nfunction resetGraphFilter(){\r\n  var cw=_sdCurrentWeekRange();\r\n  _graphF1=cw[0];_graphF2=cw[1];\r\n  rCalendar();\r\n}\r\nfunction applyDropMonths(){\r\n  _dropMonthA=document.getElementById('dmSelA').value||null;\r\n  _dropMonthB=document.getElementById('dmSelB').value||null;\r\n  rCalendar();\r\n}\r\nwindow.applyGraphFilter=applyGraphFilter;\r\nwindow.resetGraphFilter=resetGraphFilter;\r\nwindow.applyDropMonths=applyDropMonths;\r\n\r\n\/\/ Aggregated, all-time { personName: { 'YYYY-MM-DD': {done, planned} } } visit data,\r\n\/\/ sourced from each person's ToDo sheet Final Count (Form-first, manual-fallback) \u2014\r\n\/\/ the same source of truth as the Report tab. Falls back to raw Form CSV only for\r\n\/\/ people who don't have a ToDo sheet deployed. Cached per dashboard load.\r\nlet VISIT_DATA_CACHE=null;\r\nasync function getAllVisitDataByPerson(){\r\n  if(VISIT_DATA_CACHE)return VISIT_DATA_CACHE;\r\n  const result={};\r\n  TEAM.forEach(name=>{ result[name]={}; });\r\n  await Promise.all(TEAM.map(async name=>{\r\n    if(!TODO_URL_MAP[name])return; \/\/ no ToDo sheet \u2014 covered by the CSV fallback below\r\n    const rd=await fetchPersonRangeTodo(name,'','');\r\n    if(rd&&rd.metricsByDate){\r\n      Object.keys(rd.metricsByDate).forEach(dt=>{\r\n        let done=0,planned=0;\r\n        rd.metricsByDate[dt].forEach(mm=>{\r\n          if(mm.category==='Project visit done for today')done+=nv(mm.finalCount);\r\n          if(mm.category==='Project visit for tomorrow')planned+=nv(mm.finalCount);\r\n        });\r\n        result[name][dt]={done:done,planned:planned};\r\n      });\r\n    }\r\n  }));\r\n  DATA.forEach(r=>{\r\n    const name=(r['Your name']||'').trim();\r\n    if(!name||!TEAM.includes(name))return;\r\n    if(TODO_URL_MAP[name])return; \/\/ already covered by their ToDo sheet above \u2014 avoid double counting\r\n    const d=new Date(r['Timestamp']);if(isNaN(d))return;\r\n    const dt=dk(d);\r\n    if(!result[name][dt])result[name][dt]={done:0,planned:0};\r\n    result[name][dt].done+=nv(r['Project visit done for today']);\r\n    result[name][dt].planned+=nv(r['Project visit for tomorrow']);\r\n  });\r\n  VISIT_DATA_CACHE=result;\r\n  return result;\r\n}\r\nfunction _sdMonthStatsFromVisitData(monthKey,visitData){\r\n  const stats={};\r\n  TEAM.forEach(function(p){\r\n    let done=0,est=0;\r\n    Object.keys(visitData[p]||{}).forEach(function(dt){\r\n      if(dt.slice(0,7)===monthKey){done+=visitData[p][dt].done;est+=visitData[p][dt].planned;}\r\n    });\r\n    stats[p]={done:done,est:est};\r\n  });\r\n  return stats;\r\n}\r\n\r\nasync function rCalendar(){\r\n  const myGen=++RENDER_GEN;\r\n  var offset=_calOffset;\r\n  var today=new Date();\r\n  var dow=today.getDay();\r\n  var daysSinceSat=dow===6?0:(dow+1);\r\n  var weekStart=new Date(today);\r\n  weekStart.setDate(today.getDate()-daysSinceSat+(offset*7));\r\n  weekStart.setHours(0,0,0,0);\r\n  var weekDays=[];\r\n  for(var i=0;i<7;i++){var d=new Date(weekStart);d.setDate(weekStart.getDate()+i);weekDays.push(d);}\r\n  var todayKey=dk(today);\r\n  var dnsShort=['Sat','Sun','Mon','Tue','Wed','Thu','Fri'];\r\n  var rangeLabel=weekDays[0].toLocaleDateString('en-GB',{day:'2-digit',month:'short'})+' \u2013 '+weekDays[6].toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'});\r\n\r\n  document.getElementById('sd-main').innerHTML='<div style=\"padding:20px;text-align:center;color:var(--sd-text3);font-size:13px\">Loading visit calendar\u2026<\/div>';\r\n  var visitData=await getAllVisitDataByPerson();\r\n  if(myGen!==RENDER_GEN)return; \/\/ a newer tab switch\/filter happened while this was loading \u2014 discard this stale result\r\n\r\n  var m=document.getElementById('sd-main');\r\n  m.innerHTML='';\r\n\r\n  \/\/ Nav\r\n  var nav=document.createElement('div');\r\n  nav.className='sd-filter';\r\n  nav.style.justifyContent='space-between';\r\n  nav.innerHTML='<div style=\"display:flex;align-items:center;gap:8px\">'\r\n    +'<button class=\"sd-rst\" onclick=\"_calOffset--;renderCal()\">\u2190 Prev<\/button>'\r\n    +'<span style=\"font-size:13px;font-weight:700\">'+rangeLabel+'<\/span>'\r\n    +(offset<0?'<button class=\"sd-rst\" onclick=\"_calOffset++;renderCal()\">Next \u2192<\/button>':'<button class=\"sd-rst\" style=\"opacity:.4\" disabled>Next \u2192<\/button>')\r\n    +'<\/div>'\r\n    +'<button class=\"sd-rst\" onclick=\"_calOffset=0;renderCal()\">This week<\/button>';\r\n  m.appendChild(nav);\r\n\r\n  \/\/ \u2500\u2500 SECTION 1: TODAY'S VISIT DONE \u2500\u2500\r\n  var doneCard=document.createElement('div');\r\n  doneCard.className='sd-card';\r\n  var doneHtml='<div class=\"sd-ctitle\" style=\"color:var(--sd-green)\">\u2713 Visit Done This Week<\/div>'\r\n    +'<div class=\"sd-cal\">';\r\n  dnsShort.forEach(function(d){doneHtml+='<div class=\"sd-cal-head\">'+d+'<\/div>';});\r\n  weekDays.forEach(function(d){\r\n    var key=dk(d);\r\n    var isToday=key===todayKey;\r\n    var doneVisits=TEAM.filter(function(p){return visitData[p]&&visitData[p][key]&&visitData[p][key].done>0;})\r\n      .map(function(p){return {name:p,val:visitData[p][key].done};});\r\n    doneHtml+='<div class=\"sd-cal-day '+(isToday?'today':'')+'\">'\r\n      +'<div class=\"sd-cal-date\">'+d.getDate()+'<\/div>';\r\n    doneVisits.forEach(function(r){\r\n      doneHtml+='<div class=\"sd-cal-visit\" style=\"background:#dcfce7;color:#166534;border:1px solid #bbf7d0\">'\r\n        +(r.name.replace('Mr. ','').replace('Mrs. ',''))+' '+r.val+'<\/div>';\r\n    });\r\n    if(doneVisits.length===0) doneHtml+='<div style=\"font-size:9px;color:#cccccc;margin-top:4px\">\u2014<\/div>';\r\n    doneHtml+='<\/div>';\r\n  });\r\n  doneHtml+='<\/div>';\r\n  doneCard.innerHTML=doneHtml;\r\n  m.appendChild(doneCard);\r\n\r\n  \/\/ \u2500\u2500 SECTION 2: TOMORROW'S ESTIMATED VISIT \u2500\u2500\r\n  var estCard=document.createElement('div');\r\n  estCard.className='sd-card';\r\n  var estHtml='<div class=\"sd-ctitle\" style=\"color:var(--sd-gold)\">\ud83d\udcc5 Estimated Visit (Planned for Next Day)<\/div>'\r\n    +'<div class=\"sd-cal\">';\r\n  dnsShort.forEach(function(d){estHtml+='<div class=\"sd-cal-head\">'+d+'<\/div>';});\r\n  weekDays.forEach(function(d){\r\n    var key=dk(d);\r\n    var isToday=key===todayKey;\r\n    var estVisits=TEAM.filter(function(p){return visitData[p]&&visitData[p][key]&&visitData[p][key].planned>0;})\r\n      .map(function(p){return {name:p,val:visitData[p][key].planned};});\r\n    estHtml+='<div class=\"sd-cal-day '+(isToday?'today':'')+'\">'\r\n      +'<div class=\"sd-cal-date\">'+d.getDate()+'<\/div>';\r\n    estVisits.forEach(function(r){\r\n      estHtml+='<div class=\"sd-cal-visit\" style=\"background:#fef9c3;color:#854d0e;border:1px solid #fde047\">'\r\n        +(r.name.replace('Mr. ','').replace('Mrs. ',''))+' ~'+r.val+'<\/div>';\r\n    });\r\n    if(estVisits.length===0) estHtml+='<div style=\"font-size:9px;color:#cccccc;margin-top:4px\">\u2014<\/div>';\r\n    estHtml+='<\/div>';\r\n  });\r\n  estHtml+='<\/div>';\r\n  estCard.innerHTML=estHtml;\r\n  m.appendChild(estCard);\r\n\r\n  \/\/ \u2500\u2500 SECTION 3: DONE vs ESTIMATED GRAPH (custom range, default = current week) \u2500\u2500\r\n  if(_graphF1===null||_graphF2===null){\r\n    var _cw=_sdCurrentWeekRange();\r\n    _graphF1=_cw[0];_graphF2=_cw[1];\r\n  }\r\n  var graphCard=document.createElement('div');\r\n  graphCard.className='sd-card';\r\n  var personStats={};\r\n  TEAM.forEach(function(p){personStats[p]={done:0,est:0};});\r\n  TEAM.forEach(function(p){\r\n    Object.keys(visitData[p]||{}).forEach(function(dt){\r\n      if(_graphF1&&dt<_graphF1)return;\r\n      if(_graphF2&&dt>_graphF2)return;\r\n      personStats[p].done+=visitData[p][dt].done;\r\n      personStats[p].est+=visitData[p][dt].planned;\r\n    });\r\n  });\r\n  var maxVal=Math.max.apply(null,Object.values(personStats).map(function(s){return Math.max(s.done,s.est);}));\r\n  maxVal=maxVal||1;\r\n\r\n  \/\/ Build sorted array \u2014 highest \"Done\" first\r\n  var statArr=TEAM.map(function(p){\r\n    var s=personStats[p]||{done:0,est:0};\r\n    return {name:p, done:s.done, est:s.est};\r\n  });\r\n  statArr.sort(function(a,b){return b.done-a.done;});\r\n\r\n  var gRangeLabel=new Date(_graphF1+'T00:00:00').toLocaleDateString('en-GB',{day:'2-digit',month:'short'})+' \u2013 '+new Date(_graphF2+'T00:00:00').toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'});\r\n  var gHtml='<div class=\"sd-ctitle\">Visit Done vs Planned \u2014 '+gRangeLabel+'<\/div>'\r\n    +'<div class=\"sd-filter\" style=\"padding:4px 0 12px;margin-bottom:8px\">'\r\n    +'<label>From<\/label><input type=\"date\" id=\"gpf1\" value=\"'+_graphF1+'\">'\r\n    +'<span style=\"color:var(--sd-text3)\">\u2192<\/span>'\r\n    +'<label>To<\/label><input type=\"date\" id=\"gpf2\" value=\"'+_graphF2+'\">'\r\n    +'<button class=\"sd-btn\" onclick=\"applyGraphFilter()\">Apply<\/button>'\r\n    +'<button class=\"sd-rst\" onclick=\"resetGraphFilter()\">Reset (this week)<\/button>'\r\n    +'<\/div>';\r\n  statArr.forEach(function(s){\r\n    var donePct=Math.round((s.done\/maxVal)*100);\r\n    var estPct=Math.round((s.est\/maxVal)*100);\r\n    gHtml+='<div style=\"margin-bottom:10px\">'\r\n      +'<div style=\"display:flex;justify-content:space-between;margin-bottom:3px\">'\r\n      +'<span style=\"font-size:12px;font-weight:600\">'+s.name+'<\/span>'\r\n      +'<span style=\"font-size:11px;color:var(--sd-text2)\">Done: <b>'+s.done+'<\/b> &nbsp; Planned: <b>'+s.est+'<\/b><\/span>'\r\n      +'<\/div>'\r\n      +'<div style=\"display:flex;align-items:center;gap:6px;margin-bottom:3px\">'\r\n      +'<span style=\"width:55px;font-size:10px;color:#166534;font-weight:600\">\u2713 Done<\/span>'\r\n      +'<div style=\"flex:1;background:var(--sd-bg3);border-radius:4px;height:8px\">'\r\n      +'<div style=\"width:'+donePct+'%;height:100%;border-radius:4px;background:linear-gradient(90deg,#15803d,#4ade80)\"><\/div><\/div>'\r\n      +'<span style=\"width:28px;font-size:13px;font-weight:800;color:#166534;text-align:right\">'+s.done+'<\/span>'\r\n      +'<\/div>'\r\n      +'<div style=\"display:flex;align-items:center;gap:6px\">'\r\n      +'<span style=\"width:55px;font-size:10px;color:#854d0e;font-weight:600\">~ Plan<\/span>'\r\n      +'<div style=\"flex:1;background:var(--sd-bg3);border-radius:4px;height:8px\">'\r\n      +'<div style=\"width:'+estPct+'%;height:100%;border-radius:4px;background:#ca8a04\"><\/div><\/div>'\r\n      +'<span style=\"width:28px;font-size:10px;text-align:right\">'+s.est+'<\/span>'\r\n      +'<\/div><\/div>';\r\n  });\r\n  graphCard.innerHTML=gHtml;\r\n  m.appendChild(graphCard);\r\n\r\n  \/\/ \u2500\u2500 VISIT DROP-OFF RATIO \u2014 MONTH A vs MONTH B COMPARISON \u2500\u2500\r\n  \/\/ \"Drop-off\" = planned visits that were never completed (Planned \u2212 Done, floored at 0).\r\n  \/\/ Visits done beyond what was planned count as fully completed (no drop) for that person.\r\n  var availMonths=_sdAvailableMonths();\r\n  if(_dropMonthA===null||_dropMonthB===null){\r\n    if(availMonths.length>0)_dropMonthA=availMonths[0].k;\r\n    if(availMonths.length>1)_dropMonthB=availMonths[1].k; else if(availMonths.length>0)_dropMonthB=availMonths[0].k;\r\n  }\r\n  function _sdBuildDonut(monthKey,label){\r\n    var stats=_sdMonthStatsFromVisitData(monthKey,visitData);\r\n    var tPlanned=0,tCompleted=0;\r\n    TEAM.forEach(function(p){\r\n      var s=stats[p]||{done:0,est:0};\r\n      tPlanned+=s.est;\r\n      tCompleted+=Math.min(s.done,s.est);\r\n    });\r\n    var tDrop=tPlanned-tCompleted;\r\n    var dPct=tPlanned>0?Math.round((tDrop\/tPlanned)*100):0;\r\n    var donePct=100-dPct;\r\n    return '<div style=\"display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;min-width:180px\">'\r\n      +'<div style=\"font-size:12px;font-weight:700;color:var(--sd-text2)\">'+label+'<\/div>'\r\n      +'<div style=\"width:130px;height:130px;border-radius:50%;flex-shrink:0;background:conic-gradient(#dc2626 0% '+dPct+'%, #16a34a '+dPct+'% 100%);position:relative\">'\r\n      +'<div style=\"position:absolute;inset:16px;background:var(--sd-bg2);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center\">'\r\n      +'<span style=\"font-size:20px;font-weight:800;color:#dc2626\">'+dPct+'%<\/span>'\r\n      +'<span style=\"font-size:9px;color:var(--sd-text3);font-weight:700;text-transform:uppercase\">Drop-off<\/span>'\r\n      +'<\/div><\/div>'\r\n      +'<div style=\"font-size:11px;color:var(--sd-text3);text-align:center\">'\r\n      +'Completed <b style=\"color:#166534\">'+tCompleted+'<\/b> \/ Planned <b>'+tPlanned+'<\/b><br>Dropped <b style=\"color:#dc2626\">'+tDrop+'<\/b> ('+dPct+'%)'\r\n      +'<\/div><\/div>';\r\n  }\r\n  var dropCard=document.createElement('div');\r\n  dropCard.className='sd-card';\r\n  var monthOptsA=availMonths.map(function(mo){return '<option value=\"'+mo.k+'\" '+(mo.k===_dropMonthA?'selected':'')+'>'+mo.l+'<\/option>';}).join('');\r\n  var monthOptsB=availMonths.map(function(mo){return '<option value=\"'+mo.k+'\" '+(mo.k===_dropMonthB?'selected':'')+'>'+mo.l+'<\/option>';}).join('');\r\n  var monthALabel=(availMonths.find(function(mo){return mo.k===_dropMonthA;})||{}).l||'Month A';\r\n  var monthBLabel=(availMonths.find(function(mo){return mo.k===_dropMonthB;})||{}).l||'Month B';\r\n\r\n  var dHtml='<div class=\"sd-ctitle\">Visit Drop-off Ratio \u2014 Month Comparison<\/div>'\r\n    +'<div style=\"font-size:11px;color:var(--sd-text2);margin:-4px 0 12px;line-height:1.5\">'\r\n    +'\"Drop-off\" = planned visits that were never completed. A person who does more visits than planned counts as 0% drop-off.<\/div>'\r\n    +'<div class=\"sd-filter\" style=\"padding:4px 0 12px;margin-bottom:6px\">'\r\n    +'<label>Month A<\/label><select id=\"dmSelA\">'+monthOptsA+'<\/select>'\r\n    +'<label>Month B<\/label><select id=\"dmSelB\">'+monthOptsB+'<\/select>'\r\n    +'<button class=\"sd-btn\" onclick=\"applyDropMonths()\">Compare<\/button>'\r\n    +'<\/div>'\r\n    +'<div style=\"display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:14px\">'\r\n    +_sdBuildDonut(_dropMonthA,monthALabel)\r\n    +_sdBuildDonut(_dropMonthB,monthBLabel)\r\n    +'<\/div>';\r\n\r\n  \/\/ Per-person table \u2014 scoped to the current actual week (independent of nav offset \/ month selectors)\r\n  var thisWeekRange=_sdCurrentWeekRange();\r\n  var weekStats=TEAM.map(function(p){\r\n    var s={done:0,est:0};\r\n    Object.keys(visitData[p]||{}).forEach(function(dt){\r\n      if(dt<thisWeekRange[0]||dt>thisWeekRange[1])return;\r\n      s.done+=visitData[p][dt].done;\r\n      s.est+=visitData[p][dt].planned;\r\n    });\r\n    var completed=Math.min(s.done,s.est);\r\n    var drop=Math.max(s.est-s.done,0);\r\n    var dropPct=s.est>0?Math.round((drop\/s.est)*100):0;\r\n    return {name:p,done:s.done,est:s.est,drop:drop,dropPct:dropPct};\r\n  });\r\n  dHtml+='<div class=\"sd-ctitle\" style=\"margin-top:4px\">Per-Person Drop-off \u2014 This Week<\/div>';\r\n  dHtml+='<div class=\"sd-tblwrap\"><table class=\"sdt\"><thead><tr><th>Person<\/th><th>Done<\/th><th>Planned<\/th><th>Dropped<\/th><th>Drop-off %<\/th><\/tr><\/thead><tbody>';\r\n  weekStats.slice().sort(function(a,b){return b.dropPct-a.dropPct;}).forEach(function(s){\r\n    var col=s.dropPct>=50?'sig-red':s.dropPct>=20?'sig-yellow':'sig-green';\r\n    dHtml+='<tr><td>'+s.name+'<\/td><td>'+s.done+'<\/td><td>'+s.est+'<\/td><td>'+s.drop+'<\/td><td><span class=\"sdb '+col+'\">'+s.dropPct+'%<\/span><\/td><\/tr>';\r\n  });\r\n  dHtml+='<\/tbody><\/table><\/div>';\r\n  dropCard.innerHTML=dHtml;\r\n  m.appendChild(dropCard);\r\n\r\n  \/\/ Legend\r\n  var leg=document.createElement('div');leg.className='sd-card';\r\n  var lHtml='<div class=\"sd-ctitle\">Team Legend<\/div><div style=\"display:flex;flex-wrap:wrap;gap:10px\">';\r\n  TEAM.forEach(function(p,i){\r\n    var col=PERSON_COLORS[i]||'#2563eb';\r\n    lHtml+='<div style=\"display:flex;align-items:center;gap:5px;font-size:12px\">'\r\n      +'<div style=\"width:10px;height:10px;border-radius:3px;background:'+col+'\"><\/div>'+p+'<\/div>';\r\n  });\r\n  lHtml+='<\/div>';\r\n  leg.innerHTML=lHtml;\r\n  m.appendChild(leg);\r\n}\r\n\r\nwindow.renderCal=function(){rCalendar();};\r\n\r\nsetInterval(function(){if(typeof isOpen!=='undefined'&&isOpen)sdLoad();},5*60*1000);\r\nsdLoad();\r\n\r\nfunction _sdShowModal(type){\r\n  var ex=document.getElementById('sdMod');\r\n  if(ex)ex.remove();\r\n  var bg=document.createElement('div');\r\n  bg.id='sdMod';\r\n  bg.style.cssText='position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:99999;display:flex;align-items:center;justify-content:center;padding:1rem';\r\n  bg.onclick=function(e){if(e.target===bg)bg.remove();};\r\n  var box=document.createElement('div');\r\n  box.style.cssText='background:#fff;border-radius:14px;padding:1.5rem;max-width:680px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.3)';\r\n  var head=document.createElement('div');\r\n  head.style.cssText='display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem';\r\n  head.innerHTML='<h3 style=\"font-size:15px;font-weight:700\">'+(type==='leads'?'All Leads':'All Booking')+' by Person<\/h3>';\r\n  var closeBtn=document.createElement('button');\r\n  closeBtn.textContent='\u2715';\r\n  closeBtn.style.cssText='background:#f0ede8;border:none;border-radius:6px;padding:4px 10px;cursor:pointer;font-size:16px';\r\n  closeBtn.onclick=function(){bg.remove();};\r\n  head.appendChild(closeBtn);\r\n  box.appendChild(head);\r\n  var filterDiv=document.createElement('div');\r\n  filterDiv.style.cssText='display:flex;gap:8px;flex-wrap:wrap;padding:.7rem;background:#f5f3ef;border-radius:8px;margin-bottom:1rem;align-items:center';\r\n  box.appendChild(filterDiv);\r\n  var bodyDiv=document.createElement('div');\r\n  bodyDiv.id='sdModBody';\r\n  box.appendChild(bodyDiv);\r\n  bg.appendChild(box);\r\n  document.body.appendChild(bg);\r\n  var hrNames=(typeof ALL_SALES_PEOPLE!=='undefined'?ALL_SALES_PEOPLE.map(function(p){return p.name;}):[]);\r\n  var dataNames=[...new Set(DATA.map(function(r){return r['Your name'];}).filter(Boolean))];\r\n  var allP=[...new Set(hrNames.concat(dataNames))].sort();\r\n  var months=[];var seen={};\r\n  var _now=new Date();\r\n  var curKey=_now.getFullYear()+'-'+String(_now.getMonth()+1).padStart(2,'0');\r\n  months.push({k:curKey,l:_now.toLocaleDateString('en-GB',{month:'long',year:'numeric'})});\r\n  seen[curKey]=1;\r\n  DATA.forEach(function(r){\r\n    var d=new Date(r['Timestamp']);if(isNaN(d))return;\r\n    var k=d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0');\r\n    if(!seen[k]){seen[k]=1;months.push({k:k,l:d.toLocaleDateString('en-GB',{month:'long',year:'numeric'})});}\r\n  });\r\n  months.sort(function(a,b){return b.k.localeCompare(a.k);});\r\n  function addLabel(txt){var l=document.createElement('label');l.textContent=txt;l.style.cssText='font-size:11px;font-weight:600;color:#6b6257';filterDiv.appendChild(l);}\r\n  function addInput(id,type2,val){var i=document.createElement('input');i.type=type2;i.id=id;if(val)i.value=val;i.style.cssText='background:#fff;border:1.5px solid #e2ddd6;color:#1a1612;padding:4px 8px;border-radius:6px;font-size:11px';filterDiv.appendChild(i);return i;}\r\n  function addSelect(id,opts,sel){var s=document.createElement('select');s.id=id;s.style.cssText='background:#fff;border:1.5px solid #e2ddd6;color:#1a1612;padding:4px 8px;border-radius:6px;font-size:11px';opts.forEach(function(o){var op=document.createElement('option');op.value=o.v;op.textContent=o.l;if(o.v===sel)op.selected=true;s.appendChild(op);});filterDiv.appendChild(s);return s;}\r\n  function addBtn(txt,fn){var b=document.createElement('button');b.textContent=txt;b.style.cssText='background:#e85d3a;color:#fff;border:none;border-radius:6px;padding:5px 10px;cursor:pointer;font-size:11px;font-weight:700';b.onclick=fn;filterDiv.appendChild(b);}\r\n  function addBtnSec(txt,fn){var b=document.createElement('button');b.textContent=txt;b.style.cssText='background:#f5f3ef;color:#6b6257;border:1.5px solid #e2ddd6;border-radius:6px;padding:5px 10px;cursor:pointer;font-size:11px;font-weight:700';b.onclick=fn;filterDiv.appendChild(b);}\r\n  addLabel('From');addInput('sdMf1','date','');\r\n  addLabel('To');addInput('sdMf2','date','');\r\n  addLabel('Person');addSelect('sdMp',[{v:'',l:'All'}].concat(allP.map(function(p){return {v:p,l:p};})),'');\r\n  addLabel('Month');addSelect('sdMm',[{v:'',l:'All time'}].concat(months.map(function(m){return {v:m.k,l:m.l};})),curKey);\r\n  addBtn('Apply',function(){buildModal();});\r\n  addBtnSec('Reset',function(){document.getElementById('sdMf1').value='';document.getElementById('sdMf2').value='';document.getElementById('sdMp').value='';document.getElementById('sdMm').value=curKey;buildModal();});\r\n  function buildModal(){\r\n    var f1=document.getElementById('sdMf1').value;\r\n    var f2=document.getElementById('sdMf2').value;\r\n    var fp=document.getElementById('sdMp').value;\r\n    var fm=document.getElementById('sdMm').value;\r\n    if(fm){var p=fm.split('-');var last=new Date(parseInt(p[0]),parseInt(p[1]),0).getDate();f1=fm+'-01';f2=fm+'-'+String(last).padStart(2,'0');}\r\n    var fd=DATA;\r\n    if(f1||f2) fd=fd.filter(function(r){var d=new Date(r['Timestamp']);if(isNaN(d))return false;var k=d.getFullYear()+'-'+String(d.getMonth()+1).padStart(2,'0')+'-'+String(d.getDate()).padStart(2,'0');return(!f1||k>=f1)&&(!f2||k<=f2);});\r\n    if(fp) fd=fd.filter(function(r){return r['Your name']===fp;});\r\n    var totals={};\r\n    fd.forEach(function(r){var p=r['Your name'];if(!p)return;if(!totals[p])totals[p]={leads:0,book:0,count:0};totals[p].leads+=parseFloat(r[\"Today's leads\"])||0;totals[p].book+=parseFloat(r[\"Booking amount for today\"])||0;totals[p].count++;});\r\n    var sorted=Object.entries(totals).sort(function(a,b){return type==='leads'?b[1].leads-a[1].leads:b[1].book-a[1].book;});\r\n    var grand=sorted.reduce(function(s,e){return s+(type==='leads'?e[1].leads:e[1].book);},0);\r\n    var maxV=Math.max.apply(null,sorted.map(function(e){return type==='leads'?e[1].leads:e[1].book;}).concat([1]));\r\n    var colors=['#2563eb','#2d7a4f','#7c3aed','#be185d','#0891b2','#b45309'];\r\n    var mb=document.getElementById('sdModBody');mb.innerHTML='';\r\n    var gt=document.createElement('div');gt.style.cssText='background:#f5f3ef;border-radius:8px;padding:.6rem 1rem;margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center';gt.innerHTML='<span style=\"font-weight:700\">Grand Total<\/span><span style=\"font-size:18px;font-weight:800;color:#e85d3a\">'+(type==='leads'?grand:'BDT '+grand.toLocaleString())+'<\/span>';mb.appendChild(gt);\r\n    sorted.forEach(function(e,i){var p=e[0],s=e[1];var val=type==='leads'?s.leads:s.book;var pct=Math.round((val\/maxV)*100);var col=colors[i%colors.length];var row=document.createElement('div');row.style.cssText='margin-bottom:10px';row.innerHTML='<div style=\"display:flex;justify-content:space-between;margin-bottom:3px\"><span style=\"font-size:13px;font-weight:600\">'+p+'<\/span><span style=\"font-weight:700\">'+(type==='leads'?val:'BDT '+val.toLocaleString())+'<\/span><\/div><div style=\"background:#f5f3ef;border-radius:4px;height:10px\"><div style=\"width:'+pct+'%;height:100%;border-radius:4px;background:'+col+'\"><\/div><\/div><div style=\"font-size:10px;color:#a89e93;margin-top:2px\">'+s.count+' submissions<\/div>';mb.appendChild(row);});\r\n  }\r\n  buildModal();\r\n}\r\nwindow._sdShowModal=_sdShowModal;\r\n\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d183003 e-flex e-con-boxed e-con e-parent\" data-id=\"d183003\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e821fc3 elementor-widget elementor-widget-html\" data-id=\"e821fc3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"bn\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\">\r\n<title>Salmon Developers \u2014 Partner App<\/title>\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/@tabler\/icons-webfont@latest\/tabler-icons.min.css\">\r\n<style>\r\n\/* ===== RESET & BASE ===== *\/\r\n*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\nhtml { font-size: 16px; }\r\nbody { font-family: 'Segoe UI', Arial, sans-serif; background: #f5f5f5; color: #1a1a1a; }\r\n\r\n\/* ===== LAUNCH BUTTON (WordPress page) ===== *\/\r\n#salmon-launch-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  background: #c0272d;\r\n  color: #fff;\r\n  border: none;\r\n  padding: 16px 28px;\r\n  border-radius: 12px;\r\n  font-size: 16px;\r\n  font-weight: 600;\r\n  cursor: pointer;\r\n  box-shadow: 0 4px 20px rgba(192,39,45,0.35);\r\n  transition: all .2s;\r\n  font-family: inherit;\r\n}\r\n#salmon-launch-btn:hover { background: #a01f24; transform: translateY(-1px); box-shadow: 0 6px 24px rgba(192,39,45,0.45); }\r\n#salmon-launch-btn i { font-size: 22px; }\r\n\r\n\/* ===== MODAL OVERLAY ===== *\/\r\n#salmon-overlay {\r\n  display: none;\r\n  position: fixed;\r\n  inset: 0;\r\n  background: rgba(0,0,0,0.6);\r\n  z-index: 99999;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0;\r\n  backdrop-filter: blur(4px);\r\n}\r\n#salmon-overlay.open { display: flex; }\r\n\r\n\/* ===== PHONE SHELL ===== *\/\r\n#salmon-app {\r\n  width: 100%;\r\n  max-width: 420px;\r\n  height: 100dvh;\r\n  max-height: 820px;\r\n  background: #f5f5f5;\r\n  border-radius: 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow: hidden;\r\n  position: relative;\r\n  box-shadow: 0 24px 80px rgba(0,0,0,0.4);\r\n}\r\n@media (min-width: 500px) {\r\n  #salmon-app { border-radius: 28px; height: 90dvh; }\r\n}\r\n\r\n\/* ===== TOP BAR ===== *\/\r\n.s-topbar {\r\n  background: #c0272d;\r\n  color: #fff;\r\n  padding: 14px 16px 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  flex-shrink: 0;\r\n}\r\n.s-topbar-back { cursor: pointer; font-size: 22px; display: none; line-height: 1; }\r\n.s-topbar-info { flex: 1; }\r\n.s-topbar-title { font-size: 15px; font-weight: 600; }\r\n.s-topbar-sub { font-size: 11px; opacity: .8; margin-top: 1px; }\r\n.s-topbar-right { display: flex; align-items: center; gap: 10px; }\r\n.s-avatar { width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,.25); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; }\r\n.s-close-btn { cursor: pointer; font-size: 20px; opacity: .85; }\r\n\r\n\/* ===== SCROLLABLE BODY ===== *\/\r\n.s-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }\r\n.s-screen { display: none; padding: 14px 12px; }\r\n.s-screen.active { display: block; }\r\n\r\n\/* ===== BOTTOM NAV ===== *\/\r\n.s-nav {\r\n  display: flex;\r\n  border-top: 1px solid #e0e0e0;\r\n  background: #fff;\r\n  flex-shrink: 0;\r\n  padding-bottom: env(safe-area-inset-bottom);\r\n}\r\n.s-nav-item {\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  padding: 8px 2px 6px;\r\n  cursor: pointer;\r\n  font-size: 9px;\r\n  color: #888;\r\n  border-top: 2px solid transparent;\r\n  transition: all .15s;\r\n  user-select: none;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n.s-nav-item i { font-size: 22px; margin-bottom: 2px; }\r\n.s-nav-item.active { color: #c0272d; border-top-color: #c0272d; }\r\n\r\n\/* ===== CARDS ===== *\/\r\n.s-card {\r\n  background: #fff;\r\n  border-radius: 14px;\r\n  padding: 14px;\r\n  margin-bottom: 10px;\r\n  box-shadow: 0 1px 4px rgba(0,0,0,.06);\r\n}\r\n.s-card-title {\r\n  font-size: 13px;\r\n  font-weight: 600;\r\n  margin-bottom: 10px;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  color: #1a1a1a;\r\n}\r\n.s-card-title span.link { color: #c0272d; font-size: 11px; font-weight: 400; cursor: pointer; }\r\n\r\n\/* ===== GREETING ===== *\/\r\n.s-greeting {\r\n  background: linear-gradient(135deg, #c0272d 0%, #8b1a1e 100%);\r\n  color: #fff;\r\n  border-radius: 16px;\r\n  padding: 16px;\r\n  margin-bottom: 10px;\r\n}\r\n.s-greeting h2 { font-size: 15px; font-weight: 600; line-height: 1.4; }\r\n.s-greeting p { font-size: 11px; opacity: .8; margin-top: 3px; }\r\n.s-greeting-row { display: flex; justify-content: space-between; align-items: flex-end; }\r\n.s-earn-val { font-size: 22px; font-weight: 700; }\r\n.s-earn-lbl { font-size: 10px; opacity: .8; text-align: right; }\r\n\r\n\/* ===== STATS GRID ===== *\/\r\n.s-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }\r\n.s-stat { background: #fff; border-radius: 12px; padding: 12px; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.06); -webkit-tap-highlight-color: transparent; }\r\n.s-stat-val { font-size: 20px; font-weight: 700; color: #1a1a1a; }\r\n.s-stat-lbl { font-size: 10px; color: #888; margin-top: 2px; }\r\n\r\n\/* ===== PROGRESS BAR ===== *\/\r\n.s-prog-wrap { background: #f0f0f0; border-radius: 99px; height: 7px; margin: 8px 0 5px; overflow: hidden; }\r\n.s-prog-bar { height: 100%; background: #c0272d; border-radius: 99px; transition: width .4s ease; }\r\n\r\n\/* ===== LIST ROWS ===== *\/\r\n.s-list-row {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 10px 0;\r\n  border-bottom: 1px solid #f0f0f0;\r\n  cursor: pointer;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n.s-list-row:last-child { border-bottom: none; }\r\n.s-list-row:active { background: #fafafa; border-radius: 8px; }\r\n.s-av { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex-shrink: 0; }\r\n.s-row-main { flex: 1; min-width: 0; }\r\n.s-row-title { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n.s-row-sub { font-size: 11px; color: #888; margin-top: 1px; }\r\n\r\n\/* ===== BADGES ===== *\/\r\n.s-badge { font-size: 10px; padding: 3px 9px; border-radius: 99px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }\r\n\r\n\/* ===== CHECKLIST ===== *\/\r\n.s-check-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }\r\n.s-check-item:last-child { border-bottom: none; }\r\n.s-check-box {\r\n  width: 22px; height: 22px; border-radius: 6px;\r\n  border: 2px solid #d0d0d0;\r\n  display: flex; align-items: center; justify-content: center;\r\n  cursor: pointer; flex-shrink: 0; margin-top: 1px;\r\n  transition: all .15s; background: #fff;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n.s-check-box.done { background: #c0272d; border-color: #c0272d; color: #fff; }\r\n.s-check-text { flex: 1; }\r\n.s-check-title { font-size: 13px; font-weight: 500; }\r\n.s-check-title.done-text { text-decoration: line-through; color: #aaa; }\r\n.s-check-sub { font-size: 11px; color: #aaa; margin-top: 2px; }\r\n\r\n\/* ===== CALENDAR ===== *\/\r\n.s-cal { display: grid; grid-template-columns: repeat(7,1fr); gap: 4px; }\r\n.s-cal-head { font-size: 9px; color: #aaa; text-align: center; padding-bottom: 3px; font-weight: 600; }\r\n.s-cal-day { aspect-ratio: 1; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 600; }\r\n\r\n\/* ===== STATUS FILTER ===== *\/\r\n.s-filter-row { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 10px; -webkit-overflow-scrolling: touch; }\r\n.s-filter-row::-webkit-scrollbar { display: none; }\r\n.s-spill { padding: 6px 14px; border-radius: 99px; font-size: 11px; font-weight: 600; cursor: pointer; white-space: nowrap; border: 1.5px solid #e0e0e0; background: #fff; color: #888; transition: all .15s; -webkit-tap-highlight-color: transparent; }\r\n.s-spill.active { background: #c0272d; color: #fff; border-color: #c0272d; }\r\n\r\n\/* ===== MEETING ROWS ===== *\/\r\n.s-meet-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }\r\n.s-meet-row:last-child { border-bottom: none; }\r\n.s-meet-time { font-size: 11px; color: #888; min-width: 44px; text-align: center; line-height: 1.4; }\r\n.s-meet-icon { width: 34px; height: 34px; border-radius: 9px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }\r\n.s-meet-info { flex: 1; }\r\n.s-meet-title { font-size: 13px; font-weight: 600; }\r\n.s-meet-sub { font-size: 11px; color: #888; margin-top: 1px; }\r\n\r\n\/* ===== INSTALLMENT ===== *\/\r\n.s-inst-row { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid #f0f0f0; }\r\n.s-inst-row:last-child { border-bottom: none; }\r\n.s-inst-info { flex: 1; }\r\n.s-inst-name { font-size: 13px; font-weight: 500; }\r\n.s-inst-date { font-size: 11px; color: #888; margin-top: 1px; }\r\n\r\n\/* ===== COMMISSION ===== *\/\r\n.s-comm-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }\r\n.s-comm-row:last-child { border-bottom: none; }\r\n.s-comm-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }\r\n.s-comm-info { flex: 1; }\r\n.s-comm-label { font-size: 13px; font-weight: 600; }\r\n.s-comm-sub { font-size: 11px; color: #888; margin-top: 1px; }\r\n.s-comm-amount { font-size: 13px; font-weight: 700; }\r\n\r\n\/* ===== FORMS ===== *\/\r\n.s-fg { margin-bottom: 10px; }\r\n.s-fg label { display: block; font-size: 11px; color: #888; margin-bottom: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }\r\n.s-fg input, .s-fg select, .s-fg textarea {\r\n  width: 100%; padding: 10px 12px;\r\n  border: 1.5px solid #e8e8e8;\r\n  border-radius: 10px; font-size: 14px;\r\n  background: #fff; color: #1a1a1a;\r\n  font-family: inherit; outline: none;\r\n  transition: border-color .15s;\r\n  -webkit-appearance: none;\r\n}\r\n.s-fg input:focus, .s-fg select:focus, .s-fg textarea:focus { border-color: #c0272d; }\r\n.s-fg textarea { resize: vertical; min-height: 72px; }\r\n.s-r2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }\r\n\r\n\/* ===== BUTTONS ===== *\/\r\n.s-btn {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  padding: 9px 14px; border-radius: 9px;\r\n  font-size: 12px; font-weight: 600;\r\n  cursor: pointer; border: 1.5px solid #e0e0e0;\r\n  background: #fff; color: #1a1a1a;\r\n  font-family: inherit; transition: all .15s;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n.s-btn:active { transform: scale(.97); }\r\n.s-btn.primary { background: #c0272d; color: #fff; border-color: #c0272d; }\r\n.s-btn.primary:active { background: #a01f24; }\r\n.s-btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }\r\n.s-btn-full { width: 100%; justify-content: center; margin-top: 6px; }\r\n\r\n\/* ===== WARNING BOX ===== *\/\r\n.s-warn { background: #fff8e1; border: 1px solid #ffe082; color: #7a5c00; font-size: 12px; padding: 8px 12px; border-radius: 10px; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }\r\n\r\n\/* ===== REFERRAL CODE ===== *\/\r\n.s-ref-box { display: flex; align-items: center; gap: 8px; }\r\n.s-ref-code { flex: 1; background: #fdf2f2; padding: 12px 14px; border-radius: 10px; font-size: 17px; font-weight: 700; color: #c0272d; letter-spacing: .1em; }\r\n\r\n\/* ===== TOAST ===== *\/\r\n#s-toast {\r\n  position: absolute; bottom: 80px; left: 50%; transform: translateX(-50%);\r\n  background: #1a1a1a; color: #fff; padding: 10px 18px;\r\n  border-radius: 99px; font-size: 13px; white-space: nowrap;\r\n  opacity: 0; transition: opacity .25s; pointer-events: none; z-index: 100;\r\n}\r\n#s-toast.show { opacity: 1; }\r\n\r\n\/* ===== SUB-SCREENS (slide in overlay) ===== *\/\r\n.s-sub {\r\n  display: none; position: absolute; inset: 0;\r\n  background: #f5f5f5; z-index: 10;\r\n  overflow-y: auto; -webkit-overflow-scrolling: touch;\r\n  padding: 0;\r\n}\r\n.s-sub.open { display: block; }\r\n.s-sub-topbar {\r\n  background: #c0272d; color: #fff;\r\n  padding: 14px 16px 12px;\r\n  display: flex; align-items: center; gap: 10px;\r\n  position: sticky; top: 0; z-index: 1;\r\n}\r\n.s-sub-body { padding: 14px 12px; }\r\n.s-sub-title { font-size: 15px; font-weight: 600; }\r\n\r\n\/* ===== TEAM ROW ===== *\/\r\n.s-team-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }\r\n.s-team-row:last-child { border-bottom: none; }\r\n.s-tier-pill { font-size: 9px; padding: 3px 8px; border-radius: 99px; font-weight: 700; }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- ===== LAUNCH BUTTON \u2014 place this anywhere in WordPress ===== -->\r\n<div style=\"padding: 40px 20px; text-align: center;\">\r\n  <button id=\"salmon-launch-btn\" onclick=\"openApp()\">\r\n    <i class=\"ti ti-building-store\"><\/i>\r\n    Salmon Partner App \u0996\u09c1\u09b2\u09c1\u09a8\r\n  <\/button>\r\n  <p style=\"margin-top:12px;font-size:13px;color:#888;\">\u09aa\u09be\u09b0\u09cd\u099f\u09a8\u09be\u09b0 \u09b2\u0997\u09bf\u09a8 \u0995\u09b0\u09c1\u09a8 \u098f\u09ac\u0982 \u0986\u099c\u0995\u09c7\u09b0 \u0995\u09be\u099c \u09b6\u09c1\u09b0\u09c1 \u0995\u09b0\u09c1\u09a8<\/p>\r\n<\/div>\r\n\r\n<!-- ===== MODAL OVERLAY ===== -->\r\n<div id=\"salmon-overlay\">\r\n  <div id=\"salmon-app\">\r\n\r\n    <!-- TOP BAR -->\r\n    <div class=\"s-topbar\" id=\"s-topbar\">\r\n      <div class=\"s-topbar-back\" id=\"s-back\" onclick=\"goBack()\">\r\n        <i class=\"ti ti-arrow-left\"><\/i>\r\n      <\/div>\r\n      <div class=\"s-topbar-info\">\r\n        <div class=\"s-topbar-title\" id=\"s-topbar-title\">Salmon Partners<\/div>\r\n        <div class=\"s-topbar-sub\" id=\"s-topbar-sub\">\u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 \u09b8\u09c7\u09b2\u09b8 \u09aa\u09be\u09b0\u09cd\u099f\u09a8\u09be\u09b0 \u00b7 \u09b0\u09ab\u09bf\u0995\u09c1\u09b2 \u0987\u09b8\u09b2\u09be\u09ae<\/div>\r\n      <\/div>\r\n      <div class=\"s-topbar-right\">\r\n        <i class=\"ti ti-bell\" style=\"font-size:20px;cursor:pointer;\" onclick=\"toast('\u0995\u09cb\u09a8\u09cb \u09a8\u09a4\u09c1\u09a8 \u09a8\u09cb\u099f\u09bf\u09ab\u09bf\u0995\u09c7\u09b6\u09a8 \u09a8\u09c7\u0987')\"><\/i>\r\n        <div class=\"s-avatar\">\u09b0\u09ab<\/div>\r\n        <div class=\"s-close-btn\" onclick=\"closeApp()\"><i class=\"ti ti-x\"><\/i><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SCROLLABLE SCREENS -->\r\n    <div class=\"s-body\">\r\n\r\n      <!-- ===== SCREEN 1: HOME ===== -->\r\n      <div class=\"s-screen active\" id=\"sc-home\">\r\n        <div class=\"s-greeting\">\r\n          <div class=\"s-greeting-row\">\r\n            <div>\r\n              <h2>\u0986\u09b8\u09cd\u09b8\u09be\u09b2\u09be\u09ae\u09c1 \u0986\u09b2\u09be\u0987\u0995\u09c1\u09ae,<br>\u09b0\u09ab\u09bf\u0995\u09c1\u09b2 \u09ad\u09be\u0987 \ud83d\udc4b<\/h2>\r\n              <p>\u09b6\u09a8\u09bf\u09ac\u09be\u09b0, \u09e7\u09e9 \u099c\u09c1\u09a8 \u09e8\u09e6\u09e8\u09ec<\/p>\r\n            <\/div>\r\n            <div>\r\n              <div class=\"s-earn-val\">\u09f3\u09e7,\u09e8\u09ea,\u09eb\u09e6\u09e6<\/div>\r\n              <div class=\"s-earn-lbl\">\u098f\u0987 \u09ae\u09be\u09b8\u09c7\u09b0 \u0986\u09af\u09bc<\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Checklist summary -->\r\n        <div class=\"s-card\" onclick=\"navTo(document.querySelectorAll('.s-nav-item')[1],'sc-activity','\u09a6\u09c8\u09a8\u09bf\u0995 \u0995\u09be\u09b0\u09cd\u09af\u0995\u09cd\u09b0\u09ae')\" style=\"cursor:pointer;\">\r\n          <div class=\"s-card-title\">\u09a6\u09c8\u09a8\u09bf\u0995 \u099a\u09c7\u0995\u09b2\u09bf\u09b8\u09cd\u099f <span class=\"link\">\u09a6\u09c7\u0996\u09c1\u09a8 \u2192<\/span><\/div>\r\n          <div style=\"display:flex;justify-content:space-between;font-size:12px;color:#888;margin-bottom:4px;\">\r\n            <span>\u0986\u099c\u0995\u09c7\u09b0 \u0985\u0997\u09cd\u09b0\u0997\u09a4\u09bf<\/span><span id=\"home-prog-label\">\u09e9\/\u09eb \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8<\/span>\r\n          <\/div>\r\n          <div class=\"s-prog-wrap\"><div class=\"s-prog-bar\" style=\"width:60%\"><\/div><\/div>\r\n          <div style=\"font-size:11px;color:#e07000;\">\u26a0\ufe0f \u09e8\u099f\u09bf \u0995\u09be\u099c \u09ac\u09be\u0995\u09bf \u0986\u099b\u09c7 \u2014 \u09b8\u09ae\u09af\u09bc\u09ae\u09a4\u09cb \u099c\u09ae\u09be \u09a6\u09bf\u09a8<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-stats\">\r\n          <div class=\"s-stat\" onclick=\"navTo(null,'sc-clients','\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09a4\u09be\u09b2\u09bf\u0995\u09be')\">\r\n            <div class=\"s-stat-val\">\u09e7\u09ea<\/div><div class=\"s-stat-lbl\">\u09ae\u09cb\u099f \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f<\/div>\r\n          <\/div>\r\n          <div class=\"s-stat\" onclick=\"navTo(null,'sc-team','\u0986\u09ae\u09be\u09b0 \u099f\u09bf\u09ae')\">\r\n            <div class=\"s-stat-val\">\u09ec<\/div><div class=\"s-stat-lbl\">\u099f\u09bf\u09ae \u09b8\u09a6\u09b8\u09cd\u09af<\/div>\r\n          <\/div>\r\n          <div class=\"s-stat\" onclick=\"navTo(null,'sc-commission','\u0995\u09ae\u09bf\u09b6\u09a8')\">\r\n            <div class=\"s-stat-val\" style=\"color:#0a7c4e;\">\u09f3\u09ea,\u09ed\u09eb,\u09e6\u09e6\u09e6<\/div><div class=\"s-stat-lbl\">\u09ae\u09cb\u099f \u0995\u09ae\u09bf\u09b6\u09a8<\/div>\r\n          <\/div>\r\n          <div class=\"s-stat\" onclick=\"navTo(document.querySelectorAll('.s-nav-item')[3],'sc-meetings','\u09ae\u09bf\u099f\u09bf\u0982')\">\r\n            <div class=\"s-stat-val\">\u09e9<\/div><div class=\"s-stat-lbl\">\u0986\u099c\u0995\u09c7\u09b0 \u09ae\u09bf\u099f\u09bf\u0982<\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u09b8\u09be\u09ae\u09cd\u09aa\u09cd\u09b0\u09a4\u09bf\u0995 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f <span class=\"link\" onclick=\"event.stopPropagation();navTo(null,'sc-clients','\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09a4\u09be\u09b2\u09bf\u0995\u09be')\">\u09b8\u09ac \u09a6\u09c7\u0996\u09c1\u09a8 \u2192<\/span><\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae','\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ad\u09bf\u099c\u09bf\u099f \u09ac\u09c1\u0995 \u0995\u09b0\u09be','01712-345678','\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0','hot')\">\r\n            <div class=\"s-av\" style=\"background:#e8f5e9;color:#2e7d32;\">\u09b0\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae<\/div><div class=\"s-row-sub\">\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ad\u09bf\u099c\u09bf\u099f \u09ac\u09c1\u0995 \u0995\u09b0\u09be<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e8f5e9;color:#2e7d32;\">Hot<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u0995\u09be\u09ae\u09be\u09b2 \u09b9\u09cb\u09b8\u09c7\u09a8','\u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u099a\u09b2\u09ae\u09be\u09a8','01811-234567','\u09a2\u09be\u0995\u09be','booked')\">\r\n            <div class=\"s-av\" style=\"background:#e3f2fd;color:#1565c0;\">\u0995\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u0995\u09be\u09ae\u09be\u09b2 \u09b9\u09cb\u09b8\u09c7\u09a8<\/div><div class=\"s-row-sub\">\u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u099a\u09b2\u09ae\u09be\u09a8<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e3f2fd;color:#1565c0;\">\u09ac\u09c1\u0995\u09a1<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0','HO \u09ae\u09bf\u099f\u09bf\u0982 \u09aa\u09c7\u09a8\u09cd\u09a1\u09bf\u0982','01911-456789','\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae','warm')\">\r\n            <div class=\"s-av\" style=\"background:#fff3e0;color:#e65100;\">\u09b6\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0<\/div><div class=\"s-row-sub\">HO \u09ae\u09bf\u099f\u09bf\u0982 \u09aa\u09c7\u09a8\u09cd\u09a1\u09bf\u0982<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#fff3e0;color:#e65100;\">Warm<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== SCREEN 2: DAILY ACTIVITY ===== -->\r\n      <div class=\"s-screen\" id=\"sc-activity\">\r\n        <div class=\"s-warn\"><i class=\"ti ti-alert-triangle\" style=\"font-size:16px;flex-shrink:0;\"><\/i> \u0997\u09a4 \u09e8 \u09a6\u09bf\u09a8\u09c7\u09b0 \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09b9\u09af\u09bc\u09a8\u09bf \u2014 \u09ab\u09be\u0987\u09a8\u09be\u09b2 \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f\u09c7 \u09a6\u09c7\u0996\u09be\u09ac\u09c7<\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\r\n            \u0986\u099c\u0995\u09c7\u09b0 \u099a\u09c7\u0995\u09b2\u09bf\u09b8\u09cd\u099f \u2014 \u09e7\u09e9 \u099c\u09c1\u09a8\r\n            <span class=\"s-badge\" style=\"background:#e8f5e9;color:#2e7d32;\" id=\"check-badge\">\u09e9\/\u09eb \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8<\/span>\r\n          <\/div>\r\n          <div class=\"s-prog-wrap\"><div class=\"s-prog-bar\" id=\"act-prog\" style=\"width:60%\"><\/div><\/div>\r\n\r\n          <div id=\"s-checklist\">\r\n            <div class=\"s-check-item\">\r\n              <div class=\"s-check-box done\" onclick=\"toggleCheck(this)\"><i class=\"ti ti-check\" style=\"font-size:13px;\"><\/i><\/div>\r\n              <div class=\"s-check-text\">\r\n                <div class=\"s-check-title done-text\">\u09b8\u0995\u09be\u09b2 \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09a6\u09bf\u09a8<\/div>\r\n                <div class=\"s-check-sub\">\ud83d\udc64 Team Leader \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09c7\u09a8 \u00b7 \u2705 \u09b8\u0995\u09be\u09b2 \u09ef:\u09e9\u09e6<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"s-check-item\">\r\n              <div class=\"s-check-box done\" onclick=\"toggleCheck(this)\"><i class=\"ti ti-check\" style=\"font-size:13px;\"><\/i><\/div>\r\n              <div class=\"s-check-text\">\r\n                <div class=\"s-check-title done-text\">\u09e9 \u099c\u09a8 \u09a8\u09a4\u09c1\u09a8 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f\u09c7\u09b0 \u09b8\u09be\u09a5\u09c7 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997<\/div>\r\n                <div class=\"s-check-sub\">\ud83d\udc64 Team Leader \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09c7\u09a8 \u00b7 \u2705 \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"s-check-item\">\r\n              <div class=\"s-check-box done\" onclick=\"toggleCheck(this)\"><i class=\"ti ti-check\" style=\"font-size:13px;\"><\/i><\/div>\r\n              <div class=\"s-check-text\">\r\n                <div class=\"s-check-title done-text\">\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09ad\u09bf\u099c\u09bf\u099f \u2014 \u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae<\/div>\r\n                <div class=\"s-check-sub\">\u270f\ufe0f \u09a8\u09bf\u099c\u09c7 \u09af\u09c1\u0995\u09cd\u09a4 \u0995\u09b0\u09c7\u099b\u09c7\u09a8 \u00b7 \u2705 \u09ac\u09bf\u0995\u09be\u09b2 \u09e9:\u09e6\u09e6<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"s-check-item\">\r\n              <div class=\"s-check-box\" onclick=\"toggleCheck(this)\"><\/div>\r\n              <div class=\"s-check-text\">\r\n                <div class=\"s-check-title\">\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ac\u09cd\u09b0\u09cb\u09b6\u09be\u09b0 \u09b6\u09c7\u09af\u09bc\u09be\u09b0 \u0995\u09b0\u09c1\u09a8 (\u09e7\u09e6 \u099c\u09a8)<\/div>\r\n                <div class=\"s-check-sub\">\ud83d\udc64 Team Leader \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09c7\u09a8 \u00b7 \u23f3 \u09ac\u09be\u0995\u09bf<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"s-check-item\">\r\n              <div class=\"s-check-box\" onclick=\"toggleCheck(this)\"><\/div>\r\n              <div class=\"s-check-text\">\r\n                <div class=\"s-check-title\">\u09b8\u09a8\u09cd\u09a7\u09cd\u09af\u09be \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09a6\u09bf\u09a8<\/div>\r\n                <div class=\"s-check-sub\">\ud83d\udc64 Team Leader \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09c7\u09a8 \u00b7 \u23f3 \u09ac\u09be\u0995\u09bf<\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"s-btn-row\">\r\n            <button class=\"s-btn primary\" onclick=\"submitDaily()\"><i class=\"ti ti-send\" style=\"font-size:15px;\"><\/i> \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09a6\u09bf\u09a8<\/button>\r\n            <button class=\"s-btn\" onclick=\"document.getElementById('sub-add-task').classList.add('open')\"><i class=\"ti ti-plus\" style=\"font-size:15px;\"><\/i> \u0995\u09be\u099c \u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Monthly calendar -->\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u09ae\u09be\u09b8\u09c7\u09b0 \u0995\u09be\u09b0\u09cd\u09af\u0995\u09cd\u09b0\u09ae \u09b0\u09c7\u0995\u09b0\u09cd\u09a1<\/div>\r\n          <div style=\"display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:6px;\">\r\n            <div class=\"s-cal-head\">\u09b0\u09ac\u09bf<\/div><div class=\"s-cal-head\">\u09b8\u09cb\u09ae<\/div><div class=\"s-cal-head\">\u09ae\u0999\u09cd\u0997<\/div><div class=\"s-cal-head\">\u09ac\u09c1\u09a7<\/div><div class=\"s-cal-head\">\u09ac\u09c3\u09b9<\/div><div class=\"s-cal-head\">\u09b6\u09c1\u0995\u09cd\u09b0<\/div><div class=\"s-cal-head\">\u09b6\u09a8\u09bf<\/div>\r\n          <\/div>\r\n          <div class=\"s-cal\" id=\"s-cal\"><\/div>\r\n          <div style=\"display:flex;gap:12px;margin-top:10px;font-size:11px;color:#888;flex-wrap:wrap;\">\r\n            <span><span style=\"background:#e8f5e9;color:#2e7d32;padding:1px 7px;border-radius:4px;font-weight:600;\">\u2713<\/span> \u099c\u09ae\u09be \u09a6\u09c7\u0993\u09af\u09bc\u09be<\/span>\r\n            <span><span style=\"background:#fde8e8;color:#c62828;padding:1px 7px;border-radius:4px;font-weight:600;\">\u2717<\/span> \u099c\u09ae\u09be \u09a6\u09c7\u09a8\u09a8\u09bf<\/span>\r\n            <span><span style=\"background:#fdf2f2;color:#c0272d;padding:1px 7px;border-radius:4px;font-weight:600;\">\u25cf<\/span> \u0986\u099c<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== SCREEN 3: CLIENTS ===== -->\r\n      <div class=\"s-screen\" id=\"sc-clients\">\r\n        <div class=\"s-filter-row\">\r\n          <div class=\"s-spill active\" onclick=\"filterC(this)\">\u09b8\u09ac (\u09e7\u09ea)<\/div>\r\n          <div class=\"s-spill\" onclick=\"filterC(this)\">\u09a8\u09a4\u09c1\u09a8 (\u09ea)<\/div>\r\n          <div class=\"s-spill\" onclick=\"filterC(this)\">\u09b8\u09ae\u09cd\u09ad\u09be\u09ac\u09cd\u09af (\u09e9)<\/div>\r\n          <div class=\"s-spill\" onclick=\"filterC(this)\">\u09ad\u09bf\u099c\u09bf\u099f (\u09e9)<\/div>\r\n          <div class=\"s-spill\" onclick=\"filterC(this)\">\u09ac\u09c1\u0995\u09a1 (\u09e8)<\/div>\r\n          <div class=\"s-spill\" onclick=\"filterC(this)\">\u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc (\u09e8)<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09a4\u09be\u09b2\u09bf\u0995\u09be\r\n            <button class=\"s-btn primary\" style=\"padding:6px 12px;font-size:11px;\" onclick=\"document.getElementById('sub-add-client').classList.add('open')\">\r\n              <i class=\"ti ti-plus\" style=\"font-size:13px;\"><\/i> \u09a8\u09a4\u09c1\u09a8\r\n            <\/button>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae','\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ad\u09bf\u099c\u09bf\u099f \u09ac\u09c1\u0995 \u0995\u09b0\u09be','01712-345678','\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0','hot')\">\r\n            <div class=\"s-av\" style=\"background:#e8f5e9;color:#2e7d32;\">\u09b0\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae<\/div><div class=\"s-row-sub\">01712-345678 \u00b7 \u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e8f5e9;color:#2e7d32;\">Hot<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u0995\u09be\u09ae\u09be\u09b2 \u09b9\u09cb\u09b8\u09c7\u09a8','\u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u099a\u09b2\u09ae\u09be\u09a8','01811-234567','\u09a2\u09be\u0995\u09be','booked')\">\r\n            <div class=\"s-av\" style=\"background:#e3f2fd;color:#1565c0;\">\u0995\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u0995\u09be\u09ae\u09be\u09b2 \u09b9\u09cb\u09b8\u09c7\u09a8<\/div><div class=\"s-row-sub\">01811-234567 \u00b7 \u09a2\u09be\u0995\u09be<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e3f2fd;color:#1565c0;\">\u09ac\u09c1\u0995\u09a1<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0','HO \u09ae\u09bf\u099f\u09bf\u0982 \u09aa\u09c7\u09a8\u09cd\u09a1\u09bf\u0982','01911-456789','\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae','warm')\">\r\n            <div class=\"s-av\" style=\"background:#fff3e0;color:#e65100;\">\u09b6\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0<\/div><div class=\"s-row-sub\">01911-456789 \u00b7 \u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#fff3e0;color:#e65100;\">Warm<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u09a8\u09be\u099c\u09ae\u09be \u0996\u09be\u09a4\u09c1\u09a8','\u09a8\u09a4\u09c1\u09a8 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997','01611-987654','\u09b8\u09bf\u09b2\u09c7\u099f','new')\">\r\n            <div class=\"s-av\" style=\"background:#fde8e8;color:#c62828;\">\u09a8\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09a8\u09be\u099c\u09ae\u09be \u0996\u09be\u09a4\u09c1\u09a8<\/div><div class=\"s-row-sub\">01611-987654 \u00b7 \u09b8\u09bf\u09b2\u09c7\u099f<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#fde8e8;color:#c62828;\">\u09a8\u09a4\u09c1\u09a8<\/span>\r\n          <\/div>\r\n          <div class=\"s-list-row\" onclick=\"openClientDetail('\u0986\u09ac\u09cd\u09a6\u09c1\u09b2 \u0995\u09b0\u09bf\u09ae','\u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8','01511-123456','\u0996\u09c1\u09b2\u09a8\u09be','sold')\">\r\n            <div class=\"s-av\" style=\"background:#f3fbe8;color:#33691e;\">\u0986<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u0986\u09ac\u09cd\u09a6\u09c1\u09b2 \u0995\u09b0\u09bf\u09ae<\/div><div class=\"s-row-sub\">01511-123456 \u00b7 \u0996\u09c1\u09b2\u09a8\u09be<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#f3fbe8;color:#33691e;\">\u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc \u2713<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== SCREEN 4: MEETINGS ===== -->\r\n      <div class=\"s-screen\" id=\"sc-meetings\">\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0986\u099c\u0995\u09c7\u09b0 \u09ae\u09bf\u099f\u09bf\u0982 \u2014 \u09e7\u09e9 \u099c\u09c1\u09a8<\/div>\r\n          <div class=\"s-meet-row\">\r\n            <div class=\"s-meet-time\">\u09b8\u0995\u09be\u09b2<br>\u09e7\u09e6:\u09e6\u09e6<\/div>\r\n            <div class=\"s-meet-icon\" style=\"background:#e8f5e9;color:#2e7d32;\"><i class=\"ti ti-video\"><\/i><\/div>\r\n            <div class=\"s-meet-info\"><div class=\"s-meet-title\">\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae \u2014 \u09ad\u09bf\u09a1\u09bf\u0993 \u0995\u09b2<\/div><div class=\"s-meet-sub\">\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 \u0986\u09b2\u09cb\u099a\u09a8\u09be<\/div><\/div>\r\n            <button class=\"s-btn primary\" style=\"padding:6px 10px;font-size:11px;\" onclick=\"toast('\u09ae\u09bf\u099f\u09bf\u0982 \u09b6\u09c1\u09b0\u09c1 \u09b9\u099a\u09cd\u099b\u09c7...')\">Join<\/button>\r\n          <\/div>\r\n          <div class=\"s-meet-row\">\r\n            <div class=\"s-meet-time\">\u09a6\u09c1\u09aa\u09c1\u09b0<br>\u09e8:\u09e9\u09e6<\/div>\r\n            <div class=\"s-meet-icon\" style=\"background:#e3f2fd;color:#1565c0;\"><i class=\"ti ti-building\"><\/i><\/div>\r\n            <div class=\"s-meet-info\"><div class=\"s-meet-title\">Head Office \u2014 Team Review<\/div><div class=\"s-meet-sub\">\u09b8\u09be\u09aa\u09cd\u09a4\u09be\u09b9\u09bf\u0995 \u09aa\u09be\u09b0\u09ab\u09b0\u09ae\u09cd\u09af\u09be\u09a8\u09cd\u09b8 \u09b0\u09bf\u09ad\u09bf\u0989<\/div><\/div>\r\n            <button class=\"s-btn\" style=\"padding:6px 10px;font-size:11px;\" onclick=\"toast('\u09ae\u09bf\u099f\u09bf\u0982 \u09b6\u09c1\u09b0\u09c1 \u09b9\u099a\u09cd\u099b\u09c7...')\">Join<\/button>\r\n          <\/div>\r\n          <div class=\"s-meet-row\">\r\n            <div class=\"s-meet-time\">\u09ac\u09bf\u0995\u09be\u09b2<br>\u09eb:\u09e6\u09e6<\/div>\r\n            <div class=\"s-meet-icon\" style=\"background:#fff3e0;color:#e65100;\"><i class=\"ti ti-phone\"><\/i><\/div>\r\n            <div class=\"s-meet-info\"><div class=\"s-meet-title\">\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0 \u2014 \u09ad\u09af\u09bc\u09c7\u09b8 \u0995\u09b2<\/div><div class=\"s-meet-sub\">HO-\u09a4\u09c7 \u0995\u09a5\u09be \u09ac\u09b2\u09be\u09b0 \u09ac\u09cd\u09af\u09ac\u09b8\u09cd\u09a5\u09be<\/div><\/div>\r\n            <button class=\"s-btn\" style=\"padding:6px 10px;font-size:11px;\" onclick=\"toast('\u0995\u09b2 \u09b6\u09c1\u09b0\u09c1 \u09b9\u099a\u09cd\u099b\u09c7...')\">Join<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u09a8\u09a4\u09c1\u09a8 \u09ae\u09bf\u099f\u09bf\u0982 \u09b6\u09bf\u09a1\u09bf\u0989\u09b2 \u0995\u09b0\u09c1\u09a8<\/div>\r\n          <div class=\"s-fg\"><label>\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f<\/label>\r\n            <select><option>\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae<\/option><option>\u0995\u09be\u09ae\u09be\u09b2 \u09b9\u09cb\u09b8\u09c7\u09a8<\/option><option>\u09b6\u09be\u09b9\u09c7\u09a6 \u0986\u09b2\u09c0<\/option><option>\u09a8\u09be\u099c\u09ae\u09be \u0996\u09be\u09a4\u09c1\u09a8<\/option><\/select>\r\n          <\/div>\r\n          <div class=\"s-r2\">\r\n            <div class=\"s-fg\"><label>\u09a4\u09be\u09b0\u09bf\u0996<\/label><input type=\"date\"><\/div>\r\n            <div class=\"s-fg\"><label>\u09b8\u09ae\u09af\u09bc<\/label><input type=\"time\"><\/div>\r\n          <\/div>\r\n          <div class=\"s-fg\"><label>\u09ae\u09bf\u099f\u09bf\u0982 \u09a7\u09b0\u09a8<\/label>\r\n            <select>\r\n              <option>\u09ad\u09bf\u09a1\u09bf\u0993 \u0995\u09b2 (\u0985\u09cd\u09af\u09be\u09aa\u09c7\u09b0 \u09ae\u09a7\u09cd\u09af\u09c7)<\/option>\r\n              <option>\u09ad\u09af\u09bc\u09c7\u09b8 \u0995\u09b2<\/option>\r\n              <option>Head Office \u09ad\u09bf\u099c\u09bf\u099f<\/option>\r\n              <option>\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09b8\u09be\u0987\u099f \u09ad\u09bf\u099c\u09bf\u099f<\/option>\r\n              <option>\u09b8\u09be\u09a5\u09c7 \u0995\u09b0\u09c7 \u09ad\u09bf\u099c\u09bf\u099f<\/option>\r\n            <\/select>\r\n          <\/div>\r\n          <button class=\"s-btn primary s-btn-full\" onclick=\"toast('\u09ae\u09bf\u099f\u09bf\u0982 \u09b6\u09bf\u09a1\u09bf\u0989\u09b2 \u09b9\u09af\u09bc\u09c7\u099b\u09c7!')\"><i class=\"ti ti-calendar-plus\" style=\"font-size:15px;\"><\/i> \u09ae\u09bf\u099f\u09bf\u0982 \u09a8\u09bf\u09b0\u09cd\u09a7\u09be\u09b0\u09a3 \u0995\u09b0\u09c1\u09a8<\/button>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== SCREEN 5: TEAM ===== -->\r\n      <div class=\"s-screen\" id=\"sc-team\">\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0986\u09ae\u09be\u09b0 \u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09b2 \u0995\u09cb\u09a1<\/div>\r\n          <div class=\"s-ref-box\">\r\n            <div class=\"s-ref-code\">SAL-2024-RF47<\/div>\r\n            <button class=\"s-btn\" style=\"padding:10px 12px;\" onclick=\"copyCode()\"><i class=\"ti ti-copy\" style=\"font-size:16px;\"><\/i><\/button>\r\n            <button class=\"s-btn\" style=\"padding:10px 12px;\" onclick=\"toast('\u09b6\u09c7\u09af\u09bc\u09be\u09b0 \u09b2\u09bf\u0999\u09cd\u0995 \u0995\u09aa\u09bf \u09b9\u09af\u09bc\u09c7\u099b\u09c7!')\"><i class=\"ti ti-share\" style=\"font-size:16px;\"><\/i><\/button>\r\n          <\/div>\r\n          <div style=\"font-size:11px;color:#888;margin-top:8px;\">\u098f\u0987 \u0995\u09cb\u09a1 \u09b6\u09c7\u09af\u09bc\u09be\u09b0 \u0995\u09b0\u09c1\u09a8 \u2014 \u09a8\u09a4\u09c1\u09a8 \u09aa\u09be\u09b0\u09cd\u099f\u09a8\u09be\u09b0 \u09af\u09cb\u0997 \u09a6\u09bf\u09b2\u09c7 \u0986\u09aa\u09a8\u09bf \u09a4\u09be\u09a6\u09c7\u09b0 Team Leader \u09b9\u09ac\u09c7\u09a8 \u098f\u09ac\u0982 \u09a4\u09be\u09a6\u09c7\u09b0 \u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc \u09a5\u09c7\u0995\u09c7\u0993 \u0986\u09af\u09bc \u0995\u09b0\u09ac\u09c7\u09a8<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0986\u09ae\u09be\u09b0 \u099f\u09bf\u09ae (\u09ec \u099c\u09a8)<\/div>\r\n          <div class=\"s-team-row\">\r\n            <div class=\"s-av\" style=\"background:#e8f5e9;color:#2e7d32;\">\u09ae\u09cb<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09ae\u09cb. \u09b8\u09be\u09b2\u09be\u09ae<\/div><div class=\"s-row-sub\">\u09e9 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u00b7 \u09f3\u09ea\u09eb,\u09e6\u09e6\u09e6 \u098f\u0987 \u09ae\u09be\u09b8\u09c7<\/div><\/div>\r\n            <span class=\"s-tier-pill\" style=\"background:#e8f5e9;color:#2e7d32;\">USP<\/span>\r\n          <\/div>\r\n          <div class=\"s-team-row\">\r\n            <div class=\"s-av\" style=\"background:#e3f2fd;color:#1565c0;\">\u09ab\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09ab\u09be\u09b0\u09b9\u09be\u09a8\u09be \u0986\u0995\u09cd\u09a4\u09be\u09b0<\/div><div class=\"s-row-sub\">\u09eb \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u00b7 \u09f3\u09ed\u09e8,\u09e6\u09e6\u09e6 \u098f\u0987 \u09ae\u09be\u09b8\u09c7<\/div><\/div>\r\n            <span class=\"s-tier-pill\" style=\"background:#e3f2fd;color:#1565c0;\">USP<\/span>\r\n          <\/div>\r\n          <div class=\"s-team-row\">\r\n            <div class=\"s-av\" style=\"background:#fff3e0;color:#e65100;\">\u099c\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u099c\u09be\u09b9\u09bf\u09a6 \u09b9\u09be\u09b8\u09be\u09a8<\/div><div class=\"s-row-sub\">\u09e8 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u00b7 \u09f3\u09e8\u09ee,\u09e6\u09e6\u09e6 \u098f\u0987 \u09ae\u09be\u09b8\u09c7<\/div><\/div>\r\n            <span class=\"s-tier-pill\" style=\"background:#fff3e0;color:#e65100;\">USP<\/span>\r\n          <\/div>\r\n          <div class=\"s-team-row\">\r\n            <div class=\"s-av\" style=\"background:#fde8e8;color:#c62828;\">\u09a8\u09be<\/div>\r\n            <div class=\"s-row-main\"><div class=\"s-row-title\">\u09a8\u09be\u09b8\u09bf\u09b0 \u0989\u09a6\u09cd\u09a6\u09bf\u09a8<\/div><div class=\"s-row-sub\" style=\"color:#c0272d;\">\u26a0\ufe0f \u09e9 \u09a6\u09bf\u09a8 \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09a6\u09c7\u09a8\u09a8\u09bf<\/div><\/div>\r\n            <span class=\"s-tier-pill\" style=\"background:#fde8e8;color:#c62828;\">USP<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== SCREEN 6: COMMISSION ===== -->\r\n      <div class=\"s-screen\" id=\"sc-commission\">\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u098f\u0987 \u09ae\u09be\u09b8\u09c7\u09b0 \u0986\u09af\u09bc \u2014 \u099c\u09c1\u09a8 \u09e8\u09e6\u09e8\u09ec<\/div>\r\n          <div style=\"font-size:30px;font-weight:700;color:#0a7c4e;margin-bottom:4px;\">\u09f3\u09e7,\u09e8\u09ea,\u09eb\u09e6\u09e6<\/div>\r\n          <div style=\"font-size:12px;color:#888;margin-bottom:8px;\">\u09ae\u09cb\u099f \u0995\u09ae\u09bf\u09b6\u09a8 \u099c\u09ae\u09be (\u09aa\u09c7\u09ae\u09c7\u09a8\u09cd\u099f \u09aa\u09c7\u09a8\u09cd\u09a1\u09bf\u0982)<\/div>\r\n          <div class=\"s-prog-wrap\"><div class=\"s-prog-bar\" style=\"width:82%;background:#0a7c4e;\"><\/div><\/div>\r\n          <div style=\"font-size:11px;color:#0a7c4e;font-weight:600;\">\u09ae\u09be\u09b8\u09bf\u0995 \u099f\u09be\u09b0\u09cd\u0997\u09c7\u099f\u09c7\u09b0 \u09ee\u09e8% \u0985\u09b0\u09cd\u099c\u09bf\u09a4 \ud83c\udfaf \u09ac\u09cb\u09a8\u09be\u09b8\u09c7\u09b0 \u0995\u09be\u099b\u09be\u0995\u09be\u099b\u09bf!<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0995\u09ae\u09bf\u09b6\u09a8 \u09ad\u09be\u0999\u09a8<\/div>\r\n          <div class=\"s-comm-row\">\r\n            <div class=\"s-comm-dot\" style=\"background:#0a7c4e;\"><\/div>\r\n            <div class=\"s-comm-info\"><div class=\"s-comm-label\">\u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc (\u09eb%)<\/div><div class=\"s-comm-sub\">\u09a8\u09bf\u099c\u09c7\u09b0 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09a5\u09c7\u0995\u09c7<\/div><\/div>\r\n            <div class=\"s-comm-amount\" style=\"color:#0a7c4e;\">\u09f3\u09ee\u09eb,\u09e6\u09e6\u09e6<\/div>\r\n          <\/div>\r\n          <div class=\"s-comm-row\">\r\n            <div class=\"s-comm-dot\" style=\"background:#1565c0;\"><\/div>\r\n            <div class=\"s-comm-info\"><div class=\"s-comm-label\">\u099f\u09bf\u09ae \u0993\u09ad\u09be\u09b0\u09b0\u09be\u0987\u09a1 (\u09e8%)<\/div><div class=\"s-comm-sub\">\u099f\u09bf\u09ae\u09c7\u09b0 \u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc \u09a5\u09c7\u0995\u09c7<\/div><\/div>\r\n            <div class=\"s-comm-amount\" style=\"color:#1565c0;\">\u09f3\u09e9\u09ef,\u09eb\u09e6\u09e6<\/div>\r\n          <\/div>\r\n          <div style=\"border-top:1px solid #f0f0f0;margin-top:8px;padding-top:10px;display:flex;justify-content:space-between;font-size:14px;font-weight:700;\">\r\n            <span>\u09ae\u09cb\u099f<\/span><span style=\"color:#0a7c4e;\">\u09f3\u09e7,\u09e8\u09ea,\u09eb\u09e6\u09e6<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u09b8\u09be\u09ae\u09cd\u09aa\u09cd\u09b0\u09a4\u09bf\u0995 \u0995\u09ae\u09bf\u09b6\u09a8<\/div>\r\n          <div class=\"s-inst-row\">\r\n            <div class=\"s-inst-info\"><div class=\"s-inst-name\">\u0986\u09ac\u09cd\u09a6\u09c1\u09b2 \u0995\u09b0\u09bf\u09ae \u2014 \u09ab\u09cd\u09b2\u09cd\u09af\u09be\u099f \u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc<\/div><div class=\"s-inst-date\">\u09f3\u09eb\u09e6 \u09b2\u0995\u09cd\u09b7 \u00b7 \u09ee \u099c\u09c1\u09a8 \u09e8\u09e6\u09e8\u09ec<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e8f5e9;color:#2e7d32;\">\u09f3\u09e8,\u09eb\u09e6,\u09e6\u09e6\u09e6<\/span>\r\n          <\/div>\r\n          <div class=\"s-inst-row\">\r\n            <div class=\"s-inst-info\"><div class=\"s-inst-name\">\u09ab\u09be\u09b0\u09b9\u09be\u09a8\u09be\u09b0 \u099f\u09bf\u09ae \u2014 \u0995\u09ae\u09be\u09b0\u09cd\u09b6\u09bf\u09af\u09bc\u09be\u09b2<\/div><div class=\"s-inst-date\">\u099f\u09bf\u09ae \u0993\u09ad\u09be\u09b0\u09b0\u09be\u0987\u09a1 \u00b7 \u09eb \u099c\u09c1\u09a8 \u09e8\u09e6\u09e8\u09ec<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e3f2fd;color:#1565c0;\">\u09f3\u09e9\u09ef,\u09eb\u09e6\u09e6<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div><!-- \/s-body -->\r\n\r\n    <!-- BOTTOM NAV -->\r\n    <div class=\"s-nav\">\r\n      <div class=\"s-nav-item active\" onclick=\"navTo(this,'sc-home','Salmon Partners')\"><i class=\"ti ti-home\"><\/i>\u09b9\u09cb\u09ae<\/div>\r\n      <div class=\"s-nav-item\" onclick=\"navTo(this,'sc-activity','\u09a6\u09c8\u09a8\u09bf\u0995 \u0995\u09be\u09b0\u09cd\u09af\u0995\u09cd\u09b0\u09ae')\"><i class=\"ti ti-clipboard-check\"><\/i>\u0995\u09be\u09b0\u09cd\u09af\u0995\u09cd\u09b0\u09ae<\/div>\r\n      <div class=\"s-nav-item\" onclick=\"navTo(this,'sc-clients','\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09a4\u09be\u09b2\u09bf\u0995\u09be')\"><i class=\"ti ti-users\"><\/i>\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f<\/div>\r\n      <div class=\"s-nav-item\" onclick=\"navTo(this,'sc-meetings','\u09ae\u09bf\u099f\u09bf\u0982')\"><i class=\"ti ti-video\"><\/i>\u09ae\u09bf\u099f\u09bf\u0982<\/div>\r\n      <div class=\"s-nav-item\" onclick=\"navTo(this,'sc-team','\u0986\u09ae\u09be\u09b0 \u099f\u09bf\u09ae')\"><i class=\"ti ti-sitemap\"><\/i>\u099f\u09bf\u09ae<\/div>\r\n    <\/div>\r\n\r\n    <!-- TOAST -->\r\n    <div id=\"s-toast\"><\/div>\r\n\r\n    <!-- ===== SUB: CLIENT DETAIL ===== -->\r\n    <div class=\"s-sub\" id=\"sub-client-detail\">\r\n      <div class=\"s-sub-topbar\">\r\n        <div style=\"cursor:pointer;font-size:22px;line-height:1;\" onclick=\"document.getElementById('sub-client-detail').classList.remove('open')\"><i class=\"ti ti-arrow-left\"><\/i><\/div>\r\n        <div class=\"s-sub-title\">\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4<\/div>\r\n      <\/div>\r\n      <div class=\"s-sub-body\">\r\n        <div class=\"s-card\">\r\n          <div style=\"display:flex;align-items:center;gap:14px;margin-bottom:14px;\">\r\n            <div class=\"s-av\" id=\"sub-c-av\" style=\"width:50px;height:50px;font-size:18px;background:#e8f5e9;color:#2e7d32;\">\u09b0\u09be<\/div>\r\n            <div style=\"flex:1;\">\r\n              <div style=\"font-size:17px;font-weight:700;\" id=\"sub-c-name\">\u09b0\u09be\u09b9\u09c7\u09b2\u09be \u09ac\u09c7\u0997\u09ae<\/div>\r\n              <div style=\"font-size:12px;color:#888;\" id=\"sub-c-info\">01712-345678 \u00b7 \u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0<\/div>\r\n            <\/div>\r\n            <span class=\"s-badge\" id=\"sub-c-badge\" style=\"background:#e8f5e9;color:#2e7d32;\">Hot<\/span>\r\n          <\/div>\r\n          <div class=\"s-btn-row\">\r\n            <button class=\"s-btn primary\" onclick=\"toast('\ud83d\udcde \u0995\u09b2 \u09b6\u09c1\u09b0\u09c1 \u09b9\u099a\u09cd\u099b\u09c7...')\"><i class=\"ti ti-phone\" style=\"font-size:15px;\"><\/i> \u0995\u09b2<\/button>\r\n            <button class=\"s-btn\" onclick=\"toast('\ud83d\udcf9 \u09ad\u09bf\u09a1\u09bf\u0993 \u0995\u09b2 \u09b6\u09c1\u09b0\u09c1 \u09b9\u099a\u09cd\u099b\u09c7...')\"><i class=\"ti ti-video\" style=\"font-size:15px;\"><\/i> \u09ad\u09bf\u09a1\u09bf\u0993<\/button>\r\n            <button class=\"s-btn\" onclick=\"toast('\ud83c\udfe2 HO-\u09a4\u09c7 \u09b8\u0982\u09af\u09c1\u0995\u09cd\u09a4 \u0995\u09b0\u09be \u09b9\u099a\u09cd\u099b\u09c7...')\"><i class=\"ti ti-building\" style=\"font-size:15px;\"><\/i> HO \u0995\u09a5\u09be<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u09b8\u09cd\u099f\u09cd\u09af\u09be\u099f\u09be\u09b8 \u0986\u09aa\u09a1\u09c7\u099f <span style=\"font-size:10px;color:#888;font-weight:400;\">\u099f\u09bf\u09ae \u09b2\u09bf\u09a1\u09be\u09b0 \u0985\u09a8\u09c1\u09ae\u09cb\u09a6\u09a8 \u09b2\u09be\u0997\u09ac\u09c7<\/span><\/div>\r\n          <div class=\"s-fg\"><label>\u09ac\u09b0\u09cd\u09a4\u09ae\u09be\u09a8 \u09b8\u09cd\u099f\u09cd\u09af\u09be\u099f\u09be\u09b8<\/label>\r\n            <select>\r\n              <option>\u09a8\u09a4\u09c1\u09a8 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997<\/option>\r\n              <option selected>\u09aa\u09cd\u09b0\u099c\u09c7\u0995\u09cd\u099f \u09ad\u09bf\u099c\u09bf\u099f \u09ac\u09c1\u0995 \u0995\u09b0\u09be (Hot)<\/option>\r\n              <option>\u09b8\u09ae\u09cd\u09ad\u09be\u09ac\u09cd\u09af \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f<\/option>\r\n              <option>HO \u09ad\u09bf\u099c\u09bf\u099f \u0995\u09b0\u09a4\u09c7 \u099a\u09be\u09af\u09bc<\/option>\r\n              <option>\u09a8\u09c7\u0997\u09cb\u09b6\u09bf\u09af\u09bc\u09c7\u09b6\u09a8 \u099a\u09b2\u099b\u09c7<\/option>\r\n              <option>\u09ac\u09c1\u0995\u09bf\u0982 \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09c7\u09a8<\/option>\r\n              <option>\u09ac\u09bf\u0995\u09cd\u09b0\u09af\u09bc \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8<\/option>\r\n            <\/select>\r\n          <\/div>\r\n          <div class=\"s-fg\"><label>\u09a8\u09cb\u099f<\/label><textarea placeholder=\"\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f\u09c7\u09b0 \u09b8\u09be\u09a5\u09c7 \u0986\u09b2\u09cb\u099a\u09a8\u09be\u09b0 \u09ac\u09bf\u09ac\u09b0\u09a3...\"><\/textarea><\/div>\r\n          <div class=\"s-fg\"><label>\u099b\u09ac\u09bf \u0986\u09aa\u09a1\u09c7\u099f<\/label><input type=\"file\" accept=\"image\/*\"><\/div>\r\n          <button class=\"s-btn primary s-btn-full\" onclick=\"toast('\u2705 \u0985\u09a8\u09c1\u09ae\u09cb\u09a6\u09a8\u09c7\u09b0 \u099c\u09a8\u09cd\u09af \u09aa\u09be\u09a0\u09be\u09a8\u09cb \u09b9\u09af\u09bc\u09c7\u099b\u09c7!')\"><i class=\"ti ti-send\" style=\"font-size:15px;\"><\/i> \u0985\u09a8\u09c1\u09ae\u09cb\u09a6\u09a8\u09c7\u09b0 \u099c\u09a8\u09cd\u09af \u09aa\u09be\u09a0\u09be\u09a8<\/button>\r\n        <\/div>\r\n\r\n        <div class=\"s-card\">\r\n          <div class=\"s-card-title\">\u0995\u09bf\u09b8\u09cd\u09a4\u09bf\u09b0 \u09a4\u09a5\u09cd\u09af<\/div>\r\n          <div class=\"s-inst-row\">\r\n            <div class=\"s-inst-info\"><div class=\"s-inst-name\">\u09e7\u09ae \u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u2014 \u09f3\u09eb\u09e6,\u09e6\u09e6\u09e6<\/div><div class=\"s-inst-date\">\u09ae\u09c7 \u09e7\u09eb, \u09e8\u09e6\u09e8\u09ec<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#e8f5e9;color:#2e7d32;\">\u09aa\u09b0\u09bf\u09b6\u09cb\u09a7\u09bf\u09a4 \u2713<\/span>\r\n          <\/div>\r\n          <div class=\"s-inst-row\">\r\n            <div class=\"s-inst-info\"><div class=\"s-inst-name\">\u09e8\u09af\u09bc \u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u2014 \u09f3\u09eb\u09e6,\u09e6\u09e6\u09e6<\/div><div class=\"s-inst-date\">\u099c\u09c1\u09a8 \u09e7\u09eb, \u09e8\u09e6\u09e8\u09ec<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#fff3e0;color:#e65100;\">\u09aa\u09c7\u09a8\u09cd\u09a1\u09bf\u0982<\/span>\r\n          <\/div>\r\n          <div class=\"s-inst-row\">\r\n            <div class=\"s-inst-info\"><div class=\"s-inst-name\">\u09e9\u09af\u09bc \u0995\u09bf\u09b8\u09cd\u09a4\u09bf \u2014 \u09f3\u09eb\u09e6,\u09e6\u09e6\u09e6<\/div><div class=\"s-inst-date\">\u099c\u09c1\u09b2\u09be\u0987 \u09e7\u09eb, \u09e8\u09e6\u09e8\u09ec<\/div><\/div>\r\n            <span class=\"s-badge\" style=\"background:#f5f5f5;color:#888;\">\u0986\u09b8\u099b\u09c7<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ===== SUB: ADD CLIENT ===== -->\r\n    <div class=\"s-sub\" id=\"sub-add-client\">\r\n      <div class=\"s-sub-topbar\">\r\n        <div style=\"cursor:pointer;font-size:22px;line-height:1;\" onclick=\"document.getElementById('sub-add-client').classList.remove('open')\"><i class=\"ti ti-arrow-left\"><\/i><\/div>\r\n        <div class=\"s-sub-title\">\u09a8\u09a4\u09c1\u09a8 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8<\/div>\r\n      <\/div>\r\n      <div class=\"s-sub-body\">\r\n        <div class=\"s-card\">\r\n          <div class=\"s-r2\">\r\n            <div class=\"s-fg\"><label>\u09aa\u09c1\u09b0\u09cb \u09a8\u09be\u09ae<\/label><input placeholder=\"\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f\u09c7\u09b0 \u09a8\u09be\u09ae\"><\/div>\r\n            <div class=\"s-fg\"><label>\u09ae\u09cb\u09ac\u09be\u0987\u09b2<\/label><input type=\"tel\" placeholder=\"01XXXXXXXXX\"><\/div>\r\n          <\/div>\r\n          <div class=\"s-fg\"><label>\u09a0\u09bf\u0995\u09be\u09a8\u09be \/ \u098f\u09b2\u09be\u0995\u09be<\/label><input placeholder=\"\u099c\u09c7\u09b2\u09be, \u0989\u09aa\u099c\u09c7\u09b2\u09be\"><\/div>\r\n          <div class=\"s-fg\"><label>\u0986\u0997\u09cd\u09b0\u09b9\u09c7\u09b0 \u09b8\u09ae\u09cd\u09aa\u09a4\u09cd\u09a4\u09bf<\/label>\r\n            <select>\r\n              <option>\u09ab\u09cd\u09b2\u09cd\u09af\u09be\u099f<\/option><option>\u09aa\u09cd\u09b2\u099f \/ \u099c\u09ae\u09bf<\/option><option>\u0995\u09ae\u09be\u09b0\u09cd\u09b6\u09bf\u09af\u09bc\u09be\u09b2 \u09b8\u09cd\u09aa\u09c7\u09b8<\/option>\r\n              <option>\u09b9\u09be\u09b8\u09aa\u09be\u09a4\u09be\u09b2 \u09b6\u09c7\u09af\u09bc\u09be\u09b0<\/option><option>\u09b9\u09cb\u099f\u09c7\u09b2 \u09b6\u09c7\u09af\u09bc\u09be\u09b0<\/option>\r\n            <\/select>\r\n          <\/div>\r\n          <div class=\"s-fg\"><label>\u09ac\u09be\u099c\u09c7\u099f (\u0986\u09a8\u09c1\u09ae\u09be\u09a8\u09bf\u0995)<\/label><input placeholder=\"\u09af\u09c7\u09ae\u09a8: \u09eb\u09e6 \u09b2\u0995\u09cd\u09b7 \u099f\u09be\u0995\u09be\"><\/div>\r\n          <div class=\"s-fg\"><label>\u09aa\u09cd\u09b0\u09a5\u09ae \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997\u09c7\u09b0 \u09a8\u09cb\u099f<\/label><textarea placeholder=\"\u0995\u09bf\u09ad\u09be\u09ac\u09c7 \u09aa\u09b0\u09bf\u099a\u09af\u09bc, \u0995\u09c0 \u099c\u09be\u09a8\u09a4\u09c7 \u099a\u09be\u09a8...\"><\/textarea><\/div>\r\n          <div class=\"s-fg\"><label>\u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f\u09c7\u09b0 \u099b\u09ac\u09bf<\/label><input type=\"file\" accept=\"image\/*\"><\/div>\r\n          <button class=\"s-btn primary s-btn-full\" onclick=\"toast('\u2705 \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09af\u09cb\u0997 \u0995\u09b0\u09be \u09b9\u09af\u09bc\u09c7\u099b\u09c7!');document.getElementById('sub-add-client').classList.remove('open')\">\r\n            <i class=\"ti ti-user-plus\" style=\"font-size:15px;\"><\/i> \u0995\u09cd\u09b2\u09be\u09af\u09bc\u09c7\u09a8\u09cd\u099f \u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ===== SUB: ADD TASK ===== -->\r\n    <div class=\"s-sub\" id=\"sub-add-task\">\r\n      <div class=\"s-sub-topbar\">\r\n        <div style=\"cursor:pointer;font-size:22px;line-height:1;\" onclick=\"document.getElementById('sub-add-task').classList.remove('open')\"><i class=\"ti ti-arrow-left\"><\/i><\/div>\r\n        <div class=\"s-sub-title\">\u09a8\u09a4\u09c1\u09a8 \u0995\u09be\u099c \u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8<\/div>\r\n      <\/div>\r\n      <div class=\"s-sub-body\">\r\n        <div class=\"s-card\">\r\n          <div class=\"s-fg\"><label>\u0995\u09be\u099c\u09c7\u09b0 \u09ac\u09bf\u09ac\u09b0\u09a3<\/label><input placeholder=\"\u0995\u09c0 \u0995\u09b0\u09a4\u09c7 \u09b9\u09ac\u09c7?\"><\/div>\r\n          <div class=\"s-r2\">\r\n            <div class=\"s-fg\"><label>\u09b8\u09ae\u09af\u09bc<\/label><input type=\"time\"><\/div>\r\n            <div class=\"s-fg\"><label>\u0985\u0997\u09cd\u09b0\u09be\u09a7\u09bf\u0995\u09be\u09b0<\/label><select><option>\u09b8\u09cd\u09ac\u09be\u09ad\u09be\u09ac\u09bf\u0995<\/option><option>\u099c\u09b0\u09c1\u09b0\u09bf<\/option><\/select><\/div>\r\n          <\/div>\r\n          <button class=\"s-btn primary s-btn-full\" onclick=\"toast('\u2705 \u0995\u09be\u099c \u09af\u09cb\u0997 \u0995\u09b0\u09be \u09b9\u09af\u09bc\u09c7\u099b\u09c7!');document.getElementById('sub-add-task').classList.remove('open')\">\r\n            <i class=\"ti ti-plus\" style=\"font-size:15px;\"><\/i> \u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div><!-- \/salmon-app -->\r\n<\/div><!-- \/overlay -->\r\n\r\n<script>\r\n\/\/ ===== APP OPEN \/ CLOSE =====\r\nfunction openApp() {\r\n  document.getElementById('salmon-overlay').classList.add('open');\r\n  document.body.style.overflow = 'hidden';\r\n  buildCalendar();\r\n}\r\nfunction closeApp() {\r\n  document.getElementById('salmon-overlay').classList.remove('open');\r\n  document.body.style.overflow = '';\r\n}\r\n\/\/ Close on overlay click\r\ndocument.getElementById('salmon-overlay').addEventListener('click', function(e) {\r\n  if (e.target === this) closeApp();\r\n});\r\n\/\/ Escape key\r\ndocument.addEventListener('keydown', function(e) { if(e.key==='Escape') closeApp(); });\r\n\r\n\/\/ ===== NAVIGATION =====\r\nlet currentNav = null;\r\nfunction navTo(navEl, screenId, title) {\r\n  document.querySelectorAll('.s-screen').forEach(s => s.classList.remove('active'));\r\n  document.getElementById(screenId).classList.add('active');\r\n  document.querySelectorAll('.s-nav-item').forEach(n => n.classList.remove('active'));\r\n  if (navEl) navEl.classList.add('active');\r\n  document.getElementById('s-topbar-title').textContent = title;\r\n  document.querySelector('.s-body').scrollTop = 0;\r\n}\r\n\r\n\/\/ ===== TOAST =====\r\nlet toastTimer;\r\nfunction toast(msg) {\r\n  const t = document.getElementById('s-toast');\r\n  t.textContent = msg;\r\n  t.classList.add('show');\r\n  clearTimeout(toastTimer);\r\n  toastTimer = setTimeout(() => t.classList.remove('show'), 2200);\r\n}\r\n\r\n\/\/ ===== CHECKLIST =====\r\nfunction toggleCheck(el) {\r\n  el.classList.toggle('done');\r\n  const titleEl = el.closest('.s-check-item').querySelector('.s-check-title');\r\n  if (el.classList.contains('done')) {\r\n    el.innerHTML = '<i class=\"ti ti-check\" style=\"font-size:13px;\"><\/i>';\r\n    titleEl.classList.add('done-text');\r\n  } else {\r\n    el.innerHTML = '';\r\n    titleEl.classList.remove('done-text');\r\n  }\r\n  updateProgress();\r\n}\r\nfunction updateProgress() {\r\n  const total = document.querySelectorAll('#s-checklist .s-check-box').length;\r\n  const done = document.querySelectorAll('#s-checklist .s-check-box.done').length;\r\n  const pct = Math.round(done \/ total * 100);\r\n  document.getElementById('act-prog').style.width = pct + '%';\r\n  document.getElementById('check-badge').textContent = done + '\/' + total + ' \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8';\r\n  document.getElementById('home-prog-label').textContent = done + '\/' + total + ' \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8';\r\n}\r\nfunction submitDaily() {\r\n  const done = document.querySelectorAll('#s-checklist .s-check-box.done').length;\r\n  const total = document.querySelectorAll('#s-checklist .s-check-box').length;\r\n  toast('\u2705 \u09b0\u09bf\u09aa\u09cb\u09b0\u09cd\u099f \u099c\u09ae\u09be \u09b9\u09af\u09bc\u09c7\u099b\u09c7! ' + done + '\/' + total + ' \u0995\u09be\u099c \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8');\r\n}\r\n\r\n\/\/ ===== CALENDAR =====\r\nfunction buildCalendar() {\r\n  const cal = document.getElementById('s-cal');\r\n  if (cal.children.length > 0) return;\r\n  const submitted = [1,2,3,4,5,6,7,8];\r\n  const missed = [11,12];\r\n  for (let i = 1; i <= 30; i++) {\r\n    const d = document.createElement('div');\r\n    d.className = 's-cal-day';\r\n    if (i === 13) {\r\n      d.style.cssText = 'background:#fdf2f2;color:#c0272d;font-size:11px;';\r\n      d.textContent = '\u25cf';\r\n    } else if (submitted.includes(i)) {\r\n      d.style.cssText = 'background:#e8f5e9;color:#2e7d32;';\r\n      d.textContent = '\u2713';\r\n    } else if (missed.includes(i)) {\r\n      d.style.cssText = 'background:#fde8e8;color:#c62828;';\r\n      d.textContent = '\u2717';\r\n    } else if (i < 13) {\r\n      d.style.cssText = 'background:#e8f5e9;color:#2e7d32;';\r\n      d.textContent = '\u2713';\r\n    } else {\r\n      d.style.cssText = 'background:#f5f5f5;color:#ccc;';\r\n      d.textContent = i;\r\n    }\r\n    cal.appendChild(d);\r\n  }\r\n}\r\n\r\n\/\/ ===== CLIENT DETAIL =====\r\nfunction openClientDetail(name, status, phone, area, type) {\r\n  document.getElementById('sub-c-av').textContent = name[0] + (name[1]||'');\r\n  document.getElementById('sub-c-name').textContent = name;\r\n  document.getElementById('sub-c-info').textContent = phone + ' \u00b7 ' + area;\r\n  document.getElementById('sub-c-badge').textContent = status;\r\n  document.getElementById('sub-client-detail').classList.add('open');\r\n}\r\n\r\n\/\/ ===== FILTER =====\r\nfunction filterC(el) {\r\n  document.querySelectorAll('.s-spill').forEach(s => s.classList.remove('active'));\r\n  el.classList.add('active');\r\n}\r\n\r\n\/\/ ===== COPY CODE =====\r\nfunction copyCode() {\r\n  if (navigator.clipboard) {\r\n    navigator.clipboard.writeText('SAL-2024-RF47').then(() => toast('\u2705 \u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09b2 \u0995\u09cb\u09a1 \u0995\u09aa\u09bf \u09b9\u09af\u09bc\u09c7\u099b\u09c7!'));\r\n  } else { toast('\u2705 \u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09b2 \u0995\u09cb\u09a1 \u0995\u09aa\u09bf \u09b9\u09af\u09bc\u09c7\u099b\u09c7!'); }\r\n}\r\n\r\n\/\/ ===== BACK (unused but safe) =====\r\nfunction goBack() {}\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-90bb25c e-flex e-con-boxed e-con e-parent\" data-id=\"90bb25c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-badc75b elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"badc75b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"bn\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Salmon Developers \u2014 Organogram<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\n:root {\r\n  --red: #C0392B;\r\n  --red-dark: #96281B;\r\n  --red-soft: #FEF0EF;\r\n  --red-border: rgba(192,57,43,0.25);\r\n  --green: #1E8449;\r\n  --green-soft: #EAF6EE;\r\n  --amber: #B8830A;\r\n  --border: #E5E7EB;\r\n  --bg: #F9FAFB;\r\n  --bg2: #F3F4F6;\r\n  --white: #FFFFFF;\r\n  --text: #111827;\r\n  --text2: #6B7280;\r\n  --text3: #9CA3AF;\r\n  --active-border: #C0392B;\r\n  --active-bg: #FEF0EF;\r\n  --dim-opacity: 0.35;\r\n  --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 8px rgba(0,0,0,0.04);\r\n  --shadow-md: 0 4px 12px rgba(0,0,0,0.1), 0 1px 4px rgba(0,0,0,0.06);\r\n}\r\nbody { font-family: 'Roboto', sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; }\r\n\r\n\/* \u2500\u2500 LOGIN \u2500\u2500 *\/\r\n#login-screen {\r\n  position: fixed; inset: 0; z-index: 9999;\r\n  background: linear-gradient(135deg, #1a0a09 0%, #2d1210 40%, #1a0a09 100%);\r\n  display: flex; align-items: center; justify-content: center; padding: 20px;\r\n}\r\n#login-screen::before {\r\n  content: ''; position: absolute; inset: 0;\r\n  background: radial-gradient(ellipse 70% 50% at 50% 40%, rgba(192,57,43,0.2) 0%, transparent 70%);\r\n  pointer-events: none;\r\n}\r\n.login-box {\r\n  background: rgba(255,255,255,0.05); backdrop-filter: blur(20px);\r\n  border: 1px solid rgba(255,255,255,0.1); border-radius: 20px;\r\n  padding: 40px 36px 32px; width: 100%; max-width: 390px;\r\n  box-shadow: 0 32px 64px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.08);\r\n  position: relative;\r\n}\r\n.login-logo { text-align: center; margin-bottom: 24px; }\r\n.login-logo img { height: 54px; object-fit: contain; border-radius: 8px; }\r\n.login-title { font-size: 18px; font-weight: 700; color: #fff; text-align: center; margin-bottom: 4px; }\r\n.login-sub { font-size: 11px; color: rgba(255,255,255,0.4); text-align: center; margin-bottom: 28px; letter-spacing: 0.1em; text-transform: uppercase; }\r\n.lf { margin-bottom: 14px; }\r\n.lf label { display: block; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 6px; }\r\n.lf input { width: 100%; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; padding: 11px 14px; color: #fff; font-size: 14px; font-family: 'Roboto', sans-serif; outline: none; transition: border-color 0.2s; }\r\n.lf input:focus { border-color: rgba(192,57,43,0.6); }\r\n.lf input::placeholder { color: rgba(255,255,255,0.22); }\r\n.login-btn { width: 100%; padding: 12px; background: var(--red); border: none; border-radius: 8px; color: #fff; font-size: 14px; font-weight: 600; font-family: 'Roboto', sans-serif; cursor: pointer; margin-top: 8px; transition: background 0.2s; letter-spacing: 0.02em; }\r\n.login-btn:hover { background: var(--red-dark); }\r\n.login-err { color: #FF6B6B; font-size: 12px; text-align: center; margin-top: 10px; min-height: 16px; }\r\n.login-div { display: flex; align-items: center; gap: 10px; margin: 18px 0 14px; }\r\n.login-div::before, .login-div::after { content: ''; flex: 1; height: 1px; background: rgba(255,255,255,0.08); }\r\n.login-div span { font-size: 10px; color: rgba(255,255,255,0.25); letter-spacing: 0.1em; text-transform: uppercase; }\r\n.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }\r\n.qbtn { padding: 8px 10px; border: 1px solid rgba(255,255,255,0.1); border-radius: 7px; background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.5); font-size: 11px; font-family: 'Roboto', sans-serif; cursor: pointer; transition: all 0.15s; text-align: center; }\r\n.qbtn:hover { background: rgba(192,57,43,0.18); border-color: rgba(192,57,43,0.35); color: #fff; }\r\n\r\n\/* \u2500\u2500 APP \u2500\u2500 *\/\r\n#app { display: none; flex-direction: column; height: 100vh; overflow: hidden; }\r\n#app.on { display: flex; }\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.hdr {\r\n  background: var(--white); border-bottom: 1px solid var(--border);\r\n  padding: 0 24px; height: 58px; display: flex; align-items: center;\r\n  justify-content: space-between; flex-shrink: 0;\r\n  box-shadow: 0 1px 4px rgba(0,0,0,0.06);\r\n  position: sticky; top: 0; z-index: 100;\r\n}\r\n.hdr-left { display: flex; align-items: center; gap: 12px; }\r\n.hdr-logo {\r\n  height: 36px; width: 36px; object-fit: cover; border-radius: 50%;\r\n  border: 2.5px solid var(--red); flex-shrink: 0;\r\n}\r\n.hdr-divider { width: 1px; height: 24px; background: var(--border); }\r\n.hdr-title { font-size: 15px; font-weight: 700; color: var(--text); }\r\n.hdr-sub { font-size: 9px; color: var(--text3); letter-spacing: 0.1em; text-transform: uppercase; display: block; }\r\n.hdr-right { display: flex; align-items: center; gap: 10px; }\r\n.live-badge { display: flex; align-items: center; gap: 5px; background: var(--green-soft); border: 1px solid rgba(30,132,73,0.2); border-radius: 50px; padding: 4px 11px; font-size: 11px; font-weight: 600; color: var(--green); }\r\n.live-dot { width: 6px; height: 6px; background: var(--green); border-radius: 50%; animation: blink 1.8s infinite; }\r\n@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }\r\n.user-chip { display: flex; align-items: center; gap: 7px; background: var(--bg); border: 1px solid var(--border); border-radius: 50px; padding: 4px 12px 4px 6px; font-size: 12px; font-weight: 500; color: var(--text2); }\r\n.user-av { width: 24px; height: 24px; border-radius: 50%; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }\r\n.logout-btn { padding: 6px 13px; border: 1px solid var(--border); border-radius: 6px; background: none; cursor: pointer; font-size: 11px; font-weight: 500; color: var(--text2); font-family: 'Roboto', sans-serif; transition: all 0.15s; }\r\n.logout-btn:hover { border-color: var(--red); color: var(--red); background: var(--red-soft); }\r\n\r\n\/* \u2500\u2500 FILTER BAR \u2500\u2500 *\/\r\n.filter-bar {\r\n  background: var(--white); border-bottom: 1px solid var(--border);\r\n  padding: 10px 24px; display: flex; align-items: center; gap: 10px;\r\n  flex-shrink: 0; flex-wrap: wrap;\r\n}\r\n.dd-wrap { position: relative; }\r\n.dd-select {\r\n  appearance: none; background: var(--white);\r\n  border: 1px solid var(--border); border-radius: 8px;\r\n  padding: 7px 28px 7px 12px; font-size: 13px; font-weight: 500;\r\n  color: var(--text); font-family: 'Roboto', sans-serif;\r\n  cursor: pointer; outline: none; min-width: 130px;\r\n  transition: border-color 0.15s;\r\n}\r\n.dd-select:focus, .dd-select:hover { border-color: var(--red); }\r\n.dd-arrow { position: absolute; right: 9px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--text3); font-size: 10px; }\r\n.date-wrap { display: flex; align-items: center; gap: 6px; border: 1px solid var(--red); border-radius: 8px; padding: 6px 12px; background: var(--white); }\r\n.date-wrap label { font-size: 12px; font-weight: 500; color: var(--red); white-space: nowrap; }\r\n.date-wrap input[type=\"date\"] { border: none; outline: none; font-size: 12px; font-family: 'Roboto', sans-serif; color: var(--text); background: transparent; cursor: pointer; }\r\n.count-badge { background: var(--bg2); border: 1px solid var(--border); border-radius: 50px; padding: 6px 14px; font-size: 13px; font-weight: 600; color: var(--text); white-space: nowrap; }\r\n.count-badge span { color: var(--red); }\r\n.filter-btns { display: flex; gap: 6px; margin-left: 4px; }\r\n.fbtn { padding: 6px 14px; border-radius: 50px; border: 1px solid var(--border); background: var(--white); font-size: 12px; font-weight: 500; color: var(--text2); font-family: 'Roboto', sans-serif; cursor: pointer; transition: all 0.15s; }\r\n.fbtn:hover { border-color: var(--red); color: var(--red); }\r\n.fbtn.active { background: var(--red); border-color: var(--red); color: #fff; }\r\n\r\n\/* \u2500\u2500 STATS \u2500\u2500 *\/\r\n.stats-bar {\r\n  background: var(--white); border-bottom: 1px solid var(--border);\r\n  display: flex; flex-shrink: 0; overflow-x: auto;\r\n}\r\n.stat { padding: 10px 24px; text-align: center; border-right: 1px solid var(--border); flex-shrink: 0; }\r\n.stat:last-child { border-right: none; }\r\n.stat-val { font-size: 20px; font-weight: 700; display: block; line-height: 1; }\r\n.stat-lbl { font-size: 9px; font-weight: 500; color: var(--text3); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 3px; display: block; }\r\n.sv-red { color: var(--red); } .sv-green { color: var(--green); } .sv-amber { color: var(--amber); } .sv-blue { color: #2563EB; }\r\n\r\n\/* \u2500\u2500 4-COL LAYOUT \u2500\u2500 *\/\r\n.cols { display: flex; flex: 1; overflow: hidden; }\r\n.col { display: flex; flex-direction: column; border-right: 1px solid var(--border); background: var(--white); width: 25%; min-width: 210px; flex-shrink: 0; }\r\n.col:last-child { border-right: none; }\r\n\r\n.col-head {\r\n  padding: 10px 16px 8px; border-bottom: 2px solid var(--red);\r\n  background: var(--white); flex-shrink: 0;\r\n}\r\n.col-head-row1 { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }\r\n.col-head-app { font-size: 11px; font-weight: 600; color: var(--green); background: var(--green-soft); border: 1px solid rgba(30,132,73,0.2); border-radius: 50px; padding: 2px 9px; margin-left: auto; }\r\n.col-head-title { font-size: 12px; font-weight: 700; color: var(--red); letter-spacing: 0.06em; text-transform: uppercase; }\r\n.col-hover-stats { display: none; align-items: center; gap: 8px; padding-top: 3px; font-size: 11px; flex-wrap: wrap; min-height: 20px; }\r\n.col-hover-stats.vis { display: flex; }\r\n.chs-name { color: var(--text); font-weight: 700; font-size: 12px; max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n.chs-app { background: var(--green-soft); color: var(--green); border: 1px solid rgba(30,132,73,0.2); border-radius: 50px; padding: 1px 8px; font-weight: 600; font-size: 10px; }\r\n\r\n\r\n\/* back button row *\/\r\n.col-back { padding: 8px 12px; border-bottom: 1px solid var(--border); background: var(--bg); display: none; flex-shrink: 0; }\r\n.back-btn { background: none; border: none; cursor: pointer; font-size: 12px; font-weight: 500; color: var(--red); font-family: 'Roboto', sans-serif; display: flex; align-items: center; gap: 5px; padding: 3px 6px; border-radius: 6px; transition: background 0.15s; }\r\n.back-btn:hover { background: var(--red-soft); }\r\n\r\n.col-scroll { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 4px; }\r\n.col-scroll::-webkit-scrollbar { width: 3px; }\r\n.col-scroll::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }\r\n\r\n\/* \u2500\u2500 CARD \u2500\u2500 *\/\r\n.card {\r\n  border-radius: 10px; border: 1.5px solid var(--border);\r\n  background: var(--bg); padding: 12px 14px;\r\n  cursor: pointer; transition: all 0.15s; position: relative;\r\n}\r\n.card:hover { background: var(--white); border-color: var(--red); box-shadow: var(--shadow-md); }\r\n.card.active { background: var(--red-soft); border-color: var(--red); box-shadow: var(--shadow-md); }\r\n.card.dim { opacity: var(--dim-opacity); }\r\n.card::before { content: ''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 3px; background: var(--red); border-radius: 0 3px 3px 0; opacity: 0; transition: opacity 0.15s; }\r\n.card:hover::before, .card.active::before { opacity: 1; }\r\n\r\n.card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }\r\n.card-info { flex: 1; min-width: 0; }\r\n.card-role { font-size: 9px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text3); display: block; margin-bottom: 3px; }\r\n.card-name { font-size: 15px; font-weight: 700; color: var(--text); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n.card-pills { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; align-items: flex-end; }\r\n.pill { font-size: 10px; font-weight: 600; padding: 3px 9px; border-radius: 50px; white-space: nowrap; }\r\n.pill-a { background: var(--green-soft); color: var(--green); border: 1px solid rgba(30,132,73,0.2); }\r\n.pill-e { background: var(--red-soft); color: var(--red); border: 1px solid rgba(192,57,43,0.18); }\r\n.pill-z { background: var(--bg2); color: var(--text3); border: 1px solid var(--border); }\r\n\r\n\/* applicant rows *\/\r\n.app-rows { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }\r\n.app-row {\r\n  display: flex; align-items: center; gap: 8px;\r\n  background: var(--white); border: 1px solid var(--border);\r\n  border-radius: 7px; padding: 7px 10px;\r\n  cursor: pointer; transition: all 0.13s;\r\n}\r\n.app-row:hover { border-color: var(--red); box-shadow: var(--shadow); }\r\n.app-num { width: 20px; height: 20px; border-radius: 50%; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\r\n.app-name { font-size: 12px; font-weight: 500; color: var(--text); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n.app-arrow { font-size: 12px; color: var(--text3); }\r\n\r\n\/* union card \u2014 no hover expand, just name + pill *\/\r\n.union-card { border-radius: 10px; border: 1.5px solid var(--border); background: var(--bg); padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }\r\n.union-name { font-size: 14px; font-weight: 600; color: var(--text); }\r\n.union-role { font-size: 9px; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: 0.08em; display: block; margin-bottom: 2px; }\r\n.union-rows { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; }\r\n\r\n\/* empty state *\/\r\n.col-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; color: var(--text3); font-size: 13px; gap: 10px; padding: 30px; text-align: center; min-height: 100px; }\r\n.col-empty-icon { font-size: 28px; opacity: 0.3; }\r\n\r\n\/* \u2500\u2500 MODAL \u2500\u2500 *\/\r\n#modal { display: none; position: fixed; inset: 0; z-index: 8000; background: rgba(0,0,0,0.55); backdrop-filter: blur(5px); align-items: center; justify-content: center; padding: 20px; }\r\n#modal.open { display: flex; }\r\n.modal-box { background: var(--white); border-radius: 18px; width: 100%; max-width: 470px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: mIn 0.2s ease; }\r\n@keyframes mIn { from{opacity:0;transform:translateY(10px) scale(0.98)} to{opacity:1;transform:none} }\r\n.modal-head { background: linear-gradient(135deg, var(--red-dark), var(--red)); padding: 20px 20px 16px; flex-shrink: 0; }\r\n.modal-head-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }\r\n.mclose { width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,0.2); border: none; color: #fff; cursor: pointer; font-size: 13px; display: flex; align-items: center; justify-content: center; }\r\n.mclose:hover { background: rgba(255,255,255,0.35); }\r\n.m-profile { display: flex; align-items: center; gap: 14px; }\r\n.m-photo { width: 62px; height: 62px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.15); display: flex; align-items: center; justify-content: center; font-size: 24px; flex-shrink: 0; overflow: hidden; }\r\n.m-photo img { width:100%; height:100%; object-fit:cover; border-radius:50%; }\r\n.m-name { font-size: 17px; font-weight: 700; color: #fff; line-height: 1.2; }\r\n.m-loc { font-size: 11px; color: rgba(255,255,255,0.6); margin-top: 3px; }\r\n.m-pos { display: inline-block; background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.3); border-radius: 50px; padding: 3px 11px; font-size: 10px; font-weight: 600; color: #fff; margin-top: 6px; }\r\n.m-tabs { display: flex; gap: 5px; margin-top: 12px; flex-wrap: wrap; }\r\n.m-tab { padding: 4px 13px; border-radius: 50px; border: 1.5px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.7); font-size: 11px; font-weight: 600; font-family: 'Roboto', sans-serif; cursor: pointer; transition: all 0.15s; }\r\n.m-tab.active, .m-tab:hover { background: rgba(255,255,255,0.25); border-color: rgba(255,255,255,0.5); color: #fff; }\r\n.m-actions { display: flex; gap: 6px; margin-top: 12px; flex-wrap: wrap; }\r\n.abn { display: inline-flex; align-items: center; gap: 5px; padding: 7px 13px; border-radius: 50px; font-size: 11px; font-weight: 600; color: #fff; text-decoration: none; border: none; cursor: pointer; font-family: 'Roboto', sans-serif; transition: opacity 0.15s; }\r\n.abn:hover { opacity: 0.85; }\r\n.abn svg { width: 12px; height: 12px; flex-shrink: 0; }\r\n.abn-call { background: rgba(255,255,255,0.22); border: 1.5px solid rgba(255,255,255,0.38) !important; }\r\n.abn-wa { background: #25D366; }\r\n.abn-fb { background: #1877F2; }\r\n.abn-li { background: #0A66C2; }\r\n.abn-cv { background: rgba(255,255,255,0.16); border: 1.5px solid rgba(255,255,255,0.28) !important; }\r\n.modal-body { overflow-y: auto; flex: 1; padding: 18px 20px; }\r\n.modal-body::-webkit-scrollbar { width: 3px; }\r\n.modal-body::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }\r\n.sec-lbl { font-size: 9px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text3); display: flex; align-items: center; gap: 8px; margin: 14px 0 8px; }\r\n.sec-lbl:first-child { margin-top: 0; }\r\n.sec-lbl::before, .sec-lbl::after { content:''; flex:1; height:1px; background:var(--border); }\r\n.fgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }\r\n.fbox { background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 9px 11px; }\r\n.fbox.full { grid-column: 1\/-1; }\r\n.flbl { font-size: 8px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text3); display: block; margin-bottom: 2px; }\r\n.fval { font-size: 12px; font-weight: 500; color: var(--text); line-height: 1.4; word-break: break-word; display: block; }\r\n.fval a { color: var(--red); text-decoration: none; }\r\n.dl-btn { width:100%; margin-top:14px; padding:11px; background:var(--text); border:none; border-radius:8px; color:#fff; font-size:13px; font-weight:600; font-family:'Roboto',sans-serif; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; transition:background 0.15s; }\r\n.dl-btn:hover { background: var(--red); }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- LOGIN -->\r\n<div id=\"login-screen\">\r\n  <div class=\"login-box\">\r\n    <div class=\"login-logo\">\r\n      <img decoding=\"async\" src=\"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\" alt=\"Salmon Developers\" onerror=\"this.style.display='none'\">\r\n    <\/div>\r\n    <div class=\"login-title\">Organogram System<\/div>\r\n    <div class=\"login-sub\">Salmon Developers Ltd.<\/div>\r\n    <div class=\"lf\"><label>Username<\/label><input type=\"text\" id=\"l-user\" placeholder=\"Enter username\" autocomplete=\"username\"><\/div>\r\n    <div class=\"lf\"><label>Password<\/label><input type=\"password\" id=\"l-pass\" placeholder=\"Enter password\" autocomplete=\"current-password\"><\/div>\r\n    <button class=\"login-btn\" onclick=\"doLogin()\">\u09aa\u09cd\u09b0\u09ac\u09c7\u09b6 \u0995\u09b0\u09c1\u09a8<\/button>\r\n    <div class=\"login-err\" id=\"login-err\"><\/div>\r\n    <div class=\"login-div\"><span>Quick Access<\/span><\/div>\r\n    <div class=\"quick-grid\" id=\"quick-grid\"><\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- APP -->\r\n<div id=\"app\">\r\n  <!-- Header -->\r\n  <header class=\"hdr\">\r\n    <div class=\"hdr-left\">\r\n      <img decoding=\"async\" class=\"hdr-logo\" src=\"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\" alt=\"Salmon\" onerror=\"this.style.display='none'\">\r\n      <div class=\"hdr-divider\"><\/div>\r\n      <div>\r\n        <div class=\"hdr-title\">Salmon Developers<\/div>\r\n        <span class=\"hdr-sub\">Organogram Tree<\/span>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"hdr-right\">\r\n      <div class=\"live-badge\"><div class=\"live-dot\"><\/div>Live<\/div>\r\n      <div class=\"user-chip\"><div class=\"user-av\" id=\"hdr-av\">A<\/div><span id=\"hdr-uname\">Admin<\/span><\/div>\r\n      <button class=\"logout-btn\" onclick=\"doLogout()\">Logout<\/button>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <!-- Filter Bar -->\r\n  <div class=\"filter-bar\">\r\n    <div class=\"dd-wrap\">\r\n      <select class=\"dd-select\" id=\"f-div\" onchange=\"applyFilter()\">\r\n        <option value=\"\">\u2014 \u09ac\u09bf\u09ad\u09be\u0997 \u2014<\/option>\r\n      <\/select>\r\n      <span class=\"dd-arrow\">\u25be<\/span>\r\n    <\/div>\r\n    <div class=\"dd-wrap\">\r\n      <select class=\"dd-select\" id=\"f-dist\" onchange=\"applyFilter()\">\r\n        <option value=\"\">\u2014 \u099c\u09c7\u09b2\u09be \u2014<\/option>\r\n      <\/select>\r\n      <span class=\"dd-arrow\">\u25be<\/span>\r\n    <\/div>\r\n    <div class=\"dd-wrap\">\r\n      <select class=\"dd-select\" id=\"f-upa\" onchange=\"applyFilter()\">\r\n        <option value=\"\">\u2014 \u0989\u09aa\u099c\u09c7\u09b2\u09be \u2014<\/option>\r\n      <\/select>\r\n      <span class=\"dd-arrow\">\u25be<\/span>\r\n    <\/div>\r\n    <div class=\"dd-wrap\">\r\n      <select class=\"dd-select\" id=\"f-union\" onchange=\"applyFilter()\">\r\n        <option value=\"\">\u2014 \u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 \u2014<\/option>\r\n      <\/select>\r\n      <span class=\"dd-arrow\">\u25be<\/span>\r\n    <\/div>\r\n    <div class=\"date-wrap\">\r\n      <label>\u09a4\u09be\u09b0\u09bf\u0996<\/label>\r\n      <input type=\"date\" id=\"f-date\" onchange=\"applyFilter()\">\r\n      <span style=\"cursor:pointer;color:var(--text3);font-size:11px\" onclick=\"clearDate()\">\u2715<\/span>\r\n    <\/div>\r\n    <div class=\"count-badge\">\u09ae\u09cb\u099f <span id=\"f-count\">\u2014<\/span> \u099f\u09bf \u0986\u09ac\u09c7\u09a6\u09a8<\/div>\r\n    <div class=\"filter-btns\">\r\n      <button class=\"fbtn active\" data-f=\"all\"   onclick=\"setFilter(this)\">\u09b8\u09ac<\/button>\r\n      <button class=\"fbtn\"        data-f=\"full\"  onclick=\"setFilter(this)\">\u09aa\u09c2\u09b0\u09cd\u09a3<\/button>\r\n      <button class=\"fbtn\"        data-f=\"empty\" onclick=\"setFilter(this)\">\u0996\u09be\u09b2\u09bf<\/button>\r\n      <button class=\"fbtn\"        data-f=\"today\" onclick=\"setFilter(this)\">\u0986\u099c<\/button>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Stats -->\r\n  <div class=\"stats-bar\">\r\n    <div class=\"stat\"><span class=\"stat-val sv-red\"   id=\"st-total\">\u2014<\/span><span class=\"stat-lbl\">\u09ae\u09cb\u099f \u0986\u09ac\u09c7\u09a6\u09a8<\/span><\/div>\r\n    <div class=\"stat\"><span class=\"stat-val sv-green\" id=\"st-filled\">\u2014<\/span><span class=\"stat-lbl\">\u09aa\u09a6 \u09aa\u09c2\u09b0\u09cd\u09a3<\/span><\/div>\r\n    <div class=\"stat\"><span class=\"stat-val sv-red\"   id=\"st-empty\">\u2014<\/span><span class=\"stat-lbl\">\u09aa\u09a6 \u0996\u09be\u09b2\u09bf<\/span><\/div>\r\n    <div class=\"stat\"><span class=\"stat-val sv-amber\" id=\"st-pos\">\u2014<\/span><span class=\"stat-lbl\">\u09ae\u09cb\u099f \u09aa\u09a6<\/span><\/div>\r\n    <div class=\"stat\"><span class=\"stat-val sv-blue\"  id=\"st-today\">\u2014<\/span><span class=\"stat-lbl\">\u0986\u099c\u0995\u09c7\u09b0 \u0986\u09ac\u09c7\u09a6\u09a8<\/span><\/div>\r\n  <\/div>\r\n\r\n  <!-- 4 Columns -->\r\n  <div class=\"cols\">\r\n    <!-- \u09ac\u09bf\u09ad\u09be\u0997 -->\r\n    <div class=\"col\">\r\n      <div class=\"col-head\"><div class=\"col-head-row1\"><span class=\"col-head-title\">\u09ac\u09bf\u09ad\u09be\u0997<\/span><span class=\"col-head-ct\" id=\"ct-div\">\u2014<\/span><\/div><div class=\"col-hover-stats\" id=\"hs-div\"><\/div><\/div>\r\n      <div class=\"col-scroll\" id=\"ls-div\"><div class=\"col-empty\"><div class=\"col-empty-icon\">\u23f3<\/div>\u09b2\u09cb\u09a1 \u09b9\u099a\u09cd\u099b\u09c7\u2026<\/div><\/div>\r\n    <\/div>\r\n    <!-- \u099c\u09c7\u09b2\u09be -->\r\n    <div class=\"col\">\r\n      <div class=\"col-head\">\r\n        <div class=\"col-head-row1\"><span class=\"col-head-title\">\u099c\u09c7\u09b2\u09be<\/span><span class=\"col-head-ct\" id=\"ct-dist\">\u2014<\/span><span class=\"col-head-app\" id=\"ct-dist-app\" style=\"display:none\">\u2014<\/span><\/div>\r\n        <div class=\"col-hover-stats\" id=\"hs-dist\"><\/div>\r\n        <div id=\"back-dist\" style=\"display:none;margin-top:5px\"><button class=\"back-btn\" onclick=\"resetFrom('dist')\">\u2190 \u09ac\u09bf\u09ad\u09be\u0997\u09c7 \u09ab\u09bf\u09b0\u09c1\u09a8<\/button><\/div>\r\n      <\/div>\r\n      <div class=\"col-scroll\" id=\"ls-dist\"><div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u09ac\u09bf\u09ad\u09be\u0997\u09c7 \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div><\/div>\r\n    <\/div>\r\n    <!-- \u0989\u09aa\u099c\u09c7\u09b2\u09be -->\r\n    <div class=\"col\">\r\n      <div class=\"col-head\">\r\n        <div class=\"col-head-row1\"><span class=\"col-head-title\">\u0989\u09aa\u099c\u09c7\u09b2\u09be<\/span><span class=\"col-head-ct\" id=\"ct-upa\">\u2014<\/span><span class=\"col-head-app\" id=\"ct-upa-app\" style=\"display:none\">\u2014<\/span><\/div>\r\n        <div class=\"col-hover-stats\" id=\"hs-upa\"><\/div>\r\n        <div id=\"back-upa\" style=\"display:none;margin-top:5px\"><button class=\"back-btn\" onclick=\"resetFrom('upa')\">\u2190 \u099c\u09c7\u09b2\u09be\u09af\u09bc \u09ab\u09bf\u09b0\u09c1\u09a8<\/button><\/div>\r\n      <\/div>\r\n      <div class=\"col-scroll\" id=\"ls-upa\"><div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div><\/div>\r\n    <\/div>\r\n    <!-- \u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 -->\r\n    <div class=\"col\">\r\n      <div class=\"col-head\">\r\n        <div class=\"col-head-row1\"><span class=\"col-head-title\">\u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8<\/span><span class=\"col-head-ct\" id=\"ct-union\">\u2014<\/span><span class=\"col-head-app\" id=\"ct-union-app\" style=\"display:none\">\u2014<\/span><\/div>\r\n        <div class=\"col-hover-stats\" id=\"hs-union\"><\/div>\r\n        <div id=\"back-union\" style=\"display:none;margin-top:5px\"><button class=\"back-btn\" onclick=\"resetFrom('union')\">\u2190 \u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u09ab\u09bf\u09b0\u09c1\u09a8<\/button><\/div>\r\n      <\/div>\r\n      <div class=\"col-scroll\" id=\"ls-union\"><div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- MODAL -->\r\n<div id=\"modal\" onclick=\"if(event.target===this)closeModal()\">\r\n  <div class=\"modal-box\">\r\n    <div class=\"modal-head\">\r\n      <div class=\"modal-head-top\">\r\n        <div style=\"width:28px\"><\/div>\r\n        <div style=\"flex:1;text-align:center\">\r\n          <div class=\"m-name\" id=\"m-name\">\u2014<\/div>\r\n          <div class=\"m-loc\"  id=\"m-loc\">\u2014<\/div>\r\n        <\/div>\r\n        <button class=\"mclose\" onclick=\"closeModal()\">\u2715<\/button>\r\n      <\/div>\r\n      <div class=\"m-profile\">\r\n        <div class=\"m-photo\" id=\"m-photo\">\ud83d\udc64<\/div>\r\n        <div>\r\n          <div class=\"m-pos\" id=\"m-pos\">\u2014<\/div>\r\n          <div class=\"m-tabs\" id=\"m-tabs\"><\/div>\r\n        <\/div>\r\n      <\/div>\r\n      <div class=\"m-actions\" id=\"m-actions\"><\/div>\r\n    <\/div>\r\n    <div class=\"modal-body\" id=\"m-body\"><\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n'use strict';\r\n\r\n\/* \u2500\u2500 CREDENTIALS \u2500\u2500 *\/\r\nconst CREDS = {\r\n  'admin':      { pass:'salmon2026', label:'Admin',          filter:null },\r\n  'dhaka':      { pass:'dhaka@2026', label:'\u09a2\u09be\u0995\u09be \u09ac\u09bf\u09ad\u09be\u0997',     filter:'\u09a2\u09be\u0995\u09be' },\r\n  'chattogram': { pass:'ctg@2026',   label:'\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae \u09ac\u09bf\u09ad\u09be\u0997', filter:'\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae' },\r\n  'rajshahi':   { pass:'raj@2026',   label:'\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0 \u09ac\u09bf\u09ad\u09be\u0997',  filter:'\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0' },\r\n  'khulna':     { pass:'khl@2026',   label:'\u0996\u09c1\u09b2\u09a8\u09be \u09ac\u09bf\u09ad\u09be\u0997',    filter:'\u0996\u09c1\u09b2\u09a8\u09be' },\r\n  'barishal':   { pass:'bsl@2026',   label:'\u09ac\u09b0\u09bf\u09b6\u09be\u09b2 \u09ac\u09bf\u09ad\u09be\u0997',   filter:'\u09ac\u09b0\u09bf\u09b6\u09be\u09b2' },\r\n  'sylhet':     { pass:'syl@2026',   label:'\u09b8\u09bf\u09b2\u09c7\u099f \u09ac\u09bf\u09ad\u09be\u0997',    filter:'\u09b8\u09bf\u09b2\u09c7\u099f' },\r\n  'rangpur':    { pass:'rng@2026',   label:'\u09b0\u0982\u09aa\u09c1\u09b0 \u09ac\u09bf\u09ad\u09be\u0997',    filter:'\u09b0\u0982\u09aa\u09c1\u09b0' },\r\n  'mymensingh': { pass:'mym@2026',   label:'\u09ae\u09af\u09bc\u09ae\u09a8\u09b8\u09bf\u0982\u09b9 \u09ac\u09bf\u09ad\u09be\u0997', filter:'\u09ae\u09af\u09bc\u09ae\u09a8\u09b8\u09bf\u0982\u09b9' },\r\n};\r\nconst DIV_ORDER = ['\u09a2\u09be\u0995\u09be','\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae','\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0','\u0996\u09c1\u09b2\u09a8\u09be','\u09ac\u09b0\u09bf\u09b6\u09be\u09b2','\u09b8\u09bf\u09b2\u09c7\u099f','\u09b0\u0982\u09aa\u09c1\u09b0','\u09ae\u09af\u09bc\u09ae\u09a8\u09b8\u09bf\u0982\u09b9'];\r\nconst LOC_URL  = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vRFhUxc3pxKsBkvNtbB0zfusE3pCronhx8Iu15JXhfNAgObsmNjcedqucsqA_ZQ88LWlebi59X6sZ1w\/pub?output=csv';\r\nconst APP_URL  = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vRff3uKVo1saiDhUYkVl6F-5tqnbbTX1Ti7cMsu2wG6xYNnhoDco6Mg0VMNCBFEiDZ1ZvSOQXSAhc8C\/pub?output=csv';\r\nconst PROXY    = 'https:\/\/corsproxy.io\/?';\r\n\r\nasync function fetchCSV(url) {\r\n  \/\/ Try direct first, then proxy fallbacks\r\n  const attempts = [\r\n    () => fetch(url, {cache:'no-store'}),\r\n    () => fetch(PROXY + encodeURIComponent(url)),\r\n    () => fetch('https:\/\/api.allorigins.win\/raw?url=' + encodeURIComponent(url)),\r\n  ];\r\n  for (const attempt of attempts) {\r\n    try {\r\n      const r = await attempt();\r\n      if (r.ok) return r.text();\r\n    } catch(e) { \/* try next *\/ }\r\n  }\r\n  throw new Error('\u09b8\u09ac fetch attempt \u09ac\u09cd\u09af\u09b0\u09cd\u09a5 \u09b9\u09af\u09bc\u09c7\u099b\u09c7');\r\n}\r\n\r\nlet locTree={}, allApps=[], appMap={};\r\nlet currentUser=null, activeFilter='all';\r\nlet selDiv=null, selDist=null, selUpa=null;\r\nlet modalApps=[], modalIdx=0;\r\n\r\n\/* \u2500\u2500 QUICK BTNS \u2500\u2500 *\/\r\n['admin','dhaka','chattogram','rajshahi','khulna','barishal','sylhet','rangpur','mymensingh'].forEach(u=>{\r\n  const b=document.createElement('button');\r\n  b.className='qbtn'; b.textContent=CREDS[u].label;\r\n  b.onclick=()=>{ document.getElementById('l-user').value=u; document.getElementById('l-pass').value=CREDS[u].pass; };\r\n  document.getElementById('quick-grid').appendChild(b);\r\n});\r\n\r\n\/* \u2500\u2500 LOGIN \u2500\u2500 *\/\r\nwindow.doLogin=function(){\r\n  const u=document.getElementById('l-user').value.trim().toLowerCase();\r\n  const p=document.getElementById('l-pass').value;\r\n  const c=CREDS[u];\r\n  if(!c||c.pass!==p){ document.getElementById('login-err').textContent='\u274c \u09ad\u09c1\u09b2 username \u09ac\u09be password'; return; }\r\n  currentUser={...c,username:u};\r\n  document.getElementById('login-screen').style.display='none';\r\n  document.getElementById('app').classList.add('on');\r\n  document.getElementById('hdr-uname').textContent=c.label;\r\n  document.getElementById('hdr-av').textContent=c.label.charAt(0).toUpperCase();\r\n  loadData();\r\n};\r\ndocument.addEventListener('keydown',e=>{ if(e.key==='Enter')doLogin(); });\r\n\r\nwindow.doLogout=function(){\r\n  currentUser=null; selDiv=selDist=selUpa=null;\r\n  locTree={}; allApps=[]; appMap={};\r\n  ['ls-div','ls-dist','ls-upa','ls-union'].forEach(id=>{ document.getElementById(id).innerHTML=''; });\r\n  ['ct-div','ct-dist','ct-upa','ct-union'].forEach(id=>{ document.getElementById(id).textContent='\u2014'; });\r\n  ['ct-dist-app','ct-upa-app','ct-union-app'].forEach(id=>{ const e=document.getElementById(id); if(e)e.style.display='none'; });\r\n  ['hs-div','hs-dist','hs-upa','hs-union'].forEach(id=>{ const e=document.getElementById(id); if(e){e.innerHTML='';e.classList.remove('vis');} });\r\n  ['back-dist','back-upa','back-union'].forEach(id=>{ const e=document.getElementById(id); if(e)e.style.display='none'; });\r\n  ['st-total','st-filled','st-empty','st-pos','st-today','f-count'].forEach(id=>{ document.getElementById(id).textContent='\u2014'; });\r\n  document.getElementById('f-div').innerHTML='<option value=\"\">\u2014 \u09ac\u09bf\u09ad\u09be\u0997 \u2014<\/option>';\r\n  document.getElementById('f-dist').innerHTML='<option value=\"\">\u2014 \u099c\u09c7\u09b2\u09be \u2014<\/option>';\r\n  document.getElementById('f-upa').innerHTML='<option value=\"\">\u2014 \u0989\u09aa\u099c\u09c7\u09b2\u09be \u2014<\/option>';\r\n  document.getElementById('f-union').innerHTML='<option value=\"\">\u2014 \u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 \u2014<\/option>';\r\n  document.getElementById('f-date').value='';\r\n  activeFilter='all';\r\n  document.querySelectorAll('.fbtn').forEach(b=>b.classList.remove('active'));\r\n  document.querySelector('.fbtn[data-f=\"all\"]').classList.add('active');\r\n  document.getElementById('app').classList.remove('on');\r\n  document.getElementById('login-screen').style.display='flex';\r\n  document.getElementById('l-user').value='';\r\n  document.getElementById('l-pass').value='';\r\n  document.getElementById('login-err').textContent='';\r\n};\r\n\r\n\/* \u2500\u2500 CSV \u2500\u2500 *\/\r\nfunction parseCSV(text){\r\n  const lines=text.trim().split('\\n'); const out=[];\r\n  for(let i=1;i<lines.length;i++){\r\n    const cols=[]; let cur='',q=false;\r\n    for(const c of lines[i]){ if(c==='\"')q=!q; else if(c===','&&!q){cols.push(cur.trim());cur='';}else cur+=c; }\r\n    cols.push(cur.trim());\r\n    if(cols.some(c=>c)) out.push(cols.map(c=>c.replace(\/^\"|\"$\/g,'').trim().normalize('NFC')));\r\n  }\r\n  return out;\r\n}\r\n\r\n\/* \u2500\u2500 LOAD \u2500\u2500 *\/\r\nasync function loadData(){\r\n  document.getElementById('ls-div').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\u23f3<\/div>\u09b2\u09cb\u09a1 \u09b9\u099a\u09cd\u099b\u09c7\u2026<\/div>';\r\n  try{\r\n    const [locText,appText]=await Promise.all([fetchCSV(LOC_URL),fetchCSV(APP_URL)]);\r\n    parseCSV(locText).forEach(c=>{\r\n      const [d,di,u,un]=c;\r\n      if(!d)return;\r\n      if(!locTree[d])locTree[d]={};\r\n      if(di&&!locTree[d][di])locTree[d][di]={};\r\n      if(di&&u&&!locTree[d][di][u])locTree[d][di][u]=[];\r\n      if(di&&u&&un&&!locTree[d][di][u].includes(un))locTree[d][di][u].push(un);\r\n    });\r\n    allApps=[]; appMap={};\r\n    parseCSV(appText).forEach(c=>{\r\n      if(!c[1])return;\r\n      const parts=c[1].split('>').map(s=>s.trim());\r\n      const key=parts.join('|');\r\n      const app={ts:c[0],loc:c[1],pos:c[2],name:c[3],father:c[4],phone:c[5],email:c[6],cv:c[7],addr:c[8],exp:c[9],ref_name:c[10],emg_rel:c[11],emg_phone:c[12],emg_name:c[13],trusted_phone:c[14],social:c[15],photo:c[16],parts,key};\r\n      allApps.push(app);\r\n      if(!appMap[key])appMap[key]=[];\r\n      appMap[key].push(app);\r\n    });\r\n    Object.values(appMap).forEach(arr=>arr.sort((a,b)=>(safeDate(a.ts)||0)-(safeDate(b.ts)||0)));\r\n    initFilters(); updateStats(); renderDivs();\r\n  }catch(e){\r\n    console.error(e);\r\n    document.getElementById('ls-div').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\u274c<\/div>\u09a1\u09c7\u099f\u09be \u09b2\u09cb\u09a1 \u09b9\u09af\u09bc\u09a8\u09bf: '+e.message+'<br><br><button onclick=\"loadData()\" style=\"padding:8px 16px;background:#C0392B;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px\">\u0986\u09ac\u09be\u09b0 \u099a\u09c7\u09b7\u09cd\u099f\u09be \u0995\u09b0\u09c1\u09a8<\/button><\/div>';\r\n  }\r\n}\r\n\r\n\/* \u2500\u2500 FILTER DROPDOWNS \u2500\u2500 *\/\r\nfunction initFilters(){\r\n  const divs=DIV_ORDER.filter(d=>locTree[d]&&canSee(d));\r\n  const fd=document.getElementById('f-div');\r\n  divs.forEach(d=>{ const o=document.createElement('option');o.value=d;o.textContent=d;fd.appendChild(o); });\r\n}\r\nfunction canSee(d){ return !currentUser.filter||d===currentUser.filter; }\r\n\r\nfunction populateDistDD(d){\r\n  const fd=document.getElementById('f-dist'); fd.innerHTML='<option value=\"\">\u2014 \u099c\u09c7\u09b2\u09be \u2014<\/option>';\r\n  if(!d)return;\r\n  Object.keys(locTree[d]||{}).sort((a,b)=>a.localeCompare(b,'bn')).forEach(di=>{ const o=document.createElement('option');o.value=di;o.textContent=di;fd.appendChild(o); });\r\n}\r\nfunction populateUpaDD(d,di){\r\n  const fd=document.getElementById('f-upa'); fd.innerHTML='<option value=\"\">\u2014 \u0989\u09aa\u099c\u09c7\u09b2\u09be \u2014<\/option>';\r\n  if(!d||!di)return;\r\n  Object.keys(locTree[d]?.[di]||{}).sort((a,b)=>a.localeCompare(b,'bn')).forEach(u=>{ const o=document.createElement('option');o.value=u;o.textContent=u;fd.appendChild(o); });\r\n}\r\nfunction populateUnionDD(d,di,u){\r\n  const fd=document.getElementById('f-union'); fd.innerHTML='<option value=\"\">\u2014 \u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 \u2014<\/option>';\r\n  if(!d||!di||!u)return;\r\n  (locTree[d]?.[di]?.[u]||[]).slice().sort((a,b)=>a.localeCompare(b,'bn')).forEach(un=>{ const o=document.createElement('option');o.value=un;o.textContent=un;fd.appendChild(o); });\r\n}\r\n\r\nwindow.applyFilter=function(){\r\n  const d=document.getElementById('f-div').value;\r\n  const di=document.getElementById('f-dist').value;\r\n  const u=document.getElementById('f-upa').value;\r\n  populateDistDD(d); populateUpaDD(d,di); populateUnionDD(d,di,u);\r\n  updateStats();\r\n  renderDivs();\r\n  if(selDiv) clickDiv(selDiv,true);\r\n  if(d && d!==selDiv){ selDiv=d; clickDiv(d,true); }\r\n  if(di && di!==selDist){ selDist=di; clickDist(d,di,true); }\r\n  if(u && u!==selUpa){ selUpa=u; clickUpa(d,di,u,true); }\r\n};\r\nwindow.clearDate=function(){ document.getElementById('f-date').value=''; applyFilter(); };\r\nwindow.setFilter=function(btn){\r\n  document.querySelectorAll('.fbtn').forEach(b=>b.classList.remove('active'));\r\n  btn.classList.add('active'); activeFilter=btn.dataset.f;\r\n  updateStats(); renderDivs();\r\n  if(selDiv) clickDiv(selDiv,true);\r\n  if(selDist) clickDist(selDiv,selDist,true);\r\n  if(selUpa) clickUpa(selDiv,selDist,selUpa,true);\r\n};\r\n\r\n\/* \u2500\u2500 HELPERS \u2500\u2500 *\/\r\nfunction key(...a){ return a.join('|'); }\r\nfunction getApps(k,pos){ return(appMap[k]||[]).filter(a=>a.pos===pos&&passDateFilter(a)&&passStatusFilter(k,pos)); }\r\nfunction passDateFilter(a){\r\n  const d=document.getElementById('f-date').value; if(!d)return true;\r\n  return a.ts&&a.ts.startsWith(new Date(d).toLocaleDateString('en-US',{month:'numeric',day:'numeric',year:'numeric'}).split('\/').reverse().join('-').slice(0,10));\r\n}\r\nfunction passDateFilterByDate(a){\r\n  const d=document.getElementById('f-date').value; if(!d)return true;\r\n  const appDate=safeDateStr(a.ts);\r\n  return appDate===d;\r\n}\r\nfunction passStatusFilter(k,pos){\r\n  if(activeFilter==='all')return true;\r\n  if(activeFilter==='today'){ return false; } \/\/ handled separately\r\n  return true;\r\n}\r\nfunction getAppsRaw(k,pos){\r\n  let apps=(appMap[k]||[]).filter(a=>a.pos===pos);\r\n  const d=document.getElementById('f-date').value;\r\n  const af=activeFilter;\r\n  const today=new Date().toISOString().slice(0,10);\r\n  if(af==='today') apps=apps.filter(a=>safeDateStr(a.ts)===today);\r\n  else if(d) apps=apps.filter(a=>safeDateStr(a.ts)===d);\r\n  return apps;\r\n}\r\nfunction hasApp(k,pos){ return getAppsRaw(k,pos).length>0; }\r\n\r\nfunction divStats(d){\r\n  let apps=0,total=0;\r\n  total++; if(hasApp(key(d),'Deputy Director'))apps++;\r\n  for(const di of Object.keys(locTree[d]||{})){\r\n    total++; if(hasApp(key(d,di),'Sr. Assistant Director'))apps++;\r\n    for(const u of Object.keys(locTree[d][di]||{})){\r\n      total++; if(hasApp(key(d,di,u),'Assistant Director'))apps++;\r\n      for(const un of locTree[d][di][u]||[]){ total++; if(hasApp(key(d,di,u,un),'Manager'))apps++; }\r\n    }\r\n  }\r\n  return{apps,empty:total-apps,total};\r\n}\r\nfunction distStats(d,di){\r\n  let apps=0,total=0;\r\n  total++; if(hasApp(key(d,di),'Sr. Assistant Director'))apps++;\r\n  for(const u of Object.keys(locTree[d]?.[di]||{})){\r\n    total++; if(hasApp(key(d,di,u),'Assistant Director'))apps++;\r\n    for(const un of locTree[d][di][u]||[]){ total++; if(hasApp(key(d,di,u,un),'Manager'))apps++; }\r\n  }\r\n  return{apps,empty:total-apps};\r\n}\r\nfunction upaStats(d,di,u){\r\n  let apps=0,total=0;\r\n  total++; if(hasApp(key(d,di,u),'Assistant Director'))apps++;\r\n  for(const un of locTree[d]?.[di]?.[u]||[]){ total++; if(hasApp(key(d,di,u,un),'Manager'))apps++; }\r\n  return{apps,empty:total-apps};\r\n}\r\n\r\n\/* \u2500\u2500 STATS BAR \u2500\u2500 *\/\r\nfunction updateStats(){\r\n  let filled=0,empty=0,total=0,todayCnt=0;\r\n  const today=new Date().toISOString().slice(0,10);\r\n  for(const d of DIV_ORDER){\r\n    if(!locTree[d]||!canSee(d))continue;\r\n    const s=divStats(d); filled+=s.apps; empty+=s.empty; total+=s.total;\r\n  }\r\n  const vis=allApps.filter(a=>canSee(a.parts[0]));\r\n  const dateV=document.getElementById('f-date').value;\r\n  vis.forEach(a=>{ if(safeDateStr(a.ts)===today)todayCnt++; });\r\n  const filtered=dateV?vis.filter(a=>safeDateStr(a.ts)===dateV):vis;\r\n  const activeFiltered=activeFilter==='today'?vis.filter(a=>safeDateStr(a.ts)===today):filtered;\r\n  document.getElementById('st-total').textContent  = activeFiltered.length;\r\n  document.getElementById('st-filled').textContent = filled;\r\n  document.getElementById('st-empty').textContent  = empty;\r\n  document.getElementById('st-pos').textContent    = total;\r\n  document.getElementById('st-today').textContent  = todayCnt;\r\n  document.getElementById('f-count').textContent   = activeFiltered.length;\r\n}\r\n\r\n\/* \u2500\u2500 APP ROWS \u2500\u2500 *\/\r\nfunction appRows(apps,k,pos){\r\n  if(!apps.length)return'';\r\n  return`<div class=\"app-rows\">${apps.map((a,i)=>`<div class=\"app-row\" onclick=\"event.stopPropagation();openModal('${esc(k)}','${esc(pos)}',${i})\"><div class=\"app-num\">${i+1}<\/div><span class=\"app-name\">${a.name||'\u2014'}<\/span><span class=\"app-arrow\">\u203a<\/span><\/div>`).join('')}<\/div>`;\r\n}\r\n\r\nfunction pillsHTML(apps,empty){\r\n  const s=typeof apps==='object'&&apps.apps!==undefined?apps:{apps:apps.length,empty};\r\n  const af=activeFilter;\r\n  if(af==='full') return s.apps?`<span class=\"pill pill-a\">\u0986\u09ac\u09c7\u09a6\u09a8 ${s.apps}<\/span>`:'';\r\n  if(af==='empty') return s.empty?`<span class=\"pill pill-z\">\u0996\u09be\u09b2\u09bf \u09aa\u09a6 \u0986\u099b\u09c7<\/span>`:'';\r\n  return`<span class=\"pill pill-a\">\u0986\u09ac\u09c7\u09a6\u09a8 ${s.apps}<\/span>`;\r\n}\r\n\r\nfunction shouldShow(s){\r\n  if(activeFilter==='full')return s.apps>0;\r\n  if(activeFilter==='empty')return s.empty>0;\r\n  return true;\r\n}\r\n\r\n\r\n\r\nfunction safeDate(ts) {\r\n  if (!ts) return null;\r\n  \/\/ Handle \"5\/18\/2026 14:09:58\" format from Google Sheets\r\n  try {\r\n    \/\/ Try direct parse\r\n    const d = new Date(ts);\r\n    if (!isNaN(d.getTime())) return d;\r\n    \/\/ Try M\/D\/YYYY H:MM:SS format\r\n    const m = ts.match(\/(\\d+)\\\/(\\d+)\\\/(\\d+)\\s+(\\d+):(\\d+)\/);\r\n    if (m) return new Date(+m[3], +m[1]-1, +m[2], +m[4], +m[5]);\r\n    return null;\r\n  } catch(e) { return null; }\r\n}\r\nfunction safeDateStr(ts) {\r\n  const d = safeDate(ts);\r\n  return d ? d.toISOString().slice(0,10) : '';\r\n}\r\nfunction safeDateLabel(ts) {\r\n  const d = safeDate(ts);\r\n  if (!d) return '';\r\n  try { return d.toLocaleDateString('bn-BD', {year:'numeric',month:'long',day:'numeric'}); }\r\n  catch(e) { return ts; }\r\n}\r\n\r\n\/* \u2500\u2500 HOVER STATS IN COLUMN HEADERS \u2500\u2500 *\/\r\nfunction showHS(id, name, apps) {\r\n  const el = document.getElementById('hs-' + id);\r\n  if (!el) return;\r\n  el.innerHTML = '<span class=\"chs-name\">' + name + '<\/span>' +\r\n    (apps > 0 ? '<span class=\"chs-app\">\u0986\u09ac\u09c7\u09a6\u09a8 ' + apps + '<\/span>' : '<span style=\"font-size:10px;color:var(--text3)\">\u0986\u09ac\u09c7\u09a6\u09a8 \u09a8\u09c7\u0987<\/span>');\r\n  el.classList.add('vis');\r\n}\r\nfunction clearHS(id) {\r\n  const el = document.getElementById('hs-' + id);\r\n  if (!el) return;\r\n  el.innerHTML = ''; el.classList.remove('vis');\r\n}\r\n\r\n\/* \u2500\u2500 RENDER DIVISIONS \u2500\u2500 *\/\r\nfunction renderDivs(){\r\n  const divs=DIV_ORDER.filter(d=>locTree[d]&&canSee(d));\r\n  document.getElementById('ct-div').textContent=divs.length+' \u099f\u09bf';\r\n  document.getElementById('ls-div').innerHTML=divs.map(d=>{\r\n    const s=divStats(d);\r\n    if(!shouldShow(s))return'';\r\n    const dApps=getAppsRaw(key(d),'Deputy Director');\r\n    return`<div class=\"card${selDiv===d?' active':''}\" id=\"cd-${esc(d)}\" onmouseenter=\"clickDiv('${esc(d)}');showHS('div','${esc(d)}',${s.apps})\" onmouseleave=\"clearHS('div')\">\r\n      <div class=\"card-top\">\r\n        <div class=\"card-info\"><span class=\"card-role\">Deputy Director<\/span><span class=\"card-name\">${d}<\/span><\/div>\r\n        <div class=\"card-pills\">${pillsHTML(s)}<\/div>\r\n      <\/div>\r\n      ${appRows(dApps,key(d),'Deputy Director')}\r\n    <\/div>`;\r\n  }).join('')||'<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udd12<\/div>\u0995\u09cb\u09a8\u09cb \u09ac\u09bf\u09ad\u09be\u0997 \u09a8\u09c7\u0987<\/div>';\r\n}\r\n\r\nwindow.clickDiv=function(d,skipReset){\r\n  selDiv=d; if(!skipReset){selDist=null;selUpa=null;}\r\n  document.querySelectorAll('#ls-div .card').forEach(el=>{\r\n    el.classList.toggle('active',el.id==='cd-'+d);\r\n    el.classList.toggle('dim',el.id!=='cd-'+d);\r\n  });\r\n  document.getElementById('back-dist').style.display='block';\r\n  const dists=Object.keys(locTree[d]||{}).sort((a,b)=>a.localeCompare(b,'bn'));\r\n  const distTotalApps = dists.reduce((sum,di)=>{ const s=distStats(d,di); return sum+s.apps; },0);\r\n  document.getElementById('ct-dist').textContent=dists.length+' \u099f\u09bf';\r\n  const ctDistApp=document.getElementById('ct-dist-app');\r\n  if(ctDistApp){ctDistApp.textContent='\u0986\u09ac\u09c7\u09a6\u09a8 '+distTotalApps;ctDistApp.style.display='';}\r\n\r\n  document.getElementById('ls-dist').innerHTML=dists.map(di=>{\r\n    const s=distStats(d,di); if(!shouldShow(s))return'';\r\n    const apps=getAppsRaw(key(d,di),'Sr. Assistant Director');\r\n    return`<div class=\"card${selDist===di?' active':''}\" id=\"dd-${esc(di)}\" onmouseenter=\"clickDist('${esc(d)}','${esc(di)}');showHS('dist','${esc(di)}',${s.apps})\" onmouseleave=\"clearHS('dist')\">\r\n      <div class=\"card-top\">\r\n        <div class=\"card-info\"><span class=\"card-role\">Sr. Asst. Director<\/span><span class=\"card-name\">${di}<\/span><\/div>\r\n        <div class=\"card-pills\">${pillsHTML(s)}<\/div>\r\n      <\/div>\r\n      ${appRows(apps,key(d,di),'Sr. Assistant Director')}\r\n    <\/div>`;\r\n  }).join('')||'<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udced<\/div>\u0995\u09cb\u09a8\u09cb \u099c\u09c7\u09b2\u09be \u09a8\u09c7\u0987<\/div>';\r\n  if(!skipReset){\r\n    document.getElementById('ls-upa').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ls-union').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ct-upa').textContent='\u2014'; document.getElementById('ct-union').textContent='\u2014';\r\n    document.getElementById('back-upa').style.display='none'; document.getElementById('back-union').style.display='none';\r\n    ['upa','union'].forEach(c=>{const e=document.getElementById('ct-'+c+'-app');if(e)e.style.display='none';});\r\n  }\r\n};\r\n\r\nwindow.clickDist=function(d,di,skipReset){\r\n  selDist=di; if(!skipReset)selUpa=null;\r\n  document.querySelectorAll('#ls-dist .card').forEach(el=>{\r\n    el.classList.toggle('active',el.id==='dd-'+di);\r\n    el.classList.toggle('dim',el.id!=='dd-'+di);\r\n  });\r\n  document.getElementById('back-upa').style.display='block';\r\n  const upas=Object.keys(locTree[d]?.[di]||{}).sort((a,b)=>a.localeCompare(b,'bn'));\r\n  const upaTotalApps = upas.reduce((sum,u)=>{ const s=upaStats(d,di,u); return sum+s.apps; },0);\r\n  document.getElementById('ct-upa').textContent=upas.length+' \u099f\u09bf';\r\n  const ctUpaApp=document.getElementById('ct-upa-app');\r\n  if(ctUpaApp){ctUpaApp.textContent='\u0986\u09ac\u09c7\u09a6\u09a8 '+upaTotalApps;ctUpaApp.style.display='';}\r\n\r\n  document.getElementById('ls-upa').innerHTML=upas.map(u=>{\r\n    const s=upaStats(d,di,u); if(!shouldShow(s))return'';\r\n    const apps=getAppsRaw(key(d,di,u),'Assistant Director');\r\n    return`<div class=\"card${selUpa===u?' active':''}\" id=\"cu-${esc(u)}\" onmouseenter=\"clickUpa('${esc(d)}','${esc(di)}','${esc(u)}');showHS('upa','${esc(u)}',${s.apps})\" onmouseleave=\"clearHS('upa')\">\r\n      <div class=\"card-top\">\r\n        <div class=\"card-info\"><span class=\"card-role\">Asst. Director<\/span><span class=\"card-name\">${u}<\/span><\/div>\r\n        <div class=\"card-pills\">${pillsHTML(s)}<\/div>\r\n      <\/div>\r\n      ${appRows(apps,key(d,di,u),'Assistant Director')}\r\n    <\/div>`;\r\n  }).join('')||'<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udced<\/div>\u0995\u09cb\u09a8\u09cb \u0989\u09aa\u099c\u09c7\u09b2\u09be \u09a8\u09c7\u0987<\/div>';\r\n  if(!skipReset){\r\n    document.getElementById('ls-union').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ct-union').textContent='\u2014';\r\n    document.getElementById('back-union').style.display='none';\r\n    const eU=document.getElementById('ct-union-app');if(eU)eU.style.display='none';\r\n  }\r\n};\r\n\r\nwindow.clickUpa=function(d,di,u,skipReset){\r\n  selUpa=u;\r\n  document.querySelectorAll('#ls-upa .card').forEach(el=>{\r\n    el.classList.toggle('active',el.id==='cu-'+u);\r\n    el.classList.toggle('dim',el.id!=='cu-'+u);\r\n  });\r\n  document.getElementById('back-union').style.display='block';\r\n  const unions=(locTree[d]?.[di]?.[u]||[]).slice().sort((a,b)=>a.localeCompare(b,'bn'));\r\n  const unionTotalApps = unions.reduce((sum,un)=>{ return sum + getAppsRaw(key(d,di,u,un),'Manager').length; },0);\r\n  document.getElementById('ct-union').textContent=unions.length+' \u099f\u09bf';\r\n  const ctUnionApp=document.getElementById('ct-union-app');\r\n  if(ctUnionApp){ctUnionApp.textContent='\u0986\u09ac\u09c7\u09a6\u09a8 '+unionTotalApps;ctUnionApp.style.display='';}\r\n\r\n  document.getElementById('ls-union').innerHTML=unions.map(un=>{\r\n    const k=key(d,di,u,un);\r\n    const apps=getAppsRaw(k,'Manager');\r\n    const show=activeFilter==='full'?apps.length>0:activeFilter==='empty'?apps.length===0:true;\r\n    if(!show)return'';\r\n    return`<div class=\"union-card\" onmouseenter=\"showHS('union','${esc(un)}',${apps.length})\" onmouseleave=\"clearHS('union')\">\r\n      <div><span class=\"union-role\">Manager<\/span><span class=\"union-name\">${un}<\/span><\/div>\r\n      ${apps.length?`<div><div class=\"card-pills\" style=\"align-items:flex-end\"><span class=\"pill pill-a\">${apps.length} \u099c\u09a8<\/span><\/div>${appRows(apps,k,'Manager')}<\/div>`:`<span class=\"pill pill-z\">\u0986\u09ac\u09c7\u09a6\u09a8 \u09a8\u09c7\u0987<\/span>`}\r\n    <\/div>`;\r\n  }).join('')||'<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udced<\/div>\u0995\u09cb\u09a8\u09cb \u0987\u0989\u09a8\u09bf\u09af\u09bc\u09a8 \u09a8\u09c7\u0987<\/div>';\r\n};\r\n\r\n\/* \u2500\u2500 BACK \u2500\u2500 *\/\r\nwindow.resetFrom=function(level){\r\n  function clearHSEl(id){ const e=document.getElementById('hs-'+id); if(e){e.innerHTML='';e.classList.remove('vis');} }\r\n  if(level==='dist'){\r\n    selDiv=null; selDist=null; selUpa=null;\r\n    document.querySelectorAll('#ls-div .card').forEach(el=>{ el.classList.remove('active','dim'); });\r\n    document.getElementById('ls-dist').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u09ac\u09bf\u09ad\u09be\u0997\u09c7 \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ls-upa').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ls-union').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ct-dist').textContent='\u2014'; document.getElementById('ct-upa').textContent='\u2014'; document.getElementById('ct-union').textContent='\u2014';\r\n    ['dist','upa','union'].forEach(c=>{const e=document.getElementById('ct-'+c+'-app');if(e)e.style.display='none';});\r\n    document.getElementById('back-dist').style.display='none'; document.getElementById('back-upa').style.display='none'; document.getElementById('back-union').style.display='none';\r\n    clearHSEl('dist'); clearHSEl('upa'); clearHSEl('union');\r\n  } else if(level==='upa'){\r\n    selDist=null; selUpa=null;\r\n    document.querySelectorAll('#ls-dist .card').forEach(el=>{ el.classList.remove('active','dim'); });\r\n    document.getElementById('ls-upa').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ls-union').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ct-upa').textContent='\u2014'; document.getElementById('ct-union').textContent='\u2014';\r\n    document.getElementById('back-upa').style.display='none'; document.getElementById('back-union').style.display='none';\r\n    ['upa','union'].forEach(c=>{const e=document.getElementById('ct-'+c+'-app');if(e)e.style.display='none';});\r\n    clearHSEl('upa'); clearHSEl('union');\r\n  } else if(level==='union'){\r\n    selUpa=null;\r\n    document.querySelectorAll('#ls-upa .card').forEach(el=>{ el.classList.remove('active','dim'); });\r\n    document.getElementById('ls-union').innerHTML='<div class=\"col-empty\"><div class=\"col-empty-icon\">\ud83d\udc48<\/div>\u0989\u09aa\u099c\u09c7\u09b2\u09be\u09af\u09bc \u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09c1\u09a8<\/div>';\r\n    document.getElementById('ct-union').textContent='\u2014';\r\n    document.getElementById('back-union').style.display='none';\r\n    const eU=document.getElementById('ct-union-app');if(eU)eU.style.display='none';\r\n    clearHSEl('union');\r\n  }\r\n};\r\n\r\n\/* \u2500\u2500 MODAL \u2500\u2500 *\/\r\nfunction driveImg(url){\r\n  if(!url||!url.trim())return'';\r\n  url=url.trim();\r\n  if(url.includes('uc?export=view'))return url;\r\n  const m=url.match(\/\\\/d\\\/([a-zA-Z0-9_-]+)\/);\r\n  if(m)return'https:\/\/drive.google.com\/uc?export=view&id='+m[1];\r\n  const m2=url.match(\/[?&]id=([a-zA-Z0-9_-]+)\/);\r\n  if(m2)return'https:\/\/drive.google.com\/uc?export=view&id='+m2[1];\r\n  return url.startsWith('http')?url:'';\r\n}\r\nfunction waLink(p){ p=(p||'').replace(\/[^0-9]\/g,''); if(p.startsWith('0'))p='880'+p.slice(1); if(!p.startsWith('880'))p='880'+p; return'https:\/\/wa.me\/'+p; }\r\nfunction sType(url){ if(!url||!url.trim())return null; const u=url.toLowerCase(); if(u.includes('facebook.com')||u.includes('fb.com'))return'fb'; if(u.includes('linkedin.com'))return'li'; return url.startsWith('http')?'other':null; }\r\n\r\nwindow.openModal=function(k,pos,idx){\r\n  const apps=(appMap[k]||[]).filter(a=>a.pos===pos);\r\n  if(!apps.length)return;\r\n  modalApps=apps; modalIdx=idx||0;\r\n  renderModal();\r\n  document.getElementById('modal').classList.add('open');\r\n};\r\nwindow.closeModal=function(){ document.getElementById('modal').classList.remove('open'); };\r\nwindow.switchTab=function(i){ modalIdx=i; renderModal(); };\r\n\r\nfunction renderModal(){\r\n  const a=modalApps[modalIdx];\r\n  if(!a)return;\r\n  document.getElementById('m-name').textContent=a.name||'\u2014';\r\n  document.getElementById('m-loc').textContent=a.parts.join(' \u203a ');\r\n  document.getElementById('m-pos').textContent=a.pos||'\u2014';\r\n  const ph=document.getElementById('m-photo');\r\n  const pu=driveImg(a.photo);\r\n  if(pu){ const img=document.createElement('img'); img.onerror=()=>{ph.innerHTML='\ud83d\udc64';}; img.src=pu; ph.innerHTML=''; ph.appendChild(img); }\r\n  else ph.innerHTML='\ud83d\udc64';\r\n  const tabs=document.getElementById('m-tabs');\r\n  tabs.innerHTML=modalApps.length>1?modalApps.map((_,i)=>`<button class=\"m-tab${i===modalIdx?' active':''}\" onclick=\"switchTab(${i})\">${i+1}\u09a8\u0982<\/button>`).join(''):'';\r\n  const st=sType(a.social);\r\n  let sb='';\r\n  if(st==='fb')sb=`<a class=\"abn abn-fb\" href=\"${a.social}\" target=\"_blank\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z\"\/><\/svg>Facebook<\/a>`;\r\n  else if(st==='li')sb=`<a class=\"abn abn-li\" href=\"${a.social}\" target=\"_blank\">LinkedIn<\/a>`;\r\n  else if(st==='other')sb=`<a class=\"abn abn-fb\" href=\"${a.social}\" target=\"_blank\">\ud83d\udd17 Profile<\/a>`;\r\n  document.getElementById('m-actions').innerHTML=\r\n    `<a class=\"abn abn-call\" href=\"tel:${a.phone}\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07A19.5 19.5 0 013.07 9.81 19.79 19.79 0 01.5 1.18 2 2 0 012.5 0h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L6.91 7.91a16 16 0 006.72 6.72l1.28-1.28a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z\"\/><\/svg>\u0995\u09b2<\/a>\r\n    <a class=\"abn abn-wa\" href=\"${waLink(a.phone)}\" target=\"_blank\"><svg viewBox=\"0 0 32 32\" fill=\"currentColor\"><path d=\"M16 3C8.82 3 3 8.82 3 16c0 2.39.65 4.63 1.78 6.56L3 29l6.62-1.74A13.03 13.03 0 0016 29c7.18 0 13-5.82 13-13S23.18 3 16 3zm5.9 16.1c-.3-.15-1.77-.87-2.04-.97-.28-.1-.48-.15-.68.15-.2.3-.77.97-.94 1.17-.17.2-.35.22-.65.07-.3-.15-1.26-.46-2.4-1.48-.89-.79-1.49-1.77-1.66-2.07-.17-.3-.02-.46.13-.61.13-.13.3-.35.44-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.02-.52-.08-.15-.68-1.63-.93-2.23-.24-.58-.49-.5-.68-.51h-.58c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.48 0 1.46 1.06 2.87 1.21 3.07.15.2 2.08 3.18 5.04 4.46.7.3 1.25.48 1.68.62.7.22 1.34.19 1.84.12.56-.08 1.77-.72 2.02-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35z\"\/><\/svg>WhatsApp<\/a>\r\n    ${sb}${a.cv?`<a class=\"abn abn-cv\" href=\"${a.cv}\" target=\"_blank\">\ud83d\udcc4 CV<\/a>`:''}`;\r\n  const f=(l,v)=>v?`<div class=\"fbox\"><span class=\"flbl\">${l}<\/span><span class=\"fval\">${v}<\/span><\/div>`:'';\r\n  const ff=(l,v)=>v?`<div class=\"fbox full\"><span class=\"flbl\">${l}<\/span><span class=\"fval\">${v}<\/span><\/div>`:'';\r\n  document.getElementById('m-body').innerHTML=`\r\n    <div class=\"sec-lbl\"><span>\u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf\u0997\u09a4 \u09a4\u09a5\u09cd\u09af<\/span><\/div>\r\n    <div class=\"fgrid\">${f('\u09aa\u09c2\u09b0\u09cd\u09a3 \u09a8\u09be\u09ae',a.name)}${f('\u09aa\u09bf\u09a4\u09be\u09b0 \u09a8\u09be\u09ae',a.father)}${f('\u09ab\u09cb\u09a8',a.phone)}${f('\u0987\u09ae\u09c7\u0987\u09b2',a.email)}${ff('\u09a0\u09bf\u0995\u09be\u09a8\u09be',a.addr)}${ff('\u0985\u09ad\u09bf\u099c\u09cd\u099e\u09a4\u09be',a.exp)}<\/div>\r\n    ${a.ref_name?`<div class=\"sec-lbl\"><span>\u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09a8\u09cd\u09b8<\/span><\/div><div class=\"fgrid\">${ff('\u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09a8\u09cd\u09b8 \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf\u09b0 \u09a8\u09be\u09ae',a.ref_name)}<\/div>`:''}\r\n    ${(a.emg_name||a.emg_phone)?`<div class=\"sec-lbl\"><span>\u099c\u09b0\u09c1\u09b0\u09bf \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997<\/span><\/div><div class=\"fgrid\">${f('\u09a8\u09be\u09ae',a.emg_name)}${f('\u09b8\u09ae\u09cd\u09aa\u09b0\u09cd\u0995',a.emg_rel)}${ff('\u09ab\u09cb\u09a8',a.emg_phone)}<\/div>`:''}\r\n    ${a.trusted_phone?`<div class=\"sec-lbl\"><span>\u09ac\u09bf\u09b6\u09cd\u09ac\u09b8\u09cd\u09a4 \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf<\/span><\/div><div class=\"fgrid\">${ff('\u09ab\u09cb\u09a8',a.trusted_phone)}<\/div>`:''}\r\n    <div class=\"sec-lbl\"><span>\u09a1\u0995\u09c1\u09ae\u09c7\u09a8\u09cd\u099f<\/span><\/div>\r\n    <div class=\"fgrid\">${f('\u0986\u09ac\u09c7\u09a6\u09a8\u09c7\u09b0 \u09a4\u09be\u09b0\u09bf\u0996',a.ts?safeDateLabel(a.ts):'')}${a.cv?`<div class=\"fbox\"><span class=\"flbl\">CV<\/span><span class=\"fval\"><a href=\"${a.cv}\" target=\"_blank\">\u09a6\u09c7\u0996\u09c1\u09a8 \u2192<\/a><\/span><\/div>`:''}<\/div>\r\n    <button class=\"dl-btn\" onclick=\"dlPDF()\">\u2b07 PDF \u09a1\u09be\u0989\u09a8\u09b2\u09cb\u09a1<\/button>`;\r\n}\r\n\r\n\/* \u2500\u2500 PDF \u2500\u2500 *\/\r\nwindow.dlPDF=function(){\r\n  const a=modalApps[modalIdx]; if(!a)return;\r\n  const pu=driveImg(a.photo); const st=sType(a.social);\r\n  const sl=st==='li'?'LinkedIn':st==='fb'?'Facebook':'Social';\r\n  const r=(l,v)=>v?`<div class=\"fd\"><div class=\"fl\">${l}<\/div><div class=\"fv\">${v}<\/div><\/div>`:'';\r\n  const rf=(l,v)=>v?`<div class=\"fd f\"><div class=\"fl\">${l}<\/div><div class=\"fv\">${v}<\/div><\/div>`:'';\r\n  const html=`<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@400;500;700&display=swap\" rel=\"stylesheet\">\r\n<style>*{box-sizing:border-box;margin:0;padding:0;}body{font-family:'Roboto',sans-serif;background:#f5f5f7;padding:28px;color:#111;}\r\n.wrap{max-width:600px;margin:auto;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 4px 24px rgba(0,0,0,.1);}\r\n.head{background:linear-gradient(135deg,#96281B,#C0392B);padding:22px 24px;display:flex;align-items:center;gap:16px;}\r\n.ph{width:68px;height:68px;border-radius:50%;border:2px solid rgba(255,255,255,.3);background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;overflow:hidden;}\r\n.ph img{width:100%;height:100%;object-fit:cover;border-radius:50%;}\r\n.hn{font-size:18px;font-weight:700;color:#fff;margin-bottom:2px;}.hp{font-size:11px;color:rgba(255,255,255,.72);}.hl{font-size:10px;color:rgba(255,255,255,.5);margin-top:2px;}\r\n.body{padding:20px 24px;}\r\n.sec{font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#aaa;display:flex;align-items:center;gap:7px;margin:14px 0 8px;}\r\n.sec:first-child{margin-top:0;}.sec::before,.sec::after{content:'';flex:1;height:1px;background:#eee;}\r\n.grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;}\r\n.fd{padding:9px 11px;background:#f8f8f8;border-radius:7px;border-left:3px solid #C0392B;}\r\n.fd.f{grid-column:1\/-1;}.fl{font-size:8px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#bbb;margin-bottom:2px;}.fv{font-size:12px;font-weight:500;color:#111;line-height:1.4;word-break:break-word;}\r\n.foot{padding:12px 24px;background:#fafafa;border-top:1px solid #eee;text-align:center;font-size:9px;color:#ccc;}\r\n<\/style><\/head><body><div class=\"wrap\">\r\n<div class=\"head\"><div class=\"ph\">${pu?`<img decoding=\"async\" src=\"${pu}\" alt=\"\">`:'\ud83d\udc64'}<\/div><div><div class=\"hn\">${a.name||'\u2014'}<\/div><div class=\"hp\">${a.pos||'\u2014'}<\/div><div class=\"hl\">${a.parts.join(' \u203a ')}<\/div><\/div><\/div>\r\n<div class=\"body\"><div class=\"sec\"><span>\u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf\u0997\u09a4 \u09a4\u09a5\u09cd\u09af<\/span><\/div>\r\n<div class=\"grid\">${r('\u09aa\u09c2\u09b0\u09cd\u09a3 \u09a8\u09be\u09ae',a.name)}${r('\u09aa\u09bf\u09a4\u09be\u09b0 \u09a8\u09be\u09ae',a.father)}${r('\u09ab\u09cb\u09a8',a.phone)}${r('\u0987\u09ae\u09c7\u0987\u09b2',a.email)}${rf('\u09a0\u09bf\u0995\u09be\u09a8\u09be',a.addr)}${rf('\u0985\u09ad\u09bf\u099c\u09cd\u099e\u09a4\u09be',a.exp)}<\/div>\r\n${a.ref_name?`<div class=\"sec\"><span>\u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09a8\u09cd\u09b8<\/span><\/div><div class=\"grid\">${rf('\u09b0\u09c7\u09ab\u09be\u09b0\u09c7\u09a8\u09cd\u09b8',a.ref_name)}<\/div>`:''}\r\n${(a.emg_name||a.emg_phone)?`<div class=\"sec\"><span>\u099c\u09b0\u09c1\u09b0\u09bf \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997<\/span><\/div><div class=\"grid\">${r('\u09a8\u09be\u09ae',a.emg_name)}${r('\u09b8\u09ae\u09cd\u09aa\u09b0\u09cd\u0995',a.emg_rel)}${rf('\u09ab\u09cb\u09a8',a.emg_phone)}<\/div>`:''}\r\n${a.trusted_phone?`<div class=\"sec\"><span>\u09ac\u09bf\u09b6\u09cd\u09ac\u09b8\u09cd\u09a4 \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf<\/span><\/div><div class=\"grid\">${rf('\u09ab\u09cb\u09a8',a.trusted_phone)}<\/div>`:''}\r\n<div class=\"sec\"><span>\u09a1\u0995\u09c1\u09ae\u09c7\u09a8\u09cd\u099f<\/span><\/div>\r\n<div class=\"grid\">${a.social?r(sl,a.social):''}${a.cv?r('CV',a.cv):''}${r('\u09a4\u09be\u09b0\u09bf\u0996',a.ts?safeDateLabel(a.ts):'')}<\/div><\/div>\r\n<div class=\"foot\">Salmon Developers Ltd. \u2014 Organogram System<\/div><\/div><\/body><\/html>`;\r\n  const blob=new Blob([html],{type:'text\/html'});\r\n  const url=URL.createObjectURL(blob);\r\n  const link=document.createElement('a'); link.href=url; link.download=(a.name||'applicant').replace(\/\\s+\/g,'_')+'_profile.html'; link.click(); URL.revokeObjectURL(url);\r\n};\r\n\r\nfunction esc(s){ return(s||'').replace(\/\\\\\/g,'\\\\\\\\').replace(\/'\/g,\"\\\\'\"); }\r\n\r\n})();\r\n<\/script>\r\n<\/body>\r\n<\/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>HR Dashboard \u2014 Salmon Developers HR Dashboard Click to open Live \u25bc Loading&#8230; Loading&#8230; Refresh Overview Today&#8217;s Attendance Attendance History Employees Leave HR Tasks Recruitment Lifecycle Loading&#8230; Brand &#038; Marketing Dashboard \u2014 Salmon Developers Brand &#038; Marketing Dashboard Click to open Live \u25bc Loading&#8230; Loading&#8230; Refresh PDF Share Overview Insights Mr. Orin Mr. Nishit Mr. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-12","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Organogram - Salmon Developers Ltd.<\/title>\n<meta name=\"description\" content=\"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Organogram - Salmon Developers Ltd.\" \/>\n<meta property=\"og:description\" content=\"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/organogramtree.salmondevelopersbd.com\/\" \/>\n<meta property=\"og:site_name\" content=\"Salmon Developers Ltd.\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-17T04:33:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/\",\"url\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/\",\"name\":\"Organogram - Salmon Developers Ltd.\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/drive.google.com\\\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\",\"datePublished\":\"2026-05-19T05:37:40+00:00\",\"dateModified\":\"2026-09-17T04:33:18+00:00\",\"description\":\"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#primaryimage\",\"url\":\"https:\\\/\\\/drive.google.com\\\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\",\"contentUrl\":\"https:\\\/\\\/drive.google.com\\\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Organogram\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/#website\",\"url\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/\",\"name\":\"Salmon Developers Ltd.\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/organogramtree.salmondevelopersbd.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Organogram - Salmon Developers Ltd.","description":"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Organogram - Salmon Developers Ltd.","og_description":"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.","og_url":"https:\/\/organogramtree.salmondevelopersbd.com\/","og_site_name":"Salmon Developers Ltd.","article_modified_time":"2026-09-17T04:33:18+00:00","og_image":[{"url":"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/organogramtree.salmondevelopersbd.com\/","url":"https:\/\/organogramtree.salmondevelopersbd.com\/","name":"Organogram - Salmon Developers Ltd.","isPartOf":{"@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#primaryimage"},"image":{"@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#primaryimage"},"thumbnailUrl":"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-","datePublished":"2026-05-19T05:37:40+00:00","dateModified":"2026-09-17T04:33:18+00:00","description":"Explore the organizational structure of Salmon Developers Ltd and learn about the leadership, departments, and management team driving excellence in real estate development in Bangladesh.","breadcrumb":{"@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/organogramtree.salmondevelopersbd.com\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#primaryimage","url":"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-","contentUrl":"https:\/\/drive.google.com\/uc?export=view&id=1oPCV9W4KQfrYkS3bHg6ga16p900aNV3-"},{"@type":"BreadcrumbList","@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/organogramtree.salmondevelopersbd.com\/"},{"@type":"ListItem","position":2,"name":"Organogram"}]},{"@type":"WebSite","@id":"https:\/\/organogramtree.salmondevelopersbd.com\/#website","url":"https:\/\/organogramtree.salmondevelopersbd.com\/","name":"Salmon Developers Ltd.","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/organogramtree.salmondevelopersbd.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/pages\/12","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12"}],"version-history":[{"count":563,"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/pages\/12\/revisions"}],"predecessor-version":[{"id":615,"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=\/wp\/v2\/pages\/12\/revisions\/615"}],"wp:attachment":[{"href":"https:\/\/organogramtree.salmondevelopersbd.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}