Drawers (Offcanvas)
Offcanvas drawers with actionable timelines, and modals empower you to navigate through admin sidebars.
<!-- Activity Offcanvas -->
<div id="hs-pro-dnam" class="hs-overlay hs-overlay-open:translate-x-0 hidden nnchn fixed zxmp1 aoum9 nf9l7 ixagr pve7h kquz2 wxttw c61v5 flex flex-col zxv30 dark:bg-neutral-800" role="dialog" tabindex="-1" aria-labelledby="hs-pro-dnam-label">
<!-- Header -->
<div class="u3poc gjk1t flex saet7 items-center xu4xz yxawv dark:border-neutral-700">
<h3 id="hs-pro-dnam-label" class="hw6xt ejo46 dark:text-neutral-200">
Activity
</h3>
<button type="button" class="x8hlq n2l26 flex enhxb items-center u3ov7 mr9qs k9mkq je4jy gxtht ejo46 p12pm disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden d10id dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-dnam">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- End Header -->
<!-- Body -->
<div class="rht0b sbb0f ux1hp overflow-y-auto overflow-hidden hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
<!-- Vertical Steps -->
<div>
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
James Collins
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Added 2 files to task
<a class="djyey moa07 inline-flex items-center r2jif tuuss j28t5 njs8g h8tqt focus:outline-hidden ch28j hw6xt dark:text-blue-500" href="#">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"/></svg>
PR-3
</a>
</p>
<div class="nqo4p">
<!-- Media -->
<div class="khfgm theuu v6f2r">
<!-- Data Snippet -->
<div class="inline-block zxv30 k9mkq yxawv wavyl ur00w dark:bg-neutral-800 dark:border-neutral-700">
<div class="flex u3ov7">
<svg class="n2l26 rekd6" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.7438 0.940745C6.84695 1.30308 2.6841 1.63631 2.48837 1.67533C1.9396 1.77319 1.44038 2.14544 1.20563 2.63537L1 3.06646L1.01982 13.3407L1.04893 23.615L1.36234 24.2517C1.53886 24.6042 2.73365 26.2499 4.0362 27.9439C6.61221 31.2836 6.79802 31.47 7.77726 31.5679C8.06156 31.597 10.1966 31.4991 12.5081 31.3622C14.8295 31.2154 18.5508 30.99 20.7842 30.863C30.3233 30.2839 29.8334 30.3328 30.3815 29.8627C31.0672 29.2947 31.0183 30.2251 31.0474 17.7377C31.0672 7.15003 31.0573 6.45509 30.9006 6.13177C30.7148 5.76943 30.3815 5.51487 26.0329 2.45885C23.1243 0.421704 22.9186 0.313932 21.6155 0.294111C21.0772 0.274911 16.6307 0.568497 11.7438 0.940745ZM22.752 2.28232C23.1633 2.46814 26.1704 4.56412 26.6108 4.9661C26.7284 5.08378 26.7675 5.18164 26.7086 5.24048C26.5717 5.35817 7.96245 6.465 7.42421 6.38634C7.17956 6.34732 6.81722 6.20052 6.61159 6.06302C5.75932 5.48514 3.64413 3.75149 3.64413 3.62452C3.64413 3.29129 3.57538 3.29129 11.8714 2.69421C13.4582 2.58644 16.0633 2.39071 17.6502 2.26312C21.0871 1.98874 22.1159 1.99865 22.752 2.28232ZM28.6677 7.63996C28.8046 7.77685 28.9223 8.04132 28.9613 8.29589C28.9904 8.53125 29.0102 12.9189 28.9904 18.0313C28.9613 26.8067 28.9514 27.3555 28.7848 27.61C28.6869 27.7667 28.4912 27.9333 28.3438 27.9823C27.9331 28.1489 8.43318 29.2557 8.03183 29.138C7.84601 29.0891 7.59083 28.9324 7.45394 28.7955L7.21858 28.541L7.18947 19.0799C7.16965 12.4395 7.18947 9.5012 7.26813 9.23672C7.32697 9.041 7.47376 8.80564 7.60136 8.72759C7.77788 8.60991 8.93364 8.51205 12.9101 8.2773C15.7016 8.1206 20.0206 7.85613 22.4987 7.70933C28.3933 7.34638 28.3741 7.34638 28.6677 7.63996Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M23.4277 10.8818C22.3698 10.9506 21.4296 11.0484 21.3218 11.1073C20.9985 11.2739 20.8028 11.5483 20.7638 11.8617C20.7347 12.185 20.8325 12.224 21.8898 12.3516L22.35 12.4104V16.5925C22.35 19.0799 22.311 20.7256 22.2621 20.6767C22.2131 20.6178 20.8226 18.5027 19.167 15.9756C17.512 13.4392 16.1407 11.3525 16.1209 11.3333C16.1011 11.3135 15.024 11.3724 13.7313 11.4609C12.1445 11.5687 11.273 11.6666 11.0965 11.7644C10.8122 11.9112 10.4988 12.4303 10.4988 12.7734C10.4988 12.979 10.871 13.0868 11.6545 13.0868H12.0658V25.1139L11.4 25.3196C10.8809 25.4763 10.7044 25.5741 10.6165 25.7698C10.4598 26.1031 10.4697 26.4066 10.6264 26.4066C10.6852 26.4066 11.792 26.3378 13.0649 26.2598C15.582 26.113 15.8657 26.0442 16.1302 25.5252C16.2088 25.3685 16.277 25.2019 16.277 25.1529C16.277 25.1139 15.9345 24.9962 15.5226 24.8984C15.1014 24.8005 14.6802 24.7027 14.5923 24.6828C14.4257 24.6339 14.4157 24.3304 14.4157 20.1186V15.6033L17.3931 20.2753C20.5173 25.1721 20.9093 25.7308 21.3893 25.9755C21.987 26.2889 23.5051 26.0733 24.2688 25.5741L24.5042 25.4273L24.524 18.7479L24.5531 12.0586L25.0722 11.9608C25.6891 11.8431 25.9734 11.5594 25.9734 11.0695C25.9734 10.7561 25.9536 10.7362 25.66 10.7462C25.4847 10.7542 24.4757 10.813 23.4277 10.8818Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/></svg>
<div class="dgznh truncate">
<p class="block truncate on128 ejo46 dark:text-neutral-300">
list-of-users
</p>
<small class="block on128 lqxom dark:text-neutral-500">
35kb
</small>
</div>
</div>
</div>
<!-- End Data Snippet -->
<!-- Data Snippet -->
<div class="inline-block zxv30 k9mkq yxawv wavyl ur00w dark:bg-neutral-800 dark:border-neutral-700">
<div class="flex u3ov7">
<svg class="n2l26 rekd6" width="33" height="32" viewBox="0 0 33 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.0001 0C7.16461 0 0 7.34466 0 16.405C0 23.6533 4.5845 29.8026 10.9419 31.9718C11.7415 32.1236 12.0351 31.6159 12.0351 31.1826C12.0351 30.7915 12.0202 29.4991 12.0134 28.1283C7.56202 29.1207 6.62276 26.1927 6.62276 26.1927C5.89494 24.2965 4.84626 23.7924 4.84626 23.7924C3.39464 22.7742 4.95568 22.795 4.95568 22.795C6.5624 22.9108 7.40843 24.4856 7.40843 24.4856C8.83545 26.9936 11.1514 26.2685 12.0645 25.8495C12.208 24.789 12.6227 24.0654 13.0803 23.6558C9.5265 23.2408 5.79054 21.8342 5.79054 15.5483C5.79054 13.7573 6.41559 12.2938 7.43917 11.1449C7.27303 10.7317 6.72541 9.0632 7.59415 6.80351C7.59415 6.80351 8.93772 6.36259 11.9953 8.48512C13.2715 8.12152 14.6403 7.93934 16.0001 7.93316C17.3598 7.93934 18.7296 8.12152 20.0083 8.48512C23.0623 6.36259 24.404 6.80351 24.404 6.80351C25.2748 9.0632 24.727 10.7317 24.5608 11.1449C25.5867 12.2938 26.2075 13.7572 26.2075 15.5483C26.2075 21.8491 22.4645 23.2366 18.9017 23.6426C19.4755 24.1518 19.9869 25.1502 19.9869 26.6806C19.9869 28.8756 19.9683 30.6422 19.9683 31.1826C19.9683 31.6192 20.2563 32.1307 21.0674 31.9696C27.4213 29.798 32 23.6509 32 16.405C32 7.34466 24.8364 0 16.0001 0Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M5.99251 23.3693C5.95737 23.4508 5.83213 23.4752 5.71832 23.4194C5.60224 23.3658 5.53699 23.2547 5.57464 23.1728C5.60915 23.089 5.73438 23.0655 5.8502 23.1219C5.96653 23.1753 6.03279 23.2875 5.99251 23.3693ZM6.77955 24.0893C6.70326 24.1619 6.55405 24.1282 6.45279 24.0135C6.34813 23.8991 6.32856 23.7463 6.40598 23.6726C6.48466 23.6001 6.62935 23.634 6.73425 23.7485C6.83891 23.8641 6.85924 24.0161 6.77943 24.0894M7.31952 25.0105C7.22139 25.0804 7.06102 25.0149 6.96201 24.869C6.864 24.7232 6.864 24.5482 6.96414 24.4781C7.06353 24.408 7.22139 24.471 7.32178 24.6158C7.41965 24.7641 7.41965 24.9391 7.31939 25.0107M8.23255 26.0775C8.14484 26.1766 7.95811 26.1501 7.82133 26.0147C7.68154 25.8825 7.64252 25.6947 7.73048 25.5955C7.8192 25.4962 8.00705 25.5241 8.14484 25.6583C8.28375 25.7903 8.32604 25.9795 8.23255 26.0775ZM9.41262 26.4378C9.3741 26.5662 9.19415 26.6246 9.01295 26.57C8.832 26.5138 8.71354 26.3633 8.75006 26.2335C8.7877 26.1041 8.9684 26.0433 9.15098 26.1017C9.33168 26.1577 9.45027 26.307 9.41262 26.4378ZM10.7558 26.5905C10.7603 26.7258 10.6066 26.838 10.4164 26.8405C10.225 26.8447 10.0703 26.7352 10.0683 26.6022C10.0683 26.4656 10.2185 26.3544 10.4097 26.3512C10.6 26.3473 10.7558 26.456 10.7558 26.5905ZM12.0752 26.5386C12.098 26.6706 11.9658 26.8063 11.7769 26.8423C11.5912 26.877 11.4193 26.7956 11.3955 26.6647C11.3725 26.5294 11.5072 26.3939 11.6926 26.3588C11.8818 26.3251 12.0511 26.4044 12.0752 26.5386Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/></svg>
<div class="dgznh truncate">
<p class="block truncate on128 ejo46 dark:text-neutral-300">
list-of-users
</p>
<small class="block on128 lqxom dark:text-neutral-500">
30kb
</small>
</div>
</div>
</div>
<!-- End Data Snippet -->
</div>
<!-- End Media -->
</div>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
May 04
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<span class="flex n2l26 enhxb items-center hix77 k9mkq yxawv tuuss hysdx dq2gi ejo46 mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400">
B
</span>
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Bob Dean
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Marked
<a class="moa07 inline-flex items-center r2jif j28t5 njs8g h8tqt hw6xt dark:text-blue-400 focus:outline-hidden ch28j dark:hover:text-blue-500 dark:focus:outline-hidden" href="#">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"/></svg>
PR-6
</a>
as
<span class="r8vr5 inline-block moa07 hcvae dgmc7 k9mkq yxawv on128 hw6xt ejo46 clfmf dark:border-neutral-700 dark:text-neutral-300">
Completed
</span>
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
Today
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Crane
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Added 5 card to
<a class="djyey moa07 inline-flex items-center r2jif tuuss j28t5 njs8g h8tqt focus:outline-hidden ch28j hw6xt dark:text-blue-500" href="#">
Payments
</a>
</p>
<!-- Media -->
<div class="nqo4p flex u3ov7">
<div class="dgznh khfgm n38d7 u3ov7">
<img class="xp67g m4ksh nbsdr clfmf" src="https://images.unsplash.com/photo-1635776062360-af423602aff3?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=180&q=80" alt="Media Image">
<img class="xp67g m4ksh nbsdr clfmf" src="https://images.unsplash.com/photo-1635776063328-153b13e3c245?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=180&q=80" alt="Media Image">
<img class="xp67g m4ksh nbsdr clfmf" src="https://images.unsplash.com/photo-1635776064096-4e12cce9ead4?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=180&q=80" alt="Media Image">
</div>
<!-- Card -->
<div>
<a class="ux1hp inline-flex flex-col enhxb items-center k9mkq yxawv on128 hw6xt z0e83 wavyl jbh9m hmpqz focus:outline-hidden rjc3l dark:border-neutral-700 dark:text-neutral-400 dark:hover:text-neutral-300 dark:focus:bg-neutral-700" href="#">
+2
</a>
</div>
<!-- End Card -->
</div>
<!-- End Media -->
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<span class="flex n2l26 enhxb items-center hix77 k9mkq yxawv tuuss hysdx dq2gi ejo46 mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/></svg>
</span>
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Project status updated
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Marked
<a class="moa07 inline-flex items-center r2jif j28t5 njs8g h8tqt hw6xt dark:text-blue-400 focus:outline-hidden ch28j dark:hover:text-blue-500 dark:focus:outline-hidden" href="#">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"/></svg>
PR-3
</a>
as
<span class="r8vr5 inline-block moa07 hcvae dgmc7 gxtht on128 hw6xt ejo46 clfmf dark:bg-neutral-700 dark:text-neutral-300">
In progress
</span>
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
Feb 10
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1610186593977-82a3e3696e7f?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Mark Colbert
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Earned a "Top endorsed" badge
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
Apr 06
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<span class="flex n2l26 enhxb items-center hix77 k9mkq yxawv tuuss hysdx dq2gi ejo46 mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400">
D
</span>
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
David Lidell
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Added a new member to Preline
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
May 15
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1568048689711-5e0325cea8c0?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Lana Robinson
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Added 2 files to task
<a class="djyey moa07 inline-flex items-center r2jif tuuss j28t5 njs8g h8tqt focus:outline-hidden ch28j hw6xt dark:text-blue-500" href="#">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"/></svg>
PR-7
</a>
</p>
<div class="nqo4p">
<!-- Media -->
<div class="khfgm theuu v6f2r">
<!-- Data Snippet -->
<div class="inline-block zxv30 k9mkq yxawv wavyl ur00w dark:bg-neutral-800 dark:border-neutral-700">
<div class="flex u3ov7">
<svg class="n2l26 rekd6" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.0324 1.91994H9.45071C9.09999 1.91994 8.76367 2.05926 8.51567 2.30725C8.26767 2.55523 8.12839 2.89158 8.12839 3.24228V8.86395L20.0324 15.8079L25.9844 18.3197L31.9364 15.8079V8.86395L20.0324 1.91994Z" fill="#21A366"/><path d="M8.12839 8.86395H20.0324V15.8079H8.12839V8.86395Z" fill="#107C41"/><path d="M30.614 1.91994H20.0324V8.86395H31.9364V3.24228C31.9364 2.89158 31.7971 2.55523 31.5491 2.30725C31.3011 2.05926 30.9647 1.91994 30.614 1.91994Z" fill="#33C481"/><path d="M20.0324 15.8079H8.12839V28.3736C8.12839 28.7243 8.26767 29.0607 8.51567 29.3087C8.76367 29.5567 9.09999 29.6959 9.45071 29.6959H30.6141C30.9647 29.6959 31.3011 29.5567 31.549 29.3087C31.797 29.0607 31.9364 28.7243 31.9364 28.3736V22.7519L20.0324 15.8079Z" fill="#185C37"/><path d="M20.0324 15.8079H31.9364V22.7519H20.0324V15.8079Z" fill="#107C41"/><path opacity="0.1" d="M16.7261 6.87994H8.12839V25.7279H16.7261C17.0764 25.7269 17.4121 25.5872 17.6599 25.3395C17.9077 25.0917 18.0473 24.756 18.0484 24.4056V8.20226C18.0473 7.8519 17.9077 7.51616 17.6599 7.2684C17.4121 7.02064 17.0764 6.88099 16.7261 6.87994Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M15.7341 7.87194H8.12839V26.7199H15.7341C16.0844 26.7189 16.4201 26.5792 16.6679 26.3315C16.9157 26.0837 17.0553 25.748 17.0564 25.3976V9.19426C17.0553 8.84386 16.9157 8.50818 16.6679 8.26042C16.4201 8.01266 16.0844 7.87299 15.7341 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M15.7341 7.87194H8.12839V24.7359H15.7341C16.0844 24.7349 16.4201 24.5952 16.6679 24.3475C16.9157 24.0997 17.0553 23.764 17.0564 23.4136V9.19426C17.0553 8.84386 16.9157 8.50818 16.6679 8.26042C16.4201 8.01266 16.0844 7.87299 15.7341 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M14.7421 7.87194H8.12839V24.7359H14.7421C15.0924 24.7349 15.4281 24.5952 15.6759 24.3475C15.9237 24.0997 16.0633 23.764 16.0644 23.4136V9.19426C16.0633 8.84386 15.9237 8.50818 15.6759 8.26042C15.4281 8.01266 15.0924 7.87299 14.7421 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M1.51472 7.87194H14.7421C15.0927 7.87194 15.4291 8.01122 15.6771 8.25922C15.925 8.50722 16.0644 8.84354 16.0644 9.19426V22.4216C16.0644 22.7723 15.925 23.1087 15.6771 23.3567C15.4291 23.6047 15.0927 23.7439 14.7421 23.7439H1.51472C1.16402 23.7439 0.827672 23.6047 0.579686 23.3567C0.3317 23.1087 0.192383 22.7723 0.192383 22.4216V9.19426C0.192383 8.84354 0.3317 8.50722 0.579686 8.25922C0.827672 8.01122 1.16402 7.87194 1.51472 7.87194Z" fill="#107C41"/><path d="M3.69711 20.7679L6.90722 15.794L3.96694 10.8479H6.33286L7.93791 14.0095C8.08536 14.3091 8.18688 14.5326 8.24248 14.68H8.26328C8.36912 14.4407 8.47984 14.2079 8.5956 13.9817L10.3108 10.8479H12.4822L9.46656 15.7663L12.5586 20.7679H10.2473L8.3932 17.2959C8.30592 17.148 8.23184 16.9927 8.172 16.8317H8.14424C8.09016 16.9891 8.01824 17.1399 7.92998 17.2811L6.02236 20.7679H3.69711Z" fill="white"/></svg>
<div class="dgznh truncate">
<p class="block truncate on128 ejo46 dark:text-neutral-300">
weekly-reports.xls
</p>
<small class="block on128 lqxom dark:text-neutral-500">
4kb
</small>
</div>
</div>
</div>
<!-- End Data Snippet -->
<!-- Data Snippet -->
<div class="inline-block zxv30 k9mkq yxawv wavyl ur00w dark:bg-neutral-800 dark:border-neutral-700">
<div class="flex u3ov7">
<svg class="n2l26 rekd6" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M30.6141 1.91994H9.45071C9.09999 1.91994 8.76367 2.05926 8.51567 2.30725C8.26767 2.55523 8.12839 2.89158 8.12839 3.24228V8.86395L20.0324 12.3359L31.9364 8.86395V3.24228C31.9364 2.89158 31.797 2.55523 31.549 2.30725C31.3011 2.05926 30.9647 1.91994 30.6141 1.91994Z" fill="#41A5EE"/><path d="M31.9364 8.86395H8.12839V15.8079L20.0324 19.2799L31.9364 15.8079V8.86395Z" fill="#2B7CD3"/><path d="M31.9364 15.8079H8.12839V22.7519L20.0324 26.2239L31.9364 22.7519V15.8079Z" fill="#185ABD"/><path d="M31.9364 22.752H8.12839V28.3736C8.12839 28.7244 8.26767 29.0607 8.51567 29.3087C8.76367 29.5567 9.09999 29.696 9.45071 29.696H30.6141C30.9647 29.696 31.3011 29.5567 31.549 29.3087C31.797 29.0607 31.9364 28.7244 31.9364 28.3736V22.752Z" fill="#103F91"/><path opacity="0.1" d="M16.7261 6.87994H8.12839V25.7279H16.7261C17.0764 25.7269 17.4121 25.5872 17.6599 25.3395C17.9077 25.0917 18.0473 24.756 18.0484 24.4056V8.20226C18.0473 7.8519 17.9077 7.51616 17.6599 7.2684C17.4121 7.02064 17.0764 6.88099 16.7261 6.87994Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M15.7341 7.87194H8.12839V26.7199H15.7341C16.0844 26.7189 16.4201 26.5792 16.6679 26.3315C16.9157 26.0837 17.0553 25.748 17.0564 25.3976V9.19426C17.0553 8.84386 16.9157 8.50818 16.6679 8.26042C16.4201 8.01266 16.0844 7.87299 15.7341 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M15.7341 7.87194H8.12839V24.7359H15.7341C16.0844 24.7349 16.4201 24.5952 16.6679 24.3475C16.9157 24.0997 17.0553 23.764 17.0564 23.4136V9.19426C17.0553 8.84386 16.9157 8.50818 16.6679 8.26042C16.4201 8.01266 16.0844 7.87299 15.7341 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path opacity="0.2" d="M14.7421 7.87194H8.12839V24.7359H14.7421C15.0924 24.7349 15.4281 24.5952 15.6759 24.3475C15.9237 24.0997 16.0633 23.764 16.0644 23.4136V9.19426C16.0633 8.84386 15.9237 8.50818 15.6759 8.26042C15.4281 8.01266 15.0924 7.87299 14.7421 7.87194Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M1.51472 7.87194H14.7421C15.0927 7.87194 15.4291 8.01122 15.6771 8.25922C15.925 8.50722 16.0644 8.84354 16.0644 9.19426V22.4216C16.0644 22.7723 15.925 23.1087 15.6771 23.3567C15.4291 23.6047 15.0927 23.7439 14.7421 23.7439H1.51472C1.16401 23.7439 0.827669 23.6047 0.579687 23.3567C0.3317 23.1087 0.192383 22.7723 0.192383 22.4216V9.19426C0.192383 8.84354 0.3317 8.50722 0.579687 8.25922C0.827669 8.01122 1.16401 7.87194 1.51472 7.87194Z" fill="#185ABD"/><path d="M12.0468 20.7679H10.2612L8.17801 13.9231L5.99558 20.7679H4.20998L2.22598 10.8479H4.01158L5.40038 17.7919L7.48358 11.0463H8.97161L10.9556 17.7919L12.3444 10.8479H14.0308L12.0468 20.7679Z" fill="white"/></svg>
<div class="dgznh truncate">
<p class="block truncate on128 ejo46 dark:text-neutral-300">
monthly-reports.xls
</p>
<small class="block on128 lqxom dark:text-neutral-500">
12kb
</small>
</div>
</div>
</div>
<!-- End Data Snippet -->
</div>
<!-- End Media -->
</div>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
Now
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<div id="hs-pro-dnao-button" class="hs-collapse hidden xp67g overflow-hidden transition-[height] ixagr" aria-labelledby="hs-pro-dnao">
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<span class="flex n2l26 enhxb items-center hix77 k9mkq yxawv tuuss hysdx dq2gi ejo46 mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400">
D
</span>
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
David Lidell
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Added a new member to Preline
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
May 15
</p>
</div>
</div>
</div>
<!-- End Step Item -->
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<div class="xp67g flex pc3xl">
<span class="flex n2l26 enhxb items-center hix77 k9mkq yxawv tuuss hysdx dq2gi ejo46 mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/></svg>
</span>
<div class="dgznh">
<h4 class="tuuss hysdx ejo46 dark:text-neutral-300">
Project status updated
</h4>
<p class="tuuss z0e83 dark:text-neutral-500">
Marked
<a class="moa07 inline-flex items-center r2jif tuuss j28t5 njs8g h8tqt focus:outline-hidden ch28j hw6xt dark:text-blue-500" href="#">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"/></svg>
PR-4
</a>
as
<span class="r8vr5 inline-block moa07 hcvae dgmc7 gxtht on128 hw6xt ejo46 clfmf dark:bg-neutral-700 dark:text-neutral-300">
In progress
</span>
</p>
<p class="nqo4p lndac dq2gi lqxom dark:text-neutral-500">
Feb 10
</p>
</div>
</div>
</div>
<!-- End Step Item -->
</div>
<!-- Step Item -->
<div class="relative uixns nsv9d last:after:hidden after:absolute after:top-9.5 after:bottom-0 after:start-[19px] after:w-px after:bg-gray-200 dark:after:bg-neutral-700">
<button type="button" class="hs-collapse-toggle hs-collapse-open:hidden group xp67g m8hmi flex items-center pc3xl focus:outline-hidden" id="hs-pro-dnao" aria-expanded="false" aria-controls="hs-pro-dnao-button" data-hs-collapse="#hs-pro-dnao-button">
<span class="hpj7r">
<span class="flex n2l26 enhxb items-center j9fmo uex7i k9mkq yxawv tuuss hysdx ejo46 clfmf mx-auto dark:border-neutral-700 dark:text-neutral-400">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</span>
</span>
<span class="dgznh">
<span class="tuuss hysdx ejo46 group-focus:text-blue-600 dark:text-neutral-300 dark:group-focus:text-blue-500">
Show 2 more activities
</span>
</span>
</button>
</div>
<!-- End Step Item -->
</div>
<!-- End Vertical Steps -->
</div>
<!-- End Body -->
</div>
<!-- End Activity Offcanvas -->
<!-- Tasks Offcanvas -->
<div id="hs-pro-dfo" class="hs-overlay [--body-scroll:true] 2xl:[--overlay-backdrop:false] [--is-layout-affect:true] [--auto-close:2xl] hs-overlay-open:translate-x-0
nnchn nf9l7 ixagr pve7h
kquz2 l3oai 2xl:h-[calc(100%-59px)]
hidden
fixed zxmp1 2xl:top-15 aoum9 y3ubr 2xl:z-49 2xl:-mt-px
flex-1 flex flex-col
zxv30 ezp48 yxawv
2xl:translate-x-full
dark:bg-neutral-800 dark:border-neutral-700" role="dialog" tabindex="-1" aria-labelledby="hs-pro-dfo-label">
<!-- Header -->
<div class="hxfjh gjk1t flex saet7 items-center xu4xz yxawv dark:border-neutral-700">
<h3 id="hs-pro-dfo-label" class="hysdx tuuss ejo46 dark:text-neutral-200">
File info
</h3>
<!-- Button Group -->
<div class="flex items-center u3ov7">
<button type="button" class="x8hlq inline-flex enhxb items-center u3ov7 mr9qs k9mkq je4jy gxtht ejo46 p12pm focus:outline-hidden d10id disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-dfo">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- End Button Group -->
</div>
<!-- End Header -->
<!-- Button Group -->
<div class="hxfjh gjk1t xu4xz yxawv dark:border-neutral-700">
<div class="-ms-1 flex items-center n03hs">
<button type="button" class="flex u3ov7 f9d5d u4s9n wavyl j8ti2 d5esf zqruk lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20h9"/><path d="M16.376 3.622a1 1 0 0 1 3.002 3.002L7.368 18.635a2 2 0 0 1-.855.506l-2.872.838a.5.5 0 0 1-.62-.62l.838-2.872a2 2 0 0 1 .506-.854z"/><path d="m15 5 3 3"/></svg>
Edit PDF
</button>
<button type="button" class="flex u3ov7 f9d5d u4s9n wavyl j8ti2 d5esf zqruk lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 17V3"/><path d="m6 11 6 6 6-6"/><path d="M19 21H5"/></svg>
Download
</button>
<button type="button" class="flex u3ov7 f9d5d u4s9n wavyl j8ti2 d5esf zqruk lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"/><polyline points="16 6 12 2 8 6"/><line x1="12" x2="12" y1="2" y2="15"/></svg>
Share
</button>
<!-- More Dropdown -->
<div class="hs-dropdown [--auto-close:inside] [--placement:bottom-right] relative inline-flex ms-auto">
<button id="hs-pro-fomd" type="button" class="x8hlq inline-flex enhxb items-center u3ov7 wavyl k9mkq je4jy ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700 " aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg>
<span class="r8a99">More</span>
</button>
<!-- More Dropdown -->
<div class="hs-dropdown-menu hs-dropdown-open:opacity-100 c22dz transition-[opacity,margin] duration opacity-0 hidden mjppw zxv30 mzy38 x32l5 divide-y divide-gray-200 dark:bg-neutral-900 dark:divide-neutral-700" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-fomd">
<div class="smvag space-y-0.5">
<div class="hs-dropdown [--strategy:static] md:[--strategy:absolute] [--adaptive:none] md:[--trigger:hover] relative">
<button id="hs-pro-fomdsd" type="button" class="hs-dropdown-toggle xp67g flex items-center rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.3 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10l-3.1-3.1a2 2 0 0 0-2.814.014L6 21"/><path d="m14 19 3 3v-5.5"/><path d="m17 22 3-3"/><circle cx="9" cy="9" r="2"/></svg>
Save as
<svg class="n2l26 bnmi1 ms-auto" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration-[0.1ms] md:duration-[150ms] hs-dropdown-open:opacity-100 opacity-0 c22dz hidden te8l0 zxmp1 a48v1 dhslu kuh6l ewr4n zxv30 fqr45 yvh28 before:absolute before:-end-5 before:top-0 before:h-full before:w-5 dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-fomdsd">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>
JPG
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>
PNG
</button>
</div>
</div>
</div>
<div class="smvag space-y-0.5">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 4h1a3 3 0 0 1 3 3 3 3 0 0 1 3-3h1"/><path d="M13 20h-1a3 3 0 0 1-3-3 3 3 0 0 1-3 3H5"/><path d="M5 16H4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h1"/><path d="M13 8h7a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-7"/><path d="M9 7v10"/></svg>
Rename
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>
Duplicate
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 14 20 9 15 4"/><path d="M4 20v-7a4 4 0 0 1 4-4h12"/></svg>
Move to
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
Delete
</button>
</div>
<div class="smvag space-y-0.5">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"/></svg>
Star
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg>
Pin to
</button>
</div>
<div class="smvag space-y-0.5">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 22h2a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v3"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/><circle cx="8" cy="16" r="6"/><path d="M9.5 17.5 8 16.25V14"/></svg>
Version history
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2"/></svg>
File activity
</button>
</div>
<div class="smvag space-y-0.5">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><path d="M6 9V3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v6"/><rect x="6" y="14" width="12" height="8" rx="1"/></svg>
Print
</button>
</div>
</div>
<!-- End More Dropdown -->
</div>
<!-- End More Dropdown -->
</div>
</div>
<!-- End Button Group -->
<!-- Body -->
<div class="y3kub vq4y4 ux1hp overflow-y-auto overflow-hidden hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
<div class="gxtht dark:bg-neutral-800">
<img class="kquz2 nbsdr q7zgt" src="https://images.unsplash.com/photo-1531489956451-20957fab52f2?q=80&w=480&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="Analytics Image">
</div>
<div class="x6le5">
<h4 class="hysdx ejo46 dark:text-neutral-200">
For prints and original paintings
</h4>
<ul class="kd00o tuuss truncate z0e83 dark:text-neutral-500">
<li class="relative inline-block ir7bk wrv7n first-of-type:before:hidden before:absolute before:top-1/2 before:-start-2.5 before:-translate-y-1/2 before:size-1 before:bg-gray-400 before:rounded-full dark:before:bg-neutral-600">
<span class="truncate">PDF</span>
</li>
<li class="relative inline-block ir7bk wrv7n first-of-type:before:hidden before:absolute before:top-1/2 before:-start-2.5 before:-translate-y-1/2 before:size-1 before:bg-gray-400 before:rounded-full dark:before:bg-neutral-600">
<span class="truncate">1 MB</span>
</li>
</ul>
<!-- Tags Group -->
<div class="x6le5 flex flex-wrap n03hs">
<span class="hcvae psrjx inline-flex items-center r2jif d5esf clfmf gxtht ejo46 dark:bg-neutral-700 dark:text-neutral-200">
Patterns
</span>
<span class="hcvae psrjx inline-flex items-center r2jif d5esf clfmf gxtht ejo46 dark:bg-neutral-700 dark:text-neutral-200">
Work
</span>
<span class="hcvae psrjx inline-flex items-center r2jif d5esf clfmf gxtht ejo46 dark:bg-neutral-700 dark:text-neutral-200">
Photo
</span>
<span class="hcvae psrjx inline-flex items-center r2jif d5esf clfmf gxtht ejo46 dark:bg-neutral-700 dark:text-neutral-200">
Tool
</span>
</div>
<!-- End Tags Group -->
<div class="x6le5 et07w jhbd9 yxawv dark:border-neutral-700">
<h5 class="madsw hysdx tuuss ejo46 dark:text-neutral-200">
Properties
</h5>
<!-- List -->
<dl class="khfgm theuu u3ov7">
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Modified:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
11/2/2025 09:55
</dd>
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Type:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
Image
</dd>
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Uploaded by:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
James Collins
</dd>
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Date uploaded:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
11/02/2025, 09:55
</dd>
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Pages:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
1
</dd>
<dt class="wyrer tuuss z0e83 dark:text-neutral-500">
Dimensions:
</dt>
<dd class="wyrer tuuss ejo46 dark:text-neutral-200">
612 x 792
</dd>
</dl>
<!-- End List -->
</div>
</div>
</div>
<!-- End Body -->
</div>
<!-- End Tasks Offcanvas -->
<!-- Tasks Offcanvas -->
<div id="hs-pro-eakcmpd" class="hs-overlay [--body-scroll:true] 2xl:[--overlay-backdrop:false] [--is-layout-affect:true] [--auto-close:2xl] bcmpd hs-overlay-open:translate-x-0
nnchn nf9l7 ixagr pve7h
kquz2 l3oai 2xl:h-[calc(100%-59px)]
hidden
fixed zxmp1 2xl:top-15 aoum9 y3ubr 2xl:z-49 2xl:-mt-px
flex-1 flex flex-col
zxv30 ezp48 yxawv
2xl:translate-x-full
dark:bg-neutral-800 dark:border-neutral-700" tabindex="-1" aria-labelledby="hs-pro-eakcmpd-label">
<!-- Header -->
<div class="mi46d gjk1t flex saet7 items-center xu4xz yxawv dark:border-neutral-700">
<h3 id="hs-pro-eakcmpd-label" class="hysdx ejo46 dark:text-neutral-200">
Task details
</h3>
<!-- Button Group -->
<div class="flex items-center u3ov7">
<!-- More Dropdown -->
<div class="hs-dropdown [--auto-close:inside] [--placement:top-right] relative inline-flex">
<button id="hs-pro-tooptmd" type="button" class="x8hlq inline-flex enhxb items-center u3ov7 mr9qs k9mkq je4jy ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700 " aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg>
<span class="r8a99">More</span>
</button>
<!-- More Dropdown -->
<div class="hs-dropdown-menu hs-dropdown-open:opacity-100 c22dz transition-[opacity,margin] duration opacity-0 hidden mjppw zxv30 mzy38 x32l5 dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-tooptmd">
<div class="smvag space-y-0.5">
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
Copy link
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>
Duplicate
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" disabled>
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 14 20 9 15 4"/><path d="M4 20v-7a4 4 0 0 1 4-4h12"/></svg>
Move to
</button>
<button type="button" class="xp67g flex rdqxy f9d5d l1xlu wavyl tuuss ejo46 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800">
<svg class="n2l26 icbx8 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
Delete
</button>
</div>
</div>
<!-- End More Dropdown -->
</div>
<!-- End More Dropdown -->
<button type="button" class="x8hlq inline-flex enhxb items-center u3ov7 mr9qs k9mkq je4jy gxtht ejo46 p12pm focus:outline-hidden d10id disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-eakcmpd">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- End Button Group -->
</div>
<!-- End Header -->
<!-- Body -->
<div class="rht0b sbb0f ux1hp flex-1 flex flex-col overflow-y-auto overflow-hidden hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
<!-- Item -->
<div class="group xp67g">
<div class="relative group-first:mt-0 group-first:pt-0 group-first:before:hidden before:absolute before:top-0 before:inset-x-0 before:w-[calc(100%-8px)] before:h-px before:bg-gray-100 dark:before:bg-neutral-700">
<textarea id="hs-pro-eakcmpdtid" class="f9d5d u4s9n block xp67g je4jy clfmf hw6xt tbt88 jgd2f q432g disabled:opacity-50 disabled:pointer-events-none rjc3l rstw7 xeklp dark:bg-neutral-800 dark:hover:border-neutral-700 dark:text-neutral-200 dark:placeholder:text-neutral-500 dark:focus:bg-neutral-700" rows="1" placeholder="Untitled" data-hs-textarea-auto-height='{"defaultHeight": 38}' autofocus>Request to add ESM support (just need to check out if should be added)</textarea>
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="group xp67g flex v6f2r">
<div class="sq4t6 inu3s wmlos">
<label class="flex items-center rdqxy d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
Assignee
</label>
</div>
<div class="dgznh relative nqo4p zi3gd group-first:mt-0 group-first:pt-0 group-first:before:hidden before:absolute before:top-0 before:inset-x-0 before:w-[calc(100%-8px)] before:h-px before:bg-gray-100 dark:before:bg-neutral-700">
<div class="-ms-1">
<!-- Select -->
<div class="relative xp67g">
<select multiple data-hs-select='{
"placeholder": "Assignee",
"wrapperClasses": "hs-select-active:border-transparent hs-select-active:bg-gray-100 clfmf flex items-center flex-wrap xggui xp67g m8hmi tuuss k9mkq je4jy tbt88 dark:bg-neutral-800 dark:border-transparent dark:text-neutral-400 dark:hover:border-neutral-700 dark:focus:bg-neutral-700 hs-select-active:dark:bg-neutral-700",
"toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>",
"toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex xggui xp67g cursor-pointer zxv30 k9mkq yxawv wavyl m8hmi tuuss rjc3l dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-400",
"dropdownClasses": "nqo4p ih37d xp67g rrqls smvag space-y-0.5 zxv30 wavyl overflow-hidden overflow-y-auto x32l5 dark:bg-neutral-900",
"optionClasses": "hcvae u4s9n xp67g tuuss ejo46 cursor-pointer lk55v wavyl focus:outline-hidden rjc3l dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800",
"mode": "tags",
"tagsClasses": "relative agect t64z2 i9m6h flex items-center flex-wrap xggui xp67g k9mkq yxawv wavyl m8hmi tuuss st4vp isksk dark:bg-neutral-900 dark:text-neutral-400",
"tagsItemTemplate": "<div class=\"flex flex-nowrap items-center relative te8l0 zxv30 k9mkq je4jy clfmf ppkkx tbt88 puxhz dark:bg-neutral-800 dark:hover:border-neutral-700 \"><div class=\"s1u6m qzxza \" data-icon></div><div class=\"j8ti2 d5esf \" data-title></div><div class=\"inline-flex n2l26 enhxb items-center s1u6m djyey mr9qs ejo46 p12pm focus:outline-hidden kebql zsc92 tuuss dark:hover:bg-neutral-700 dark:text-neutral-400 cursor-pointer \" data-remove><svg class=\"n2l26 br82p \" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/></svg></div></div>",
"tagsInputClasses": "hcvae mllma u4s9n dgznh js4j3 tm0mx i350v je4jy clfmf u4wxg focus-visible:outline-hidden dark:text-neutral-400 dark:placeholder:text-neutral-400",
"optionTemplate": "<div class=\"flex items-center \"><div class=\"s1u6m a3b8t \" data-icon></div><div><div class=\"tuuss ejo46 dark:text-neutral-200 \" data-title></div><div class=\"on128 z0e83 dark:text-neutral-500 \" data-description></div></div><div class=\"ms-auto \"><span class=\"hidden hs-selected:block \"><svg class=\"n2l26 szmrd \" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\"><path d=\"M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z\"/></svg></span></div></div>"
}' class="hidden">
<option value="">Choose</option>
<option value="1" selected data-hs-select-option='{
"icon": "<img class=\"inline-block mr9qs \" src=\"https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2.5&w=320&h=320&q=80\" alt=\"Avatar\">"
}'>James Collins</option>
<option value="2" data-hs-select-option='{
"icon": "<img class=\"inline-block mr9qs \" src=\"https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80\" alt=\"Avatar\">"
}'>Amanda Harvey</option>
<option value="3" data-hs-select-option='{
"icon": "<span class=\"flex n2l26 enhxb items-center s1u6m gxtht hmow8 y6g4k hw6xt dq2gi mr9qs dark:bg-neutral-700 dark:text-neutral-300 \">L</span>"
}'>Ols Schols</option>
<option value="4" data-hs-select-option='{
"icon": "<span class=\"flex n2l26 enhxb items-center s1u6m gxtht hmow8 y6g4k hw6xt dq2gi mr9qs dark:bg-neutral-700 dark:text-neutral-300 \">B</span>"
}'>Bob Hills</option>
<option value="5" data-hs-select-option='{
"icon": "<img class=\"inline-block mr9qs \" src=\"https://images.unsplash.com/photo-1601935111741-ae98b2b230b0?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80\" alt=\"Avatar\">"
}'>Daniel Hobbs</option>
<option value="6" data-hs-select-option='{
"icon": "<span class=\"flex n2l26 enhxb items-center s1u6m gxtht hmow8 y6g4k hw6xt dq2gi mr9qs dark:bg-neutral-700 dark:text-neutral-300 \">O</span>"
}'>Liza Harrison</option>
<option value="7" data-hs-select-option='{
"icon": "<img class=\"inline-block mr9qs \" src=\"https://images.unsplash.com/photo-1670272505340-d906d8d77d03?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80\" alt=\"Avatar\">"
}'>Anna Richard</option>
</select>
</div>
<!-- End Select -->
</div>
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="group xp67g flex v6f2r">
<div class="sq4t6 inu3s wmlos">
<label class="flex items-center rdqxy d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 20h.01"/><path d="M7 20v-4"/><path d="M12 20v-8"/><path d="M17 20V8"/></svg>
Priority
</label>
</div>
<div class="dgznh relative nqo4p zi3gd group-first:mt-0 group-first:pt-0 group-first:before:hidden before:absolute before:top-0 before:inset-x-0 before:w-[calc(100%-8px)] before:h-px before:bg-gray-100 dark:before:bg-neutral-700">
<!-- Select -->
<div class="relative xp67g">
<select data-hs-select='{
"placeholder": "Priority",
"toggleTag": "<button type=\"button\" aria-expanded=\"false\"><span class=\"ejo46 dark:text-neutral-200 \" data-title></span></button>",
"toggleClasses": "hs-select-active:border-transparent hs-select-active:bg-gray-100 wyrer u4s9n clfmf flex items-center flex-wrap xggui m8hmi tuuss k9mkq je4jy gxtht after:absolute after:-inset-1 after:border after:border-transparent after:rounded-lg hover:after:border-gray-200 focus:outline-hidden dark:bg-neutral-700 dark:border-transparent dark:text-neutral-400 dark:hover:border-neutral-700 dark:focus:bg-neutral-700 hs-select-active:dark:bg-neutral-700 dark:hover:after:border-neutral-700",
"dropdownClasses": "nqo4p ih37d xp67g smvag space-y-0.5 zxv30 mzy38 x32l5 dark:bg-neutral-900",
"optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 hcvae u4s9n xp67g tuuss ejo46 flex dgznh items-center u3ov7 cursor-pointer lk55v wavyl focus:outline-hidden rjc3l dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800",
"optionTemplate": "<div class=\"flex dgznh items-center \"><div class=\"a3b8t \" data-icon></div><div><div class=\"tuuss ejo46 dark:text-neutral-200 \" data-title></div><div class=\"on128 z0e83 dark:text-neutral-500 \" data-description></div></div><div class=\"ms-auto \"><span class=\"hidden hs-selected:block \"><svg class=\"n2l26 szmrd \" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\"><path d=\"M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z\"/></svg></span></div></div>",
"viewport": "#hs-pro-task-details"
}' class="hidden">
<option value="">Choose</option>
<option value="priority1" selected data-hs-select-option='{
}'>High</option>
<option value="priority2" data-hs-select-option='{
}'>Medium</option>
<option value="priority3" data-hs-select-option='{
}'>Low</option>
</select>
</div>
<!-- End Select -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="group xp67g flex v6f2r">
<div class="sq4t6 inu3s wmlos">
<label class="flex items-center rdqxy d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m16 10-4 4-4-4"/></svg>
Status
</label>
</div>
<div class="dgznh relative nqo4p zi3gd group-first:mt-0 group-first:pt-0 group-first:before:hidden before:absolute before:top-0 before:inset-x-0 before:w-[calc(100%-8px)] before:h-px before:bg-gray-100 dark:before:bg-neutral-700">
<!-- Select -->
<div class="relative xp67g">
<select data-hs-select='{
"placeholder": "Status",
"toggleTag": "<button type=\"button\" aria-expanded=\"false\"><span class=\"a3b8t \" data-icon></span><span class=\"ejo46 dark:text-neutral-200 \" data-title></span></button>",
"toggleClasses": "hs-select-active:border-transparent hs-select-active:bg-gray-100 wyrer u4s9n clfmf flex items-center flex-wrap xggui m8hmi tuuss k9mkq je4jy gxtht after:absolute after:-inset-1 after:border after:border-transparent after:rounded-lg hover:after:border-gray-200 focus:outline-hidden dark:bg-neutral-700 dark:border-transparent dark:text-neutral-400 dark:hover:border-neutral-700 dark:focus:bg-neutral-700 hs-select-active:dark:bg-neutral-700 dark:hover:after:border-neutral-700",
"dropdownClasses": "nqo4p ih37d xp67g smvag space-y-0.5 zxv30 mzy38 x32l5 dark:bg-neutral-900",
"optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 hcvae u4s9n xp67g tuuss ejo46 flex dgznh items-center u3ov7 cursor-pointer lk55v wavyl focus:outline-hidden rjc3l dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800",
"optionTemplate": "<div class=\"flex dgznh items-center \"><div class=\"a3b8t \" data-icon></div><div><div class=\"tuuss ejo46 dark:text-neutral-200 \" data-title></div><div class=\"on128 z0e83 dark:text-neutral-500 \" data-description></div></div><div class=\"ms-auto \"><span class=\"hidden hs-selected:block \"><svg class=\"n2l26 szmrd \" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\"><path d=\"M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z\"/></svg></span></div></div>"
}' class="hidden">
<option value="">Choose</option>
<option value="status1" data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs zp075 dark:bg-neutral-500 \"></span>"
}'>No status</option>
<option value="status2" data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs hhqav \"></span>"
}'>To do</option>
<option value="status3" selected data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs b3nns \"></span>"
}'>In progress</option>
<option value="status4" data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs avow8 \"></span>"
}'>Review</option>
<option value="status5" data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs y56jy \"></span>"
}'>Completed 👏</option>
<option value="status6" data-hs-select-option='{
"icon": "<span class=\"block d2i89 j23rn mr9qs zp075 dark:bg-neutral-500 \"></span>"
}'>Product Launch</option>
</select>
</div>
<!-- End Select -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="group xp67g flex v6f2r">
<div class="sq4t6 inu3s wmlos">
<label class="flex items-center rdqxy d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" x2="21" y1="6" y2="6"/><line x1="8" x2="21" y1="12" y2="12"/><line x1="8" x2="21" y1="18" y2="18"/><line x1="3" x2="3.01" y1="6" y2="6"/><line x1="3" x2="3.01" y1="12" y2="12"/><line x1="3" x2="3.01" y1="18" y2="18"/></svg>
Issue type
</label>
</div>
<div class="dgznh relative nqo4p zi3gd group-first:mt-0 group-first:pt-0 group-first:before:hidden before:absolute before:top-0 before:inset-x-0 before:w-[calc(100%-8px)] before:h-px before:bg-gray-100 dark:before:bg-neutral-700">
<div class="-ms-1">
<!-- Select -->
<div class="relative xp67g">
<select multiple data-hs-select='{
"placeholder": "Issue type",
"wrapperClasses": "hs-select-active:border-transparent hs-select-active:bg-gray-100 clfmf flex items-center flex-wrap xggui xp67g m8hmi tuuss k9mkq je4jy tbt88 dark:bg-neutral-800 dark:border-transparent dark:text-neutral-400 dark:hover:border-neutral-700 dark:focus:bg-neutral-700 hs-select-active:dark:bg-neutral-700",
"toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>",
"toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex xggui xp67g cursor-pointer zxv30 k9mkq yxawv wavyl m8hmi tuuss rjc3l dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-400",
"dropdownClasses": "nqo4p ih37d xp67g rrqls smvag space-y-0.5 zxv30 wavyl overflow-hidden overflow-y-auto x32l5 dark:bg-neutral-900",
"optionClasses": "hcvae u4s9n xp67g tuuss ejo46 cursor-pointer lk55v wavyl focus:outline-hidden rjc3l dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800",
"mode": "tags",
"tagsClasses": "relative agect t64z2 i9m6h flex items-center flex-wrap xggui xp67g k9mkq yxawv wavyl m8hmi tuuss st4vp isksk dark:bg-neutral-900 dark:text-neutral-400",
"tagsItemTemplate": "<div class=\"flex flex-nowrap items-center relative te8l0 gxtht clfmf hcvae u4s9n focus:outline-hidden puxhz dark:bg-neutral-700 dark:text-neutral-200 \"><div class=\"s1u6m qzxza \" data-icon></div><div class=\"j8ti2 d5esf \" data-title></div><div class=\"inline-flex n2l26 enhxb items-center s1u6m djyey mr9qs ejo46 p12pm focus:outline-hidden kebql zsc92 tuuss dark:hover:bg-neutral-600 dark:text-neutral-400 cursor-pointer \" data-remove><svg class=\"n2l26 br82p \" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/></svg></div></div>",
"tagsInputClasses": "hcvae mllma u4s9n dgznh js4j3 tm0mx i350v je4jy clfmf u4wxg focus-visible:outline-hidden dark:text-neutral-400 dark:placeholder:text-neutral-400",
"optionTemplate": "<div class=\"flex items-center \"><div class=\"s1u6m a3b8t \" data-icon></div><div><div class=\"tuuss ejo46 dark:text-neutral-200 \" data-title></div><div class=\"on128 z0e83 dark:text-neutral-500 \" data-description></div></div><div class=\"ms-auto \"><span class=\"hidden hs-selected:block \"><svg class=\"n2l26 szmrd \" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\"><path d=\"M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z\"/></svg></span></div></div>"
}' class="hidden">
<option value="">Choose</option>
<option value="issueType1">Bug 🐞</option>
<option value="issueType2">Support 🙏</option>
<option value="issueType3">Feature ⚡️</option>
<option value="issueType4" selected>Docs 📄</option>
<option value="issueType5" selected>Improvement 📈</option>
</select>
</div>
<!-- End Select -->
</div>
</div>
</div>
<!-- End Item -->
<div class="v8kfk owbcq ntuh0 rn5dm jhbd9 yxawv dark:border-neutral-700">
<!-- Timeline -->
<div>
<!-- Heading -->
<div class="madsw">
<h3 class="on128 lqxom dark:text-neutral-500">
June 1
</h3>
</div>
<!-- End Heading -->
<!-- Item -->
<div class="group relative flex tm7wi">
<!-- Icon -->
<div class="relative group-last:after:hidden after:absolute after:top-7 after:bottom-1 after:start-3 after:w-px after:-translate-x-[0.5px] after:bg-gray-200 dark:after:bg-neutral-700">
<div class="relative te8l0 rekd6 flex enhxb items-center">
<img class="n2l26 rekd6 mr9qs" src="https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
</div>
</div>
<!-- End Icon -->
<!-- Right Content -->
<div class="dgznh nsv9d">
<span class="block q302d">
<span class="hysdx tuuss ejo46 dark:text-neutral-200">James Collins</span>
<span class="djyey on128 lqxom dark:text-neutral-500">3:12 PM</span>
</span>
<p class="kd00o tuuss ejo46 dark:text-neutral-200">if you finished the light mode of the Dashboard demo, can you please share some screenshot results?</p>
<div class="eg6px flex flex-wrap v6f2r">
<img class="os8l9 a6ep3 nbsdr k9mkq yxawv clfmf dark:border-neutral-700" src="../../assets/img/demo-previews-dark/img1.webp" alt="Attached Image">
</div>
<div class="md:opacity-0 md:group-hover:opacity-100 absolute -top-1 aoum9">
<!-- Button Group -->
<div class="ukbyd inline-flex items-center txi90 zxv30 k9mkq yxawv ntfdl wavyl dark:bg-neutral-800 dark:border-neutral-700">
<button type="button" class="hcvae u4s9n inline-flex items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Reply
</button>
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>
<span class="r8a99">Edit message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Edit message
</span>
</div>
<!-- End Button -->
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
<span class="r8a99">Delete message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Delete message
</span>
</div>
<!-- End Button -->
</div>
<!-- End Button Group -->
</div>
</div>
<!-- End Right Content -->
</div>
<!-- End Item -->
<!-- Item -->
<div class="group relative flex tm7wi">
<!-- Icon -->
<div class="relative group-last:after:hidden after:absolute after:top-7 after:bottom-1 after:start-3 after:w-px after:-translate-x-[0.5px] after:bg-gray-200 dark:after:bg-neutral-700">
<div class="relative te8l0 rekd6 flex enhxb items-center">
<img class="n2l26 rekd6 mr9qs" src="https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
</div>
</div>
<!-- End Icon -->
<!-- Right Content -->
<div class="dgznh nsv9d">
<span class="block q302d">
<span class="hysdx tuuss ejo46 dark:text-neutral-200">James Collins</span>
<span class="djyey on128 lqxom dark:text-neutral-500">3:12 PM</span>
</span>
<p class="p9cw0 tuuss ejo46 dark:text-neutral-200">btw, the dark looks 🔥</p>
<div class="md:opacity-0 md:group-hover:opacity-100 absolute -top-1 aoum9">
<!-- Button Group -->
<div class="ukbyd inline-flex items-center txi90 zxv30 k9mkq yxawv ntfdl wavyl dark:bg-neutral-800 dark:border-neutral-700">
<button type="button" class="hcvae u4s9n inline-flex items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Reply
</button>
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>
<span class="r8a99">Edit message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Edit message
</span>
</div>
<!-- End Button -->
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
<span class="r8a99">Delete message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Delete message
</span>
</div>
<!-- End Button -->
</div>
<!-- End Button Group -->
</div>
</div>
<!-- End Right Content -->
</div>
<!-- End Item -->
<!-- Heading -->
<div class="madsw">
<h3 class="on128 lqxom dark:text-neutral-500">
June 2
</h3>
</div>
<!-- End Heading -->
<!-- Item -->
<div class="group relative flex tm7wi">
<!-- Icon -->
<div class="relative group-last:after:hidden after:absolute after:top-7 after:bottom-1 after:start-3 after:w-px after:-translate-x-[0.5px] after:bg-gray-200 dark:after:bg-neutral-700">
<div class="relative te8l0 rekd6 flex enhxb items-center">
<img class="-ms-2 n2l26 s1u6m mr9qs" src="https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
<img class="absolute kjxn2 nzp8t n2l26 s1u6m mr9qs h7uoa z5vdk dark:ring-neutral-900" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
</div>
</div>
<!-- End Icon -->
<!-- Right Content -->
<div class="dgznh nsv9d">
<span class="block q302d">
<span class="hysdx tuuss ejo46 dark:text-neutral-200">Amanda Harvey</span>
<span class="djyey on128 lqxom dark:text-neutral-500">9:21 AM</span>
</span>
<div class="ve0ab l1xlu nqo4p relative overflow-hidden before:absolute before:inset-y-0 before:start-0 before:w-[3px] before:h-full before:bg-gray-300 before:rounded-full dark:before:bg-neutral-700">
<p class="hysdx on128 ejo46 dark:text-neutral-200">Replying to James Collins</p>
<div class="kd00o flex lwq0m">
<img class="n2l26 s1u6m rlapk nbsdr" src="../../assets/img/demo-previews-dark/img1.webp" alt="Attached Image">
<div class="dgznh">
<p class="tuuss z0e83 dark:text-neutral-500">if you finished the light mode of the Dashboard demo, can you please share some screenshot results?</p>
</div>
</div>
</div>
<p class="p7mth tuuss ejo46 dark:text-neutral-200">
<span class="z0e83 dark:text-neutral-500">@james</span>
of course, I can. here you go...
</p>
<div class="eg6px flex flex-wrap v6f2r">
<img class="os8l9 a6ep3 nbsdr k9mkq yxawv clfmf dark:border-neutral-700" src="../../assets/img/demo-previews/img1.webp" alt="Attached Image">
<img class="os8l9 a6ep3 nbsdr k9mkq yxawv clfmf dark:border-neutral-700" src="../../assets/img/demo-previews/img2.webp" alt="Attached Image">
<img class="os8l9 a6ep3 nbsdr k9mkq yxawv clfmf dark:border-neutral-700" src="../../assets/img/demo-previews/img3.webp" alt="Attached Image">
</div>
<div class="md:opacity-0 md:group-hover:opacity-100 absolute -top-1 aoum9">
<!-- Button Group -->
<div class="ukbyd inline-flex items-center txi90 zxv30 k9mkq yxawv ntfdl wavyl dark:bg-neutral-800 dark:border-neutral-700">
<button type="button" class="hcvae u4s9n inline-flex items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Reply
</button>
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>
<span class="r8a99">Edit message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Edit message
</span>
</div>
<!-- End Button -->
<!-- Button -->
<div class="hs-tooltip inline-block">
<button type="button" class="hs-tooltip-toggle zy5g6 inline-flex enhxb items-center r2jif on128 hw6xt clfmf k9mkq je4jy zxv30 z0e83 lk55v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-transparent dark:text-neutral-500 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
<span class="r8a99">Delete message</span>
</button>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 inline-block absolute g4xt3 mjppw f9d5d psrjx wi3fc on128 w3h0o wavyl j8ti2 dark:bg-neutral-700" role="tooltip">
Delete message
</span>
</div>
<!-- End Button -->
</div>
<!-- End Button Group -->
</div>
</div>
<!-- End Right Content -->
</div>
<!-- End Item -->
</div>
<!-- End Timeline -->
</div>
</div>
<!-- End Body -->
<!-- Footer -->
<div class="hxfjh gjk1t ny69a jhbd9 yxawv dark:border-neutral-700">
<!-- Comment Input -->
<div class="flex tm7wi">
<div class="n2l26 d0mqq">
<img class="n2l26 rekd6 mr9qs" src="https://images.unsplash.com/photo-1659482633369-9fe69af50bfb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=3&w=320&h=320&q=80" alt="Avatar">
</div>
<div class="dgznh">
<!-- Textarea -->
<div class="relative">
<textarea id="hs-pro-eakcmpdctid" class="uhwhz mi46d lkb7z iv90t block xp67g i350v lyfhl iqf44 io5na wavyl q432g focus:outline-hidden xeklp disabled:opacity-50 disabled:pointer-events-none dark:text-neutral-400 dark:focus:ring-transparent dark:placeholder-neutral-500 overflow-y-auto hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500" placeholder="Message..." rows="1" data-hs-textarea-auto-height='{"defaultHeight": 44}'></textarea>
<!-- Button Group -->
<div class="absolute kjxn2 aoum9 te8l0">
<div class="flex items-center r2jif">
<!-- Button -->
<button type="button" class="flex enhxb items-center rdqxy rekd6 tuuss zqruk lk55v mr9qs disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800 dark:hover:text-neutral-200 dark:focus:text-neutral-200">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg>
<span class="r8a99">Attach file</span>
</button>
<!-- End Button -->
<!-- Button -->
<button type="button" class="flex enhxb items-center rdqxy rekd6 tuuss zqruk lk55v mr9qs disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800 dark:hover:text-neutral-200 dark:focus:text-neutral-200">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11v1a10 10 0 1 1-9-10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" x2="9.01" y1="9" y2="9"/><line x1="15" x2="15.01" y1="9" y2="9"/><path d="M16 5h6"/><path d="M19 2v6"/></svg>
<span class="r8a99">Add emoji</span>
</button>
<!-- End Button -->
<!-- Button -->
<button type="button" class="flex enhxb items-center rdqxy rekd6 tuuss zqruk lk55v mr9qs disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden rjc3l dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800 dark:hover:text-neutral-200 dark:focus:text-neutral-200">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" x2="12" y1="19" y2="22"/></svg>
<span class="r8a99">Send voice message</span>
</button>
<!-- End Button -->
<!-- Send Button -->
<button type="button" class="inline-flex n2l26 enhxb items-center rekd6 tuuss hw6xt mr9qs w3h0o o0y3u nf7dt disabled:opacity-50 disabled:pointer-events-none p2uau focus:outline-hidden kebql isksk">
<span class="r8a99">Send</span>
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m5 12 7-7 7 7"/><path d="M12 19V5"/></svg>
</button>
<!-- End Send Button -->
</div>
<!-- End Button Group -->
</div>
</div>
<!-- End Textarea -->
</div>
</div>
<!-- End Comment Input -->
</div>
<!-- End Footer -->
</div>
<!-- End Tasks Offcanvas -->
<!-- Secondary Sidebar -->
<aside id="hs-pro-chhds4" class="hs-sidebar-details hs-overlay [--body-scroll:true] 2xl:[--overlay-backdrop:false] [--is-layout-affect:true] [--opened:2xl] [--auto-close:2xl] [--auto-close-equality-type:less-than] hs-overlay-open:translate-x-0 2xl:hs-overlay-layout-open:translate-x-0
nnchn nf9l7 ixagr pve7h
xdzn7 xp67g
hidden
fixed hg2lf aoum9 te8l0 zxmp1 ux1hp
zxv30 ezp48 yxawv
2xl:block 2xl:translate-x-full 2xl:bottom-0
dark:bg-neutral-800 dark:border-neutral-700" tabindex="-1" aria-labelledby="hs-pro-chhds4-label">
<div class="ux1hp flex flex-col">
<!-- Header -->
<div class="mi46d gjk1t flex saet7 items-center xu4xz yxawv dark:border-neutral-800">
<span id="hs-pro-chhds4-label" class="block hysdx ejo46 dark:text-neutral-200">
Details
</span>
<!-- Close Button -->
<div class="absolute eawgn qpsld te8l0">
<button type="button" class="x8hlq inline-flex enhxb items-center u3ov7 mr9qs k9mkq je4jy zxv30 ejo46 p12pm focus:outline-hidden d10id disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:text-neutral-400 dark:focus:bg-neutral-700" aria-label="Close" data-hs-overlay="#hs-pro-chhds4">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg>
</button>
</div>
<!-- End Close Button -->
</div>
<!-- End Header -->
<!-- Profile -->
<div class="y3kub flex flex-col enhxb items-center cgjzl xu4xz a56pk dark:border-neutral-800">
<span class="flex n2l26 enhxb items-center smr3m kvuao hw6xt dq2gi b3nns w3h0o mr9qs">
B
</span>
<div class="nqo4p xp67g">
<h2 class="vmtij hysdx ejo46 dark:text-neutral-200">
Technical issues
</h2>
<p class="madsw d5esf z0e83 dark:text-neutral-500">
4 members
</p>
<!-- Button Group -->
<div class="p7mth flex enhxb items-center rdqxy">
<button type="button" class="hxfjh psrjx f2jqf inline-flex enhxb items-center lwq0m hw6xt on128 hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 18a2 2 0 0 0-2-2H9a2 2 0 0 0-2 2"/><rect width="18" height="18" x="3" y="4" rx="2"/><circle cx="12" cy="10" r="2"/><line x1="8" x2="8" y1="2" y2="4"/><line x1="16" x2="16" y1="2" y2="4"/></svg>
View profile
</button>
<button type="button" class="hxfjh psrjx f2jqf inline-flex enhxb items-center lwq0m hw6xt on128 hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg>
Send email
</button>
</div>
<!-- End Button Group -->
</div>
</div>
<!-- End Profile -->
<!-- Body -->
<div class="overflow-y-auto hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
<div class="hs-accordion-group" data-hs-accordion-always-open>
<!-- Members -->
<div class="hs-accordion xu4xz a56pk dark:border-neutral-800 active" id="hs-pro-chdsm1">
<button type="button" class="hs-accordion-toggle y3kub yb79p xp67g flex saet7 items-center rdqxy ejo46 x23zt focus:outline-hidden l3jfy disabled:opacity-50 disabled:pointer-events-none dark:text-neutral-200 dark:hover:text-neutral-400 dark:focus:text-neutral-400" aria-expanded="true" aria-controls="hs-pro-chdsm1-collapse">
<span class="tuuss hw6xt">Members</span>
<svg class="hs-accordion-active:hidden block szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path><path d="M12 5v14"></path></svg>
<svg class="hs-accordion-active:block hidden szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg>
</button>
<div id="hs-pro-chdsm1-collapse" class="hs-accordion-content xp67g overflow-hidden transition-[height] ixagr" role="region" aria-labelledby="hs-pro-chdsm1">
<div class="u4s9n q6ob7 space-y-1">
<a class="block hxfjh l1xlu xp67g flex items-center rdqxy wavyl lk55v focus:outline-hidden rjc3l dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#">
<img class="n2l26 x8hlq mr9qs" src="https://images.unsplash.com/photo-1580489944761-15a19d654956?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=900&h=900&q=80" alt="Avatar">
<div class="dgznh">
<p class="hysdx d5esf ejo46 dark:text-neutral-200">Christina Christy</p>
<p class="on128 z0e83 dark:text-neutral-500">Online</p>
</div>
</a>
<a class="block hxfjh l1xlu xp67g flex items-center rdqxy wavyl lk55v focus:outline-hidden rjc3l dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#">
<img class="n2l26 x8hlq mr9qs" src="https://images.unsplash.com/photo-1579017331263-ef82f0bbc748?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=900&h=900&q=80" alt="Avatar">
<div class="dgznh">
<p class="hysdx d5esf ejo46 dark:text-neutral-200">Louise Donadieu</p>
<p class="on128 z0e83 dark:text-neutral-500">Last seen 5 mins ago</p>
</div>
</a>
<a class="block hxfjh l1xlu xp67g flex items-center rdqxy wavyl lk55v focus:outline-hidden rjc3l dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#">
<span class="flex n2l26 enhxb items-center x8hlq on128 hw6xt dq2gi buldq w3h0o mr9qs">
S
</span>
<div class="dgznh">
<p class="hysdx d5esf ejo46 dark:text-neutral-200">Sun Chai</p>
<p class="on128 z0e83 dark:text-neutral-500">Last seen 3 hours ago</p>
</div>
</a>
<a class="block hxfjh l1xlu xp67g flex items-center rdqxy wavyl lk55v focus:outline-hidden rjc3l dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#">
<img class="n2l26 x8hlq mr9qs" src="https://images.unsplash.com/photo-1624224971170-2f84fed5eb5e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=900&h=900&q=80" alt="Avatar">
<div class="dgznh">
<p class="hysdx d5esf ejo46 dark:text-neutral-200">Tom Lowry</p>
<p class="on128 z0e83 dark:text-neutral-500">Last seen 1 day ago</p>
</div>
</a>
</div>
</div>
</div>
<!-- End Members -->
<!-- User Details -->
<div class="hs-accordion xu4xz a56pk dark:border-neutral-800 active" id="hs-pro-chdsudc4">
<button type="button" class="hs-accordion-toggle y3kub yb79p xp67g flex saet7 items-center rdqxy ejo46 x23zt focus:outline-hidden l3jfy disabled:opacity-50 disabled:pointer-events-none dark:text-neutral-200 dark:hover:text-neutral-400 dark:focus:text-neutral-400" aria-expanded="true" aria-controls="hs-pro-chdsudc4-collapse">
<span class="tuuss hw6xt">User details</span>
<svg class="hs-accordion-active:hidden block szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path><path d="M12 5v14"></path></svg>
<svg class="hs-accordion-active:block hidden szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg>
</button>
<div id="hs-pro-chdsudc4-collapse" class="hs-accordion-content xp67g overflow-hidden transition-[height] ixagr" role="region" aria-labelledby="hs-pro-chdsudc4">
<div class="rht0b q6ob7">
<!-- List Item -->
<dl class="hcvae flex items-center btgx5">
<dt class="xp67g ue6et">
<p class="inline-flex items-center u3ov7 d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 12h.01"/><path d="M16 6V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2"/><path d="M22 13a18.15 18.15 0 0 1-20 0"/><rect width="20" height="14" x="2" y="6" rx="2"/></svg>
Company:
</p>
</dt>
<dd class="dgznh">
<p class="hw6xt d5esf ejo46 dark:text-neutral-200">
Fortex
</p>
</dd>
</dl>
<!-- End List Item -->
<!-- List Item -->
<dl class="hcvae flex items-center btgx5">
<dt class="xp67g ue6et">
<p class="inline-flex items-center u3ov7 d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z"/><circle cx="12" cy="10" r="3"/></svg>
Country:
</p>
</dt>
<dd class="dgznh">
<p class="hw6xt d5esf ejo46 dark:text-neutral-200">
United States
</p>
</dd>
</dl>
<!-- End List Item -->
<!-- List Item -->
<dl class="hcvae flex items-center btgx5">
<dt class="xp67g ue6et">
<p class="inline-flex items-center u3ov7 d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg>
Email:
</p>
</dt>
<dd class="dgznh">
<p class="hw6xt d5esf ejo46 dark:text-neutral-200">
technical-issue@preline.com
</p>
</dd>
</dl>
<!-- End List Item -->
<!-- List Item -->
<dl class="hcvae flex items-center btgx5">
<dt class="xp67g ue6et">
<p class="inline-flex items-center u3ov7 d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
Phone:
</p>
</dt>
<dd class="dgznh">
<p class="hw6xt d5esf ejo46 dark:text-neutral-200">
+1 000-00-00
</p>
</dd>
</dl>
<!-- End List Item -->
<!-- List Item -->
<dl class="hcvae flex items-center btgx5">
<dt class="xp67g ue6et">
<p class="inline-flex items-center u3ov7 d5esf z0e83 dark:text-neutral-500">
<svg class="n2l26 bnmi1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/></svg>
Site:
</p>
</dt>
<dd class="dgznh">
<a class="gucmi tuuss j28t5 njs8g h8tqt hw6xt focus:outline-hidden ch28j dark:text-blue-400 dark:hover:text-blue-500" href="#">
fortex.com
</a>
</dd>
</dl>
<!-- End List Item -->
</div>
</div>
</div>
<!-- End User Details -->
<!-- Shared Media -->
<div class="hs-accordion active" id="hs-pro-chdssmc2">
<button type="button" class="hs-accordion-toggle y3kub yb79p xp67g flex saet7 items-center rdqxy ejo46 x23zt focus:outline-hidden l3jfy disabled:opacity-50 disabled:pointer-events-none dark:text-neutral-200 dark:hover:text-neutral-400 dark:focus:text-neutral-400" aria-expanded="true" aria-controls="hs-pro-chdssmc2-collapse">
<span class="tuuss hw6xt">Shared media</span>
<svg class="hs-accordion-active:hidden block szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path><path d="M12 5v14"></path></svg>
<svg class="hs-accordion-active:block hidden szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg>
</button>
<div id="hs-pro-chdssmc2-collapse" class="hs-accordion-content xp67g overflow-hidden transition-[height] ixagr" role="region" aria-labelledby="hs-pro-chdssmc2">
<div class="rht0b q6ob7">
<div class="khfgm n38d7 ntrly">
<img class="n2l26 zp9oc wavyl nbsdr" src="../../assets/img/mockups/img10.jpg" alt="Media Image">
<img class="n2l26 zp9oc wavyl nbsdr" src="../../assets/img/mockups/img12.jpg" alt="Media Image">
</div>
</div>
</div>
</div>
<!-- End Shared Media -->
</div>
</div>
<!-- End Body -->
</div>
</aside>
<!-- End Secondary Sidebar -->
<!-- Activity Offcanvas -->
<div id="hs-pro-dupsd" class="hs-overlay [--auto-close:xl]
hs-overlay-open:translate-x-0
-translate-x-full nf9l7 ixagr pve7h
mnb0w
hidden
fixed evdk4 a98ho tx2df
zxv30 uob1z yxawv
xl:relative t6dxh xl:block vcbxw xl:end-auto peb5g
overflow-y-auto hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500
dark:bg-neutral-800 dark:border-neutral-700" role="dialog" tabindex="-1" aria-labelledby="hs-pro-dupsd-label">
<div class="y3kub llea0">
<div class="xl:hidden">
<!-- Close Button -->
<div class="absolute kjxn2 f65mc te8l0">
<button type="button" class="x8hlq n2l26 flex enhxb items-center u3ov7 mr9qs k9mkq je4jy gxtht ejo46 p12pm disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden d10id dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-dupsd">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- End Close Button -->
</div>
<!-- Body -->
<div class="b72jg eg6px divide-y divide-gray-200 dark:divide-neutral-700">
<div class="iifk8 b21y4 uixns">
<h2 id="hs-pro-dupsd-label" class="tuuss hysdx ejo46 dark:text-neutral-200">
About
</h2>
<!-- List -->
<ul class="eg6px space-y-2">
<li>
<div class="inline-flex items-center rdqxy tuuss ejo46 dark:text-neutral-200">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z"/><path d="M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2"/><path d="M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2"/><path d="M10 6h4"/><path d="M10 10h4"/><path d="M10 14h4"/><path d="M10 18h4"/></svg>
Guideline
</div>
</li>
<li>
<div class="inline-flex items-center rdqxy tuuss ejo46 dark:text-neutral-200">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z"/><circle cx="12" cy="10" r="3"/></svg>
United Kingdom
</div>
</li>
<li>
<div class="inline-flex items-center rdqxy tuuss ejo46 dark:text-neutral-200">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
Europe/London (GMT)
</div>
</li>
<li>
<div class="inline-flex items-center rdqxy tuuss ejo46 dark:text-neutral-200">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg>
jamescollins@site.so
</div>
</li>
<li>
<a class="inline-flex items-center rdqxy tuuss ejo46 hmpqz njs8g h8tqt focus:outline-hidden ch28j dark:text-neutral-200 dark:hover:text-blue-500" href="#">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
https://example.so/
</a>
</li>
<li>
<a class="inline-flex items-center rdqxy tuuss ejo46 hmpqz njs8g h8tqt focus:outline-hidden ch28j dark:text-neutral-200 dark:hover:text-blue-500" href="#">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
https://dribbble.com/james/
</a>
</li>
<li>
<a class="inline-flex items-center rdqxy tuuss ejo46 hmpqz njs8g h8tqt focus:outline-hidden ch28j dark:text-neutral-200 dark:hover:text-blue-500" href="#">
<svg class="n2l26 szmrd zqruk dark:text-neutral-400" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
https://producthunt.com/james/
</a>
</li>
</ul>
<!-- End List -->
</div>
<div class="iifk8 b21y4 uixns">
<h2 class="tuuss hysdx ejo46 dark:text-neutral-200">
Organizations
</h2>
<!-- Button Group -->
<div class="nqo4p space-y-1">
<!-- Dropdown -->
<div class="hs-dropdown [--trigger:hover] [--placement:top] relative inline-block">
<div id="hs-pro-dupodcd1" class="hs-dropdown-toggle f9d5d u4s9n inline-flex enhxb items-center u3ov7 zxv30 k9mkq yxawv ejo46 tuuss hw6xt cursor-pointer wavyl ntfdl moa07 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown" role="button">
<svg class="n2l26 szmrd" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.0355 1.75926C10.6408 1.75926 5.30597 1.49951 0.0111241 1C-0.288584 7.23394 5.50578 13.1282 12.7987 14.5668L13.9975 14.7266C14.3372 12.4289 15.9956 3.7773 16.595 1.73928C16.4152 1.75926 16.2353 1.75926 16.0355 1.75926Z" fill="#A49DFF"/><path d="M16.615 1.75926C16.615 1.75926 25.2266 7.9932 28.5234 16.3451C30.0419 11.3499 31.1608 6.15498 32 1C26.8051 1.49951 21.71 1.75926 16.615 1.75926Z" fill="#28289A"/><path d="M13.9975 14.7466L13.8177 15.9455C13.8177 15.9455 12.2592 28.4133 23.1886 31.9699C25.2266 26.8748 27.0049 21.6599 28.5234 16.3251C21.9698 15.8456 13.9975 14.7466 13.9975 14.7466Z" fill="#5ADCEE"/><path d="M16.6149 1.75927C16.0155 3.79729 14.3571 12.4089 14.0175 14.7466C14.0175 14.7466 21.9897 15.8456 28.5233 16.3251C25.1866 7.9932 16.6149 1.75927 16.6149 1.75927Z" fill="#7878FF"/></svg>
Guideline
</div>
<div class="hs-dropdown-menu qdi5k duration hs-dropdown-open:opacity-100 opacity-0 hidden te8l0 a14xa zxv30 mzy38 x32l5 dark:bg-neutral-900 dark:text-neutral-400 before:absolute before:bottom-full before:left-0 before:w-full before:h-5" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-dupodcd1">
<!-- Header -->
<div class="jhb8q flex items-center rdqxy xu4xz yxawv dark:border-neutral-700">
<svg class="n2l26 rditj" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.0355 1.75926C10.6408 1.75926 5.30597 1.49951 0.0111241 1C-0.288584 7.23394 5.50578 13.1282 12.7987 14.5668L13.9975 14.7266C14.3372 12.4289 15.9956 3.7773 16.595 1.73928C16.4152 1.75926 16.2353 1.75926 16.0355 1.75926Z" fill="#A49DFF"/><path d="M16.615 1.75926C16.615 1.75926 25.2266 7.9932 28.5234 16.3451C30.0419 11.3499 31.1608 6.15498 32 1C26.8051 1.49951 21.71 1.75926 16.615 1.75926Z" fill="#28289A"/><path d="M13.9975 14.7466L13.8177 15.9455C13.8177 15.9455 12.2592 28.4133 23.1886 31.9699C25.2266 26.8748 27.0049 21.6599 28.5234 16.3251C21.9698 15.8456 13.9975 14.7466 13.9975 14.7466Z" fill="#5ADCEE"/><path d="M16.6149 1.75927C16.0155 3.79729 14.3571 12.4089 14.0175 14.7466C14.0175 14.7466 21.9897 15.8456 28.5233 16.3251C25.1866 7.9932 16.6149 1.75927 16.6149 1.75927Z" fill="#7878FF"/></svg>
<div class="dgznh">
<h4 class="tuuss hw6xt ejo46 dark:text-neutral-200">
Guideline
</h4>
<p class="on128 z0e83 dark:text-neutral-500">
@guideline
</p>
</div>
<button type="button" class="ur00w inline-flex items-center on128 hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Following
</button>
</div>
<!-- End Header -->
<!-- Body -->
<div class="jhb8q flex items-center pc3xl zqruk dark:text-neutral-400">
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="14" x="2" y="7" rx="2" ry="2"/><path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"/></svg>
<span class="tuuss hw6xt">
4
<span class="r8mh0">
projects
</span>
</span>
</div>
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
<span class="tuuss hw6xt">
9
<span class="r8mh0">
members
</span>
</span>
</div>
</div>
<!-- End Body -->
</div>
</div>
<!-- End Dropdown -->
<!-- Dropdown -->
<div class="hs-dropdown [--trigger:hover] [--placement:top] relative inline-block">
<div id="hs-pro-dupodcd2" class="hs-dropdown-toggle f9d5d u4s9n inline-flex enhxb items-center u3ov7 zxv30 k9mkq yxawv ejo46 tuuss hw6xt cursor-pointer wavyl ntfdl moa07 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown" role="button">
<svg class="n2l26 szmrd" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 16C13.8 16 12 14.2 12 12C12 9.8 13.78 8 16 8C18.2 8 20 9.78 20 12C20 14.22 18.22 16 16 16ZM16 0C9.38 0 4 5.38 4 12C4 18.64 9.38 24 16 24C22.62 24 28 18.64 28 12.02C28 12.02 28 12.02 28 12C28 5.38 22.64 0 16 0Z" fill="#5C54FF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 24C5.8 24 4 25.78 4 28C4 30.2 5.78 32 8 32C10.2 32 12 30.22 12 28C12 25.78 10.22 24 8 24Z" fill="#5C54FF"/></svg>
Prosperops
</div>
<div class="hs-dropdown-menu qdi5k duration hs-dropdown-open:opacity-100 opacity-0 hidden te8l0 a14xa zxv30 mzy38 x32l5 dark:bg-neutral-900 dark:text-neutral-400 before:absolute before:bottom-full before:left-0 before:w-full before:h-5" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-dupodcd2">
<!-- Header -->
<div class="jhb8q flex items-center rdqxy xu4xz yxawv dark:border-neutral-700">
<svg class="n2l26 rditj" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 16C13.8 16 12 14.2 12 12C12 9.8 13.78 8 16 8C18.2 8 20 9.78 20 12C20 14.22 18.22 16 16 16ZM16 0C9.38 0 4 5.38 4 12C4 18.64 9.38 24 16 24C22.62 24 28 18.64 28 12.02C28 12.02 28 12.02 28 12C28 5.38 22.64 0 16 0Z" fill="#5C54FF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 24C5.8 24 4 25.78 4 28C4 30.2 5.78 32 8 32C10.2 32 12 30.22 12 28C12 25.78 10.22 24 8 24Z" fill="#5C54FF"/></svg>
<div class="dgznh">
<h4 class="tuuss hw6xt ejo46 dark:text-neutral-200">
Prosperops
</h4>
<p class="on128 z0e83 dark:text-neutral-500">
@prosperops
</p>
</div>
<button type="button" class="ur00w inline-flex items-center on128 hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Following
</button>
</div>
<!-- End Header -->
<!-- Body -->
<div class="jhb8q flex items-center pc3xl zqruk dark:text-neutral-400">
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="14" x="2" y="7" rx="2" ry="2"/><path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"/></svg>
<span class="tuuss hw6xt">
2
<span class="r8mh0">
projects
</span>
</span>
</div>
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
<span class="tuuss hw6xt">
4
<span class="r8mh0">
members
</span>
</span>
</div>
</div>
<!-- End Body -->
</div>
</div>
<!-- End Dropdown -->
<!-- Dropdown -->
<div class="hs-dropdown [--trigger:hover] [--placement:top] relative inline-block">
<div id="hs-pro-dupodcd3" class="hs-dropdown-toggle f9d5d u4s9n inline-flex enhxb items-center u3ov7 zxv30 k9mkq yxawv ejo46 tuuss hw6xt cursor-pointer wavyl ntfdl moa07 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown" role="button">
<svg class="n2l26 szmrd" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.7438 0.940745C6.84695 1.30308 2.6841 1.63631 2.48837 1.67533C1.9396 1.77319 1.44038 2.14544 1.20563 2.63537L1 3.06646L1.01982 13.3407L1.04893 23.615L1.36234 24.2517C1.53886 24.6042 2.73365 26.2499 4.0362 27.9439C6.61221 31.2836 6.79802 31.47 7.77726 31.5679C8.06156 31.597 10.1966 31.4991 12.5081 31.3622C14.8295 31.2154 18.5508 30.99 20.7842 30.863C30.3233 30.2839 29.8334 30.3328 30.3815 29.8627C31.0672 29.2947 31.0183 30.2251 31.0474 17.7377C31.0672 7.15003 31.0573 6.45509 30.9006 6.13177C30.7148 5.76943 30.3815 5.51487 26.0329 2.45885C23.1243 0.421704 22.9186 0.313932 21.6155 0.294111C21.0772 0.274911 16.6307 0.568497 11.7438 0.940745ZM22.752 2.28232C23.1633 2.46814 26.1704 4.56412 26.6108 4.9661C26.7284 5.08378 26.7675 5.18164 26.7086 5.24048C26.5717 5.35817 7.96245 6.465 7.42421 6.38634C7.17956 6.34732 6.81722 6.20052 6.61159 6.06302C5.75932 5.48514 3.64413 3.75149 3.64413 3.62452C3.64413 3.29129 3.57538 3.29129 11.8714 2.69421C13.4582 2.58644 16.0633 2.39071 17.6502 2.26312C21.0871 1.98874 22.1159 1.99865 22.752 2.28232ZM28.6677 7.63996C28.8046 7.77685 28.9223 8.04132 28.9613 8.29589C28.9904 8.53125 29.0102 12.9189 28.9904 18.0313C28.9613 26.8067 28.9514 27.3555 28.7848 27.61C28.6869 27.7667 28.4912 27.9333 28.3438 27.9823C27.9331 28.1489 8.43318 29.2557 8.03183 29.138C7.84601 29.0891 7.59083 28.9324 7.45394 28.7955L7.21858 28.541L7.18947 19.0799C7.16965 12.4395 7.18947 9.5012 7.26813 9.23672C7.32697 9.041 7.47376 8.80564 7.60136 8.72759C7.77788 8.60991 8.93364 8.51205 12.9101 8.2773C15.7016 8.1206 20.0206 7.85613 22.4987 7.70933C28.3933 7.34638 28.3741 7.34638 28.6677 7.63996Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M23.4277 10.8818C22.3698 10.9506 21.4296 11.0484 21.3218 11.1073C20.9985 11.2739 20.8028 11.5483 20.7638 11.8617C20.7347 12.185 20.8325 12.224 21.8898 12.3516L22.35 12.4104V16.5925C22.35 19.0799 22.311 20.7256 22.2621 20.6767C22.2131 20.6178 20.8226 18.5027 19.167 15.9756C17.512 13.4392 16.1407 11.3525 16.1209 11.3333C16.1011 11.3135 15.024 11.3724 13.7313 11.4609C12.1445 11.5687 11.273 11.6666 11.0965 11.7644C10.8122 11.9112 10.4988 12.4303 10.4988 12.7734C10.4988 12.979 10.871 13.0868 11.6545 13.0868H12.0658V25.1139L11.4 25.3196C10.8809 25.4763 10.7044 25.5741 10.6165 25.7698C10.4598 26.1031 10.4697 26.4066 10.6264 26.4066C10.6852 26.4066 11.792 26.3378 13.0649 26.2598C15.582 26.113 15.8657 26.0442 16.1302 25.5252C16.2088 25.3685 16.277 25.2019 16.277 25.1529C16.277 25.1139 15.9345 24.9962 15.5226 24.8984C15.1014 24.8005 14.6802 24.7027 14.5923 24.6828C14.4257 24.6339 14.4157 24.3304 14.4157 20.1186V15.6033L17.3931 20.2753C20.5173 25.1721 20.9093 25.7308 21.3893 25.9755C21.987 26.2889 23.5051 26.0733 24.2688 25.5741L24.5042 25.4273L24.524 18.7479L24.5531 12.0586L25.0722 11.9608C25.6891 11.8431 25.9734 11.5594 25.9734 11.0695C25.9734 10.7561 25.9536 10.7362 25.66 10.7462C25.4847 10.7542 24.4757 10.813 23.4277 10.8818Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/></svg>
Notion
</div>
<div class="hs-dropdown-menu qdi5k duration hs-dropdown-open:opacity-100 opacity-0 hidden te8l0 a14xa zxv30 mzy38 x32l5 dark:bg-neutral-900 dark:text-neutral-400 before:absolute before:bottom-full before:left-0 before:w-full before:h-5" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-dupodcd3">
<!-- Header -->
<div class="jhb8q flex items-center rdqxy xu4xz yxawv dark:border-neutral-700">
<svg class="n2l26 rditj" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.7438 0.940745C6.84695 1.30308 2.6841 1.63631 2.48837 1.67533C1.9396 1.77319 1.44038 2.14544 1.20563 2.63537L1 3.06646L1.01982 13.3407L1.04893 23.615L1.36234 24.2517C1.53886 24.6042 2.73365 26.2499 4.0362 27.9439C6.61221 31.2836 6.79802 31.47 7.77726 31.5679C8.06156 31.597 10.1966 31.4991 12.5081 31.3622C14.8295 31.2154 18.5508 30.99 20.7842 30.863C30.3233 30.2839 29.8334 30.3328 30.3815 29.8627C31.0672 29.2947 31.0183 30.2251 31.0474 17.7377C31.0672 7.15003 31.0573 6.45509 30.9006 6.13177C30.7148 5.76943 30.3815 5.51487 26.0329 2.45885C23.1243 0.421704 22.9186 0.313932 21.6155 0.294111C21.0772 0.274911 16.6307 0.568497 11.7438 0.940745ZM22.752 2.28232C23.1633 2.46814 26.1704 4.56412 26.6108 4.9661C26.7284 5.08378 26.7675 5.18164 26.7086 5.24048C26.5717 5.35817 7.96245 6.465 7.42421 6.38634C7.17956 6.34732 6.81722 6.20052 6.61159 6.06302C5.75932 5.48514 3.64413 3.75149 3.64413 3.62452C3.64413 3.29129 3.57538 3.29129 11.8714 2.69421C13.4582 2.58644 16.0633 2.39071 17.6502 2.26312C21.0871 1.98874 22.1159 1.99865 22.752 2.28232ZM28.6677 7.63996C28.8046 7.77685 28.9223 8.04132 28.9613 8.29589C28.9904 8.53125 29.0102 12.9189 28.9904 18.0313C28.9613 26.8067 28.9514 27.3555 28.7848 27.61C28.6869 27.7667 28.4912 27.9333 28.3438 27.9823C27.9331 28.1489 8.43318 29.2557 8.03183 29.138C7.84601 29.0891 7.59083 28.9324 7.45394 28.7955L7.21858 28.541L7.18947 19.0799C7.16965 12.4395 7.18947 9.5012 7.26813 9.23672C7.32697 9.041 7.47376 8.80564 7.60136 8.72759C7.77788 8.60991 8.93364 8.51205 12.9101 8.2773C15.7016 8.1206 20.0206 7.85613 22.4987 7.70933C28.3933 7.34638 28.3741 7.34638 28.6677 7.63996Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/><path d="M23.4277 10.8818C22.3698 10.9506 21.4296 11.0484 21.3218 11.1073C20.9985 11.2739 20.8028 11.5483 20.7638 11.8617C20.7347 12.185 20.8325 12.224 21.8898 12.3516L22.35 12.4104V16.5925C22.35 19.0799 22.311 20.7256 22.2621 20.6767C22.2131 20.6178 20.8226 18.5027 19.167 15.9756C17.512 13.4392 16.1407 11.3525 16.1209 11.3333C16.1011 11.3135 15.024 11.3724 13.7313 11.4609C12.1445 11.5687 11.273 11.6666 11.0965 11.7644C10.8122 11.9112 10.4988 12.4303 10.4988 12.7734C10.4988 12.979 10.871 13.0868 11.6545 13.0868H12.0658V25.1139L11.4 25.3196C10.8809 25.4763 10.7044 25.5741 10.6165 25.7698C10.4598 26.1031 10.4697 26.4066 10.6264 26.4066C10.6852 26.4066 11.792 26.3378 13.0649 26.2598C15.582 26.113 15.8657 26.0442 16.1302 25.5252C16.2088 25.3685 16.277 25.2019 16.277 25.1529C16.277 25.1139 15.9345 24.9962 15.5226 24.8984C15.1014 24.8005 14.6802 24.7027 14.5923 24.6828C14.4257 24.6339 14.4157 24.3304 14.4157 20.1186V15.6033L17.3931 20.2753C20.5173 25.1721 20.9093 25.7308 21.3893 25.9755C21.987 26.2889 23.5051 26.0733 24.2688 25.5741L24.5042 25.4273L24.524 18.7479L24.5531 12.0586L25.0722 11.9608C25.6891 11.8431 25.9734 11.5594 25.9734 11.0695C25.9734 10.7561 25.9536 10.7362 25.66 10.7462C25.4847 10.7542 24.4757 10.813 23.4277 10.8818Z" class="p0t9n dark:fill-neutral-200" fill="currentColor"/></svg>
<div class="dgznh">
<h4 class="tuuss hw6xt ejo46 dark:text-neutral-200">
Notion
</h4>
<p class="on128 z0e83 dark:text-neutral-500">
@notion
</p>
</div>
<button type="button" class="ur00w inline-flex items-center on128 hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
Following
</button>
</div>
<!-- End Header -->
<!-- Body -->
<div class="jhb8q flex items-center pc3xl zqruk dark:text-neutral-400">
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="14" x="2" y="7" rx="2" ry="2"/><path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"/></svg>
<span class="tuuss hw6xt">
38
<span class="r8mh0">
projects
</span>
</span>
</div>
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
<span class="tuuss hw6xt">
30
<span class="r8mh0">
members
</span>
</span>
</div>
</div>
<!-- End Body -->
</div>
</div>
<!-- End Dropdown -->
</div>
<!-- Button Group -->
</div>
<div class="iifk8 b21y4 uixns">
<h2 class="mbvb4 tuuss hysdx ejo46 dark:text-neutral-200">
Connections
</h2>
<!-- List Group -->
<ul class="space-y-3">
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<span class="flex n2l26 enhxb items-center hix77 zxv30 k9mkq yxawv hmow8 on128 hw6xt dq2gi mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
Rd
</span>
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Rachel Doe
</a>
<p class="on128 z0e83 dark:text-neutral-500">
rach
</p>
</div>
<label for="hs-pro-dupcu1" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu1" class="peer hidden">
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1670272505340-d906d8d77d03?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2.5&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Anna Richard
</a>
<p class="on128 z0e83 dark:text-neutral-500">
annarich
</p>
</div>
<label for="hs-pro-dupcu2" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu2" class="peer hidden">
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<span class="flex n2l26 enhxb items-center hix77 zxv30 k9mkq yxawv hmow8 on128 hw6xt dq2gi mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
Bd
</span>
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Bob Dean
</a>
<p class="on128 z0e83 dark:text-neutral-500">
bob_data_viewer
</p>
</div>
<label for="hs-pro-dupcu3" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu3" class="peer hidden" checked>
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1601935111741-ae98b2b230b0?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2.5&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Alex Gustuf
</a>
<p class="on128 z0e83 dark:text-neutral-500">
alex
</p>
</div>
<label for="hs-pro-dupcu4" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu4" class="peer hidden" checked>
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<img class="n2l26 hix77 mr9qs" src="https://images.unsplash.com/photo-1659482634023-2c4fda99ac0c?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2.5&w=320&h=320&q=80" alt="Avatar">
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Ella Lauda
</a>
<p class="on128 z0e83 dark:text-neutral-500">
ellala
</p>
</div>
<label for="hs-pro-dupcu5" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu5" class="peer hidden">
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<div class="flex items-center rdqxy">
<span class="flex n2l26 enhxb items-center hix77 zxv30 k9mkq yxawv hmow8 on128 hw6xt dq2gi mr9qs dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
Fh
</span>
<div class="dgznh">
<a class="block tuuss hw6xt ejo46 hmpqz focus:outline-hidden rdx35 dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500" href="../../pro/dashboard/user-profile.html">
Finch Hoot
</a>
<p class="on128 z0e83 dark:text-neutral-500">
fhoot
</p>
</div>
<label for="hs-pro-dupcu6" class="relative f9d5d u4s9n flex items-center enhxb q0xfd k9mkq yxawv cursor-pointer hw6xt on128 wavyl y16xq d9iuh kwurh dark:border-neutral-700 dark:hover:border-neutral-600 dark:focus:border-neutral-600">
<input type="checkbox" id="hs-pro-dupcu6" class="peer hidden" checked>
<span class="relative te8l0 ejo46 dark:text-neutral-200 peer-checked:hidden">
Connect
</span>
<span class="relative te8l0 hidden peer-checked:flex ejo46 dark:text-neutral-200">
Unconnect
</span>
</label>
</div>
</li>
<!-- End List Item -->
</ul>
<!-- End List Group -->
</div>
<div class="iifk8 b21y4 uixns">
<h2 class="madsw tuuss z0e83 dark:text-neutral-500">
Explore help topics
</h2>
<!-- List Group -->
<ul class="space-y-2">
<!-- List Item -->
<li>
<a class="v30bw flex items-center rdqxy zxv30 k9mkq yxawv tuuss hw6xt ejo46 dark:text-neutral-200 mzy38 hmpqz focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-neutral-700 dark:hover:text-blue-500 dark:focus:bg-neutral-700" href="#">
<span class="flex n2l26 enhxb items-center x7ecd zxv30 k9mkq yxawv wavyl dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
<svg class="n2l26 bnmi1 j28t5 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM6.79 5.093A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814l-3.5-2.5z"/>
</svg>
</span>
<div class="dgznh">
<p>
Preline Course
</p>
</div>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</a>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<a class="v30bw flex items-center rdqxy zxv30 k9mkq yxawv tuuss hw6xt ejo46 dark:text-neutral-200 mzy38 hmpqz focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-neutral-700 dark:hover:text-blue-500 dark:focus:bg-neutral-700" href="#">
<span class="flex n2l26 enhxb items-center x7ecd zxv30 k9mkq yxawv wavyl dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
<svg class="n2l26 bnmi1 jr5ck dark:text-purple-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7Zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm-5.784 6A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216ZM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z"/>
</svg>
</span>
<div class="dgznh">
<p>
Community Group
</p>
</div>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</a>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<a class="v30bw flex items-center rdqxy zxv30 k9mkq yxawv tuuss hw6xt ejo46 dark:text-neutral-200 mzy38 hmpqz focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-neutral-700 dark:hover:text-blue-500 dark:focus:bg-neutral-700" href="#">
<span class="flex n2l26 enhxb items-center x7ecd zxv30 k9mkq yxawv wavyl dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
<svg class="n2l26 bnmi1 ievex dark:text-cyan-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v1.384l7.614 2.03a1.5 1.5 0 0 0 .772 0L16 5.884V4.5A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1h-3zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5z"/>
<path d="M0 12.5A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5V6.85L8.129 8.947a.5.5 0 0 1-.258 0L0 6.85v5.65z"/>
</svg>
</span>
<div class="dgznh">
<p>
Hire a Partner Expert
</p>
</div>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</a>
</li>
<!-- End List Item -->
<!-- List Item -->
<li>
<a class="v30bw flex items-center rdqxy zxv30 k9mkq yxawv tuuss hw6xt ejo46 dark:text-neutral-200 mzy38 hmpqz focus:outline-hidden rjc3l dark:bg-neutral-800 dark:border-neutral-700 dark:hover:text-blue-500 dark:focus:bg-neutral-700" href="#">
<span class="flex n2l26 enhxb items-center x7ecd zxv30 k9mkq yxawv wavyl dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300">
<svg class="n2l26 bnmi1 ed239 dark:text-indigo-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.496 6.033h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286a.237.237 0 0 0 .241.247zm2.325 6.443c.61 0 1.029-.394 1.029-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94 0 .533.425.927 1.01.927z"/>
</svg>
</span>
<div class="dgznh">
<p>
Help center
</p>
</div>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</a>
</li>
<!-- End List Item -->
</ul>
<!-- End List Group -->
</div>
</div>
<!-- End Body -->
</div>
</div>
<!-- End Activity Offcanvas -->
<!-- User Table User Details Offcanvas -->
<div id="hs-pro-dutoo" class="hs-overlay hs-overlay-open:translate-x-0 hidden nnchn fixed zxmp1 aoum9 nf9l7 ixagr pve7h kquz2 flex-1 flex flex-col wxttw c61v5 zxv30 dark:bg-neutral-800" role="dialog" tabindex="-1" aria-labelledby="hs-pro-dutoo-label">
<!-- Close Button -->
<div class="absolute kjxn2 f65mc te8l0">
<button type="button" class="x8hlq n2l26 flex enhxb items-center u3ov7 mr9qs k9mkq je4jy gxtht ejo46 p12pm disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden d10id dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-dutoo">
<span class="r8a99">Close</span>
<svg class="n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- End Close Button -->
<!-- Header -->
<div class="x6le5 y3kub flex flex-col enhxb items-center cgjzl">
<img class="n2l26 smr3m mr9qs" src="https://images.unsplash.com/photo-1570654639102-bdd95efeca7a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2.5&w=320&h=320&q=80" alt="Avatar">
<div class="nqo4p">
<h3 id="hs-pro-dutoo-label" class="vmtij hysdx ejo46 dark:text-neutral-200">
Anna Richard
</h3>
<p class="on128 z0e83 dark:text-neutral-500">
Contact was created 22 days ago
</p>
</div>
</div>
<!-- End Header -->
<!-- Body -->
<div class="x6le5 rht0b ux1hp flex-1 flex flex-col overflow-y-auto overflow-hidden hm2m0 uqiuh b3ail ykfhs dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
<!-- List Item -->
<div class="iifk8 khfgm n38d7 btgx5 jhbd9 yxawv dark:border-neutral-700">
<div class="b8438">
<p class="tuuss z0e83 dark:text-neutral-500">
User ID:
</p>
</div>
<div class="qs1sy">
<p>
<a class="tuuss j28t5 njs8g h8tqt hw6xt focus:outline-hidden ch28j dark:text-blue-400 dark:hover:text-blue-500" href="#">
#96810
</a>
</p>
</div>
</div>
<!-- End List Item -->
<!-- List Item -->
<div class="iifk8 khfgm n38d7 btgx5 jhbd9 yxawv dark:border-neutral-700">
<div class="b8438">
<p class="tuuss z0e83 dark:text-neutral-500">
Email:
</p>
</div>
<div class="qs1sy">
<p class="tuuss ejo46 dark:text-neutral-200">
anna@site.com
</p>
</div>
</div>
<!-- End List Item -->
<!-- List Item -->
<div class="iifk8 khfgm n38d7 btgx5 jhbd9 yxawv dark:border-neutral-700">
<div class="b8438">
<p class="tuuss z0e83 dark:text-neutral-500">
Phone:
</p>
</div>
<div class="qs1sy">
<div class="flex items-center u3ov7">
<svg class="n2l26 szmrd mr9qs" xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-us" viewBox="0 0 512 512">
<g fill-rule="evenodd">
<g stroke-width="1pt">
<path fill="#bd3d44" d="M0 0h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z" transform="scale(3.9385)"/>
<path fill="#fff" d="M0 10h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z" transform="scale(3.9385)"/>
</g>
<path fill="#192f5d" d="M0 0h98.8v70H0z" transform="scale(3.9385)"/>
<path fill="#fff" d="M8.2 3l1 2.8H12L9.7 7.5l.9 2.7-2.4-1.7L6 10.2l.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7L74 8.5l-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 7.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 24.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 21.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 38.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 35.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 52.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 49.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 66.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 63.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9z" transform="scale(3.9385)"/>
</g>
</svg>
<span class="tuuss ejo46 dark:text-neutral-200">
+1 000-00-00
</span>
</div>
</div>
</div>
<!-- End List Item -->
<!-- List Item -->
<div class="iifk8 khfgm n38d7 btgx5 jhbd9 yxawv dark:border-neutral-700">
<div class="b8438">
<p class="tuuss z0e83 dark:text-neutral-500">
Address:
</p>
</div>
<div class="qs1sy">
<p class="tuuss ejo46 dark:text-neutral-200">
4970 Park Ave W, Ohio, 44723, Untied States
</p>
</div>
</div>
<!-- End List Item -->
<!-- List Item -->
<div class="iifk8 khfgm n38d7 items-center btgx5 jhbd9 yxawv dark:border-neutral-700">
<div class="b8438">
<p class="tuuss z0e83 dark:text-neutral-500">
Signed up as:
</p>
</div>
<div class="qs1sy">
<span class="f9d5d j6548 g99ml inline-flex items-center r2jif on128 hw6xt yir1a mrcl2 mr9qs dark:bg-teal-500/10 dark:text-teal-500">
<svg class="br82p" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Valid account
</span>
</div>
</div>
<!-- End List Item -->
</div>
<!-- End Body -->
<!-- Footer -->
<div class="y3kub jhbd9 yxawv dark:border-neutral-700">
<div class="flex items-center u3ov7">
<!-- Button -->
<button type="button" class="hxfjh l1xlu xp67g inline-flex enhxb items-center u3ov7 tuuss hw6xt wavyl k9mkq je4jy o0y3u w3h0o pgsi2 disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden kebql isksk" data-hs-overlay="#hs-pro-deum">
<svg class="hidden sm:block n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/></svg>
Edit user
</button>
<!-- End Button -->
<!-- Button -->
<button type="button" class="hxfjh l1xlu xp67g inline-flex enhxb items-center u3ov7 tuuss hw6xt wavyl k9mkq yxawv zxv30 ejo46 ntfdl wsl5v disabled:opacity-50 disabled:pointer-events-none focus:outline-hidden u7q2f dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700">
<svg class="hidden sm:block n2l26 szmrd" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
Delete
</button>
<!-- End Button -->
</div>
</div>
<!-- End Footer -->
</div>
<!-- End User Table User Details Offcanvas -->