@extends('admin.layouts.master')

@section('content')
    <div class="ticket-layout-wrapper">
        <div class="ticket-layout-wrapper-content">
            <div class="ticket-topbar">
                <div class="ticket-topbar-left">
                    <button type='button' class="ticket-topbar-toggler">
                        <i class="fa fa-bars"></i>
                    </button>
                    {{ __($pageTitle) }}
                </div>
            </div>

            <div class="ticket-body-wrapper">
                <div class="table-scroller">
                    <table class="table ticket-table">
                        <thead>
                            <tr>
                                <th class="ticket-col">Ticket</th>
                                <th class="requester-col">Requester</th>
                                <th class="status-col">Status </th>
                                <th class="last-message-col">Last Message</th>
                                <th class="action-col"></th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown" aria-expanded="false"
                                            data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-actions"
                                                                aria-expanded="true" aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions" class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-status"
                                                                aria-expanded="false" aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse" data-bs-target="#ticket-folders"
                                                                aria-expanded="false" aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-actions" aria-expanded="true"
                                                                aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions"
                                                            class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-status" aria-expanded="false"
                                                                aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-folders" aria-expanded="false"
                                                                aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-actions" aria-expanded="true"
                                                                aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions"
                                                            class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-status" aria-expanded="false"
                                                                aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-folders" aria-expanded="false"
                                                                aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-actions" aria-expanded="true"
                                                                aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions"
                                                            class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-status" aria-expanded="false"
                                                                aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-folders" aria-expanded="false"
                                                                aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-actions" aria-expanded="true"
                                                                aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions"
                                                            class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-status" aria-expanded="false"
                                                                aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-folders" aria-expanded="false"
                                                                aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="ticket-col">
                                    <div class="ticket-board">
                                        <div class="ticket-board-content">
                                            <p class="ticket-board-title">
                                                <Circle variant={priorityColor(ticket.priority)}
                                                    color={ticket?.priority?.converted_color} />
                                                # Technical support or assistance with troubleshooting issues
                                            </p>
                                            <div class="ticket-board-list">
                                                <p class="ticket-board-type">
                                                    Marketing
                                                </p>
                                                <p class="ticket-board-id fw-bold">
                                                    ID #53332626
                                                </p>
                                                <a href="#" class="ticket-board-assign text--base">
                                                    <i class="fa fa-user-check"></i>
                                                    Kelvine Jack
                                                </a>
                                                <div class='ticket-board-tags'>
                                                    <span class='tag-style'>Marketing</span>
                                                    <span class='tag-style'>Support</span>
                                                    <span class='tag-style'>Ticket</span>
                                                    <span class='tag-style'>New</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="requester-col">
                                    <div class="mini-profile">
                                        <div class="mini-profile-img">
                                            <img src="assets/images/men.png" alt="">
                                        </div>
                                        <div class="mini-profile-content">
                                            <a href="#" class="name">Jack</a>
                                            <p class="email">kelvine@gmail.com</p>
                                        </div>
                                    </div>
                                </td>
                                <td class="status-col">
                                    <span class="badge badge--success">Open</span>
                                </td>
                                <td class="last-message-col">
                                    Last Week
                                </td>
                                <td class="action-col">
                                    <div class="dropdown ticket-dropdown">
                                        <button class="ticket-dropdown-btn" data-bs-toggle="dropdown"
                                            aria-expanded="false" data-bs-auto-close="outside">
                                            <i class="fa fa-ellipsis-v"></i>
                                        </button>
                                        <div class="dropdown-menu ticket-dropdown-body">
                                            <div class="dropdown-menu-block">
                                                <div class="accordion ticket-accordion" id="ticket-parent">
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-actions" aria-expanded="true"
                                                                aria-controls="ticket-actions">
                                                                Set Priority
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-actions"
                                                            class="accordion-collapse collapse show"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">
                                                                        Set to Urgent
                                                                    </p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle danger">
                                                                    </span>

                                                                    <p class="title">Set to High</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle secondary">
                                                                    </span>

                                                                    <p class="title">Set to Medium</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <span class="animated-circle success">
                                                                    </span>

                                                                    <p class="title">Set to Low</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-status" aria-expanded="false"
                                                                aria-controls="ticket-status">
                                                                Set Status
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-status" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--base">Open</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--warning">On Hold</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title text--dark">Closed</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="accordion-item">
                                                        <h2 class="accordion-header">
                                                            <button class="accordion-button" type="button"
                                                                data-bs-toggle="collapse"
                                                                data-bs-target="#ticket-folders" aria-expanded="false"
                                                                aria-controls="ticket-folders">
                                                                Folders
                                                            </button>
                                                        </h2>
                                                        <div id="ticket-folders" class="accordion-collapse collapse"
                                                            data-bs-parent="#ticket-parent">
                                                            <div class="accordion-body">
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Draft</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Spam</p>
                                                                </div>
                                                                <div class="ticket-dropdown-item">
                                                                    <p class="title">Move to Trash</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>

                        </tbody>
                    </table>
                </div>
                <nav class="pagination @@class">
                    <li class="page-item disabled" aria-disabled="true">
                        <span class="page-link">
                            <i class="las la-angle-left"></i>
                            Previous
                        </span>
                    </li>
                    <li class="page-item active" aria-current="page"><span class="page-link">1</span></li>
                    <li class="page-item">
                        <a class="page-link" href="">2</a>
                    </li>
                    <li class="page-item">
                        <a class="page-link" href="" rel="next">
                            Next
                            <i class="las la-angle-right"></i>
                        </a>
                    </li>
                </nav>

            </div>
        </div>
    </div>
@endsection
