---

<div class="mt-3.5 flex flex-col gap-x-6 gap-y-10 lg:flex-row">
                                <div class="w-full flex-none lg:w-[23rem]"> <!-- история тута -->
                                    <div class="flex flex-col gap-y-7">
                                        <div class="box box--stacked flex flex-col p-2">
                                            <ul role="tablist" class="p-0.5 border rounded-lg dark:border-darkmode-400 w-full flex border-transparent bg-transparent">
                                                <li id="example-1-tab" role="presentation" class="focus-visible:outline-none flex-1 first:rounded-l-[0.6rem] last:rounded-r-[0.6rem] [&amp;[aria-selected='true']_button]:border-primary/[0.15] [&amp;[aria-selected='true']_button]:bg-primary/[0.04] [&amp;[aria-selected='true']_button]:font-medium [&amp;[aria-selected='true']_button]:text-primary [&amp;[aria-selected='true']_button]:shadow-sm">
                                                    <button data-tw-target="#example-1" role="tab" class="cursor-pointer appearance-none px-3 border border-transparent transition-colors dark:text-slate-400 [&amp;.active]:text-slate-700 dark:border-transparent [&amp;.active]:border [&amp;.active]:shadow-sm [&amp;.active]:font-medium [&amp;.active]:border-slate-200 [&amp;.active]:bg-white [&amp;.active]:dark:text-slate-300 [&amp;.active]:dark:bg-darkmode-400 [&amp;.active]:dark:border-darkmode-400 active flex w-full items-center justify-center gap-2 whitespace-nowrap rounded-[0.6rem] py-3 text-slate-500"><svg 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" data-lucide="messages-square" class="lucide lucide-messages-square h-4 w-4 stroke-[1.4]"><path d="M14 9a2 2 0 0 1-2 2H6l-4 4V4c0-1.1.9-2 2-2h8a2 2 0 0 1 2 2v5Z"></path><path d="M18 9h2a2 2 0 0 1 2 2v11l-4-4h-6a2 2 0 0 1-2-2v-1"></path></svg>
                                                        История
                                                        <span class="flex min-w-[1.15rem] items-center justify-center rounded-full bg-white text-xs">
                                                            <span class="block h-full w-full rounded-full bg-theme-1/[0.75] px-1.5 py-0.5 leading-none text-white">
                                                                15
                                                            </span>
                                                        </span></button>
                                                </li>

                                            </ul>
                                        </div>
                                        <div class="box box--stacked flex flex-col p-5">
                                            <div class="tab-content">
                                                <div data-transition="" data-selector=".active" data-enter="transition-[visibility,opacity] ease-linear duration-150" data-enter-from="!p-0 !h-0 overflow-hidden invisible opacity-0" data-enter-to="visible opacity-100" data-leave="transition-[visibility,opacity] ease-linear duration-150" data-leave-from="visible opacity-100" data-leave-to="!p-0 !h-0 overflow-hidden invisible opacity-0" id="example-1" role="tabpanel" aria-labelledby="example-1-tab" class="tab-pane active visible opacity-100" data-state="enter">
                                                    <div class="">
                                                        <div class="relative">
                                                            <svg 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" data-lucide="search" class="lucide lucide-search absolute inset-y-0 left-0 z-10 my-auto ml-4 h-4 w-4 stroke-[1.3] text-slate-500/90"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg>
                                                            <input type="text" placeholder="Поиск в истории..." class="disabled:bg-slate-100 disabled:cursor-not-allowed dark:disabled:bg-darkmode-800/50 dark:disabled:border-transparent [&amp;[readonly]]:bg-slate-100 [&amp;[readonly]]:cursor-not-allowed [&amp;[readonly]]:dark:bg-darkmode-800/50 [&amp;[readonly]]:dark:border-transparent transition duration-200 ease-in-out w-full text-sm border-slate-200 shadow-sm placeholder:text-slate-400/90 focus:ring-4 focus:ring-primary focus:ring-opacity-20 focus:border-primary focus:border-opacity-40 dark:bg-darkmode-800 dark:border-transparent dark:focus:ring-slate-700 dark:focus:ring-opacity-50 dark:placeholder:text-slate-500/80 [&amp;[type='file']]:border file:mr-4 file:py-2 file:px-4 file:rounded-l-md file:border-0 file:border-r-[1px] file:border-slate-100/10 file:text-sm file:font-semibold file:bg-slate-100 file:text-slate-500/70 hover:file:bg-200 group-[.form-inline]:flex-1 group-[.input-group]:rounded-none group-[.input-group]:[&amp;:not(:first-child)]:border-l-transparent group-[.input-group]:first:rounded-l group-[.input-group]:last:rounded-r group-[.input-group]:z-10 rounded-full py-2.5 pl-10">
                                                        </div>


                                                        <div class="mt-4 flex flex-col gap-1">
                                                         <!-- сюда выводится история -->
                                                         <div class="-mx-2 flex cursor-pointer items-center gap-4 rounded-lg px-2 py-2.5 hover:bg-slate-50">

                                                                <div class="w-full">
                                                                    <div class="flex w-full items-center">
                                                                        <div class="max-w-[7rem] truncate font-medium md:max-w-[8rem]">
                                                                            Документы на отправку кс12
                                                                        </div>
                                                                        <div class="ml-auto flex items-center gap-2">
                                                                            <div class="text-xs text-slate-500/90">
                                                                                09:00 AM
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="mt-1.5 flex items-center">
                                                                        <div class="max-w-[7rem] truncate text-slate-500/90 md:max-w-[10rem]">
                                                                            кс12.jpg
                                                                        </div>
                                                                        <div class="ml-auto flex items-center gap-2">
                                                                            <svg 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" data-lucide="pin" class="lucide lucide-pin stroke-[1] h-3.5 w-3.5 rotate-45 fill-slate-500/10 text-slate-500"><line x1="12" x2="12" y1="17" y2="22"></line><path d="M5 17h14v-1.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V6h1a2 2 0 0 0 0-4H8a2 2 0 0 0 0 4h1v4.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24Z"></path></svg>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>

                                <div class="flex w-full flex-col gap-y-7">
                                    <div class="box box--stacked flex flex-col p-5">
                                        <div class="flex items-center gap-3.5 border-b border-dashed pb-5">
                                            <div>
                                                <div class="image-fit h-12 w-12 overflow-hidden rounded-full border-[3px] border-slate-200/70">
                                                    <img src="dist/images/users/user6-50x50.jpg" alt="Tailwise - Admin Dashboard Template">
                                                </div>
                                            </div>
                                            <div>
                                                <div class="max-w-[9rem] truncate font-medium md:max-w-none">
                                                    Виртуальный бухгалтер
                                                </div>
                                                <div class="mt-0.5 max-w-[9rem] truncate text-slate-500 md:max-w-none">
                                                 Ваш персональный помощник
                                                </div>
                                            </div>

                                        </div>
                                        <div class="scrollable-ref h-[46.6rem] -mx-3 overflow-y-auto [&amp;:-webkit-scrollbar]:w-0 [&amp;:-webkit-scrollbar]:bg-transparent [&amp;_.simplebar-content]:p-0 [&amp;_.simplebar-track.simplebar-vertical]:w-[10px] [&amp;_.simplebar-track.simplebar-vertical]:mr-0.5 [&amp;_.simplebar-track.simplebar-vertical_.simplebar-scrollbar]:before:bg-slate-400/20" data-simplebar="init"><div class="simplebar-wrapper" style="margin: 0px;"><div class="simplebar-height-auto-observer-wrapper"><div class="simplebar-height-auto-observer"></div></div><div class="simplebar-mask"><div class="simplebar-offset" style="right: 0px; bottom: 0px;"><div class="simplebar-content-wrapper" tabindex="0" role="region" aria-label="scrollable content" style="height: 100%; overflow: hidden;"><div class="simplebar-content" style="padding: 0px;">

                                        </div></div></div></div><div class="simplebar-placeholder" style="width: auto; height: 0px;"></div></div><div class="simplebar-track simplebar-horizontal" style="visibility: hidden;"><div class="simplebar-scrollbar" style="width: 0px; display: none;"></div></div><div class="simplebar-track simplebar-vertical" style="visibility: hidden;"><div class="simplebar-scrollbar" style="height: 0px; display: none;"></div></div></div>
                                        <div class="relative">
                                            <textarea placeholder="Напишите сообщение..." class="disabled:bg-slate-100 disabled:cursor-not-allowed dark:disabled:bg-darkmode-800/50 dark:disabled:border-transparent [&amp;[readonly]]:bg-slate-100 [&amp;[readonly]]:cursor-not-allowed [&amp;[readonly]]:dark:bg-darkmode-800/50 [&amp;[readonly]]:dark:border-transparent transition duration-200 ease-in-out w-full text-sm border-slate-200 shadow-sm placeholder:text-slate-400/90 focus:ring-4 focus:ring-primary focus:ring-opacity-20 focus:border-primary focus:border-opacity-40 dark:bg-darkmode-800 dark:border-transparent dark:focus:ring-slate-700 dark:focus:ring-opacity-50 dark:placeholder:text-slate-500/80 group-[.form-inline]:flex-1 group-[.input-group]:rounded-none group-[.input-group]:[&amp;:not(:first-child)]:border-l-transparent group-[.input-group]:first:rounded-l group-[.input-group]:last:rounded-r group-[.input-group]:z-10 -mb-1.5 resize-none rounded-xl pr-16"></textarea>
                                            <div class="absolute inset-y-0 right-0 flex w-[3.8rem] items-center justify-center">
                                                <a class="box flex h-9 w-9 cursor-pointer items-center justify-center rounded-full border-transparent bg-gradient-to-b from-theme-1/90 to-theme-2/90" href="">
                                                    <svg 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" data-lucide="send" class="lucide lucide-send -ml-0.5 h-4 w-4 stroke-[1.3] text-white/70"><path d="m22 2-7 20-4-9-9-4Z"></path><path d="M22 2 11 13"></path></svg>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>