Application Tables
Quickly get a project started with any of our examples ranging from using parts of the UI to custom components and layouts using Tailwind CSS.
Cryptocurrency Market Cap
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
Cryptocurrency Prices by Market Cap
</h2>
<p class="text-sm text-gray-600 dark:text-gray-400">
The global cryptocurrency market cap today is $1.09 Trillion, a <span class="text-green-500">0.5%</span> change in the last 24 hours.
</p>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-800">
<tr>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
#
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap min-w-[16rem]">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Coin
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Price
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
1h
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
24h
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
7d
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
24h Volume
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Mkt Cap
</span>
</th>
<th scope="col" class="px-6 py-3 text-start whitespace-nowrap">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Last 7 days
</span>
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">1</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" width="2500" height="2500" viewBox="0.004 0 63.993 64"><path d="M63.04 39.741c-4.274 17.143-21.638 27.575-38.783 23.301C7.12 58.768-3.313 41.404.962 24.262 5.234 7.117 22.597-3.317 39.737.957c17.144 4.274 27.576 21.64 23.302 38.784z" fill="#f7931a"/><path d="M46.11 27.441c.636-4.258-2.606-6.547-7.039-8.074l1.438-5.768-3.512-.875-1.4 5.616c-.922-.23-1.87-.447-2.812-.662l1.41-5.653-3.509-.875-1.439 5.766c-.764-.174-1.514-.346-2.242-.527l.004-.018-4.842-1.209-.934 3.75s2.605.597 2.55.634c1.422.355 1.68 1.296 1.636 2.042l-1.638 6.571c.098.025.225.061.365.117l-.37-.092-2.297 9.205c-.174.432-.615 1.08-1.609.834.035.051-2.552-.637-2.552-.637l-1.743 4.02 4.57 1.139c.85.213 1.683.436 2.502.646l-1.453 5.835 3.507.875 1.44-5.772c.957.26 1.887.5 2.797.726L27.504 50.8l3.511.875 1.453-5.823c5.987 1.133 10.49.676 12.383-4.738 1.527-4.36-.075-6.875-3.225-8.516 2.294-.531 4.022-2.04 4.483-5.157zM38.087 38.69c-1.086 4.36-8.426 2.004-10.807 1.412l1.928-7.729c2.38.594 10.011 1.77 8.88 6.317zm1.085-11.312c-.99 3.966-7.1 1.951-9.083 1.457l1.748-7.01c1.983.494 8.367 1.416 7.335 5.553z" fill="#fff"/></svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Bitcoin</span>
<span class="text-xs text-gray-500">BTC</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$26,869.14</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.3%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-3.8%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$15,438,433,675</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$524,007,508,943</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-1"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">2</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" height="2500" viewBox="420.1 80.7 1079.8 1758.6" width="983"><path d="m959.8 80.7-539.7 895.6 539.7-245.3z" fill="#8a92b2"/><path d="m959.8 731-539.7 245.3 539.7 319.1zm539.8 245.3-539.8-895.6v650.3z" fill="#62688f"/><path d="m959.8 1295.4 539.8-319.1-539.8-245.3z" fill="#454a75"/><path d="m420.1 1078.7 539.7 760.6v-441.7z" fill="#8a92b2"/><path d="m959.8 1397.6v441.7l540.1-760.6z" fill="#62688f"/></svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Ethereum</span>
<span class="text-xs text-gray-500">ETH</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$1,546.77</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.2%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-5.7%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$6,591,963,010</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$185,955,678,121</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-2"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">3</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" width="49" height="40" viewBox="0 0 49 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.5497 0H38.4507C39.1165 0 39.7315 0.356142 40.0635 0.933924L48.1922 15.0798C48.6137 15.8134 48.4885 16.7393 47.8872 17.3342L25.5127 39.4708C24.7879 40.1879 23.622 40.1879 22.8972 39.4708L0.552922 17.3641C-0.0623286 16.7554 -0.177538 15.8025 0.274888 15.0643L8.96384 0.888538C9.30224 0.336459 9.90273 0 10.5497 0ZM34.8482 6.31565V10.2848H26.9003V13.0367C32.4824 13.3308 36.6704 14.5386 36.7015 15.9863L36.7013 19.0044C36.6702 20.4521 32.4824 21.6599 26.9003 21.954V28.7075H21.6228V21.954C16.0407 21.6599 11.8527 20.4521 11.8217 19.0044L11.8218 15.9863C11.8529 14.5386 16.0407 13.3308 21.6228 13.0367V10.2848H13.6749V6.31565H34.8482ZM24.2616 19.8806C30.2186 19.8806 35.1977 18.8593 36.4162 17.4954C35.3829 16.3388 31.6453 15.4285 26.9003 15.1785V18.0598C26.0499 18.1046 25.167 18.1282 24.2616 18.1282C23.3561 18.1282 22.4733 18.1046 21.6228 18.0598V15.1785C16.8778 15.4285 13.1402 16.3388 12.1069 17.4954C13.3254 18.8593 18.3045 19.8806 24.2616 19.8806Z" fill="#009393"/>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Tether</span>
<span class="text-xs text-gray-500">USDT</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$0.999970</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.0%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.0%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$19,869,550,292</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$83,526,487,241</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-3"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">4</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 2496 2496" style="enable-background:new 0 0 2496 2496;" xml:space="preserve">
<g>
<path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F0B90B;" d="M1248,0c689.3,0,1248,558.7,1248,1248s-558.7,1248-1248,1248
S0,1937.3,0,1248S558.7,0,1248,0L1248,0z"/>
<path style="fill:#FFFFFF;" d="M685.9,1248l0.9,330l280.4,165v193.2l-444.5-260.7v-524L685.9,1248L685.9,1248z M685.9,918v192.3
l-163.3-96.6V821.4l163.3-96.6l164.1,96.6L685.9,918L685.9,918z M1084.3,821.4l163.3-96.6l164.1,96.6L1247.6,918L1084.3,821.4
L1084.3,821.4z"/>
<path style="fill:#FFFFFF;" d="M803.9,1509.6v-193.2l163.3,96.6v192.3L803.9,1509.6L803.9,1509.6z M1084.3,1812.2l163.3,96.6
l164.1-96.6v192.3l-164.1,96.6l-163.3-96.6V1812.2L1084.3,1812.2z M1645.9,821.4l163.3-96.6l164.1,96.6v192.3l-164.1,96.6V918
L1645.9,821.4L1645.9,821.4L1645.9,821.4z M1809.2,1578l0.9-330l163.3-96.6v524l-444.5,260.7v-193.2L1809.2,1578L1809.2,1578
L1809.2,1578z"/>
<polygon style="fill:#FFFFFF;" points="1692.1,1509.6 1528.8,1605.3 1528.8,1413 1692.1,1316.4 1692.1,1509.6 "/>
<path style="fill:#FFFFFF;" d="M1692.1,986.4l0.9,193.2l-281.2,165v330.8l-163.3,95.7l-163.3-95.7v-330.8l-281.2-165V986.4
L968,889.8l279.5,165.8l281.2-165.8l164.1,96.6H1692.1L1692.1,986.4z M803.9,656.5l443.7-261.6l444.5,261.6l-163.3,96.6
l-281.2-165.8L967.2,753.1L803.9,656.5L803.9,656.5z"/>
</g>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">BNB</span>
<span class="text-xs text-gray-500">BNB</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$206.10</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.2%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-3.5%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$274,816,679</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$31,733,331,578</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-4"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">5</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" width="2500" height="2500" viewBox="0 0 2500 2500" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1250 2500C1940.36 2500 2500 1940.36 2500 1250C2500 559.644 1940.36 0 1250 0C559.644 0 0 559.644 0 1250C0 1940.36 559.644 2500 1250 2500Z" fill="black"/><path d="M1820.4 549.8H2053.6L1568.1 1053.2C1392.3 1235.5 1107.3 1235.5 931.9 1053.2L446.3 549.8H679.5L1048.2 932.2C1159.7 1047.5 1340 1047.5 1451.2 932.2L1820.4 549.8ZM676.6 1950.2H443.3L931.9 1443.4C1107.71261.1 1392.7 1261.1 1568.5 1443.4L2057.1 1950.2H1823.8L1452 1564.4C1340.5 1449.1 1160.2 1449.1 1049 1564.4L676.6 1950.2Z" fill="white"/>
<span class="font-semibold text-sm text-gray-800 dark:text-white">XRP</span>
<span class="text-xs text-gray-500">XRP</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$0.484377</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.0%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.6%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-7.3%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$559,515,333</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$25,878,334,217</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-5"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">6</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000 2000">
<path d="M1000 2000c554.17 0 1000-445.83 1000-1000S1554.17 0 1000 0 0 445.83 0 1000s445.83 1000 1000 1000z" fill="#2775ca"/>
<path d="M1275 1158.33c0-145.83-87.5-195.83-262.5-216.66-125-16.67-150-50-150-108.34s41.67-95.83 125-95.83c75 0 116.67 25 137.5 87.5 4.17 12.5 16.67 20.83 29.17 20.83h66.66c16.67 0 29.17-12.5 29.17-29.16v-4.17c-16.67-91.67-91.67-162.5-187.5-170.83v-100c0-16.67-12.5-29.17-33.33-33.34h-62.5c-16.67 0-29.17 12.5-33.34 33.34v95.83c-125 16.67-204.16 100-204.16 204.17 0 137.5 83.33 191.66 258.33 212.5 116.67 20.83 154.17 45.83 154.17 112.5s-58.34 112.5-137.5 112.5c-108.34 0-145.84-45.84-158.34-108.34-4.16-16.66-16.66-25-29.16-25h-70.84c-16.66 0-29.16 12.5-29.16 29.17v4.17c16.66 104.16 83.33 179.16 220.83 200v100c0 16.66 12.5 29.16 33.33 33.33h62.5c16.67 0 29.17-12.5 33.34-33.33v-100c125-20.84 208.33-108.34 208.33-220.84z" fill="#fff"/>
<path d="M787.5 1595.83c-325-116.66-491.67-479.16-370.83-800 62.5-175 200-308.33 370.83-370.83 16.67-8.33 25-20.83 25-41.67V325c0-16.67-8.33-29.17-25-33.33-4.17 0-12.5 0-16.67 4.16-395.83 125-612.5 545.84-487.5 941.67 75 233.33 254.17 412.5 487.5 487.5 16.67 8.33 33.34 0 37.5-16.67 4.17-4.16 4.17-8.33 4.17-16.66v-58.34c0-12.5-12.5-29.16-25-37.5zM1229.17 295.83c-16.67-8.33-33.34 0-37.5 16.67-4.17 4.17-4.17 8.33-4.17 16.67v58.33c0 16.67 12.5 33.33 25 41.67 325 116.66 491.67 479.16 370.83 800-62.5 175-200 308.33-370.83 370.83-16.67 8.33-25 20.83-25 41.67V1700c0 16.67 8.33 29.17 25 33.33 4.17 0 12.5 0 16.67-4.16 395.83-125 612.5-545.84 487.5-941.67-75-237.5-258.34-416.67-487.5-491.67z" fill="#fff"/>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">USDC</span>
<span class="text-xs text-gray-500">USDC</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$1.00</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.0%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-0.0%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$4,007,517,282</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$25,115,962,449</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-6"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">7</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><style>.cls-1{fill:#ff060a;}</style></defs><title>tron</title><g id="tron"><path class="cls-1" d="M61.55,19.28c-3-2.77-7.15-7-10.53-10l-.2-.14a3.82,3.82,0,0,0-1.11-.62l0,0C41.56,7,3.63-.09,2.89,0a1.4,1.4,0,0,0-.58.22L2.12.37a2.23,2.23,0,0,0-.52.84l-.05.13v.71l0,.11C5.82,14.05,22.68,53,26,62.14c.2.62.58,1.8,1.29,1.86h.16c.38,0,2-2.14,2-2.14S58.41,26.74,61.34,23a9.46,9.46,0,0,0,1-1.48A2.41,2.41,0,0,0,61.55,19.28ZM36.88,23.37,49.24,13.12l7.25,6.68Zm-4.8-.67L10.8,5.26l34.43,6.35ZM34,27.27l21.78-3.51-24.9,30ZM7.91,7,30.3,26,27.06,53.78Z"/></g></svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Tron</span>
<span class="text-xs text-gray-500">TRX</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$1,546.64</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.2%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.0%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-5.7%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$2,882,655</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$13,629,792,526</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-7"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">8</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" <svg width="490" height="503" viewBox="0 0 490 503" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M244.6 0.5H245C379.9 0.5 489.3 109.9 489.3 244.8V258.4C489.3 393.3 379.9 502.7 245 502.7H244.6C109.7 502.7 0.299988 393.3 0.299988 258.4V244.8C0.299988 109.9 109.7 0.5 244.6 0.5Z" fill="#232323"/>
<path d="M349.3 189.5C348.5 190.4 347.5 191.1 346.4 191.5C345.3 192 344.1 192.2 342.9 192.2H116.4C108.4 192.2 104.3 182.2 109.9 176.2L147.1 136.7C147.9 135.8 148.9 135.1 150.1 134.6C151.2 134.1 152.4 133.9 153.6 133.9H381C389.1 133.9 393.1 144 387.4 150L349.3 189.5ZM349.3 366.1C347.6 367.8 345.3 368.8 342.9 368.8H116.4C108.4 368.8 104.3 359 109.9 353.2L147.1 314.6C147.9 313.7 149 313 150.1 312.6C151.2 312.1 152.4 311.9 153.6 311.9H381C389.1 311.9 393.1 321.8 387.4 327.6L349.3 366.1ZM349.3 225.6C347.6 223.9 345.3 222.9 342.9 222.9H116.4C108.4 222.9 104.3 232.7 109.9 238.5L147.1 277.1C147.9 278 149 278.7 150.1 279.1C151.2 279.6 152.4 279.8 153.6 279.8H381C389.1 279.8 393.1 269.9 387.4 264.1L349.3 225.6Z" fill="url(#paint0_linear_93_221)"/>
<defs>
<linearGradient id="paint0_linear_93_221" x1="124.604" y1="371.732" x2="372.039" y2="130.833" gradientUnits="userSpaceOnUse">
<stop stop-color="#CF41E8"/>
<stop offset="1" stop-color="#10F2B0"/>
</linearGradient>
</defs>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Solana</span>
<span class="text-xs text-gray-500">SOL</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$22.11</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">3.6%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-6.7%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$317,711,493</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$9,153,498,199</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-8"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">9</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 375 346.5" style="enable-background:new 0 0 375 346.5;" xml:space="preserve">
<style type="text/css">
.st0{fill:#0033AD;}
</style>
<g id="Layer_2_1_">
<g id="Layer_1-2">
<path class="st0" d="M102.8,172c-0.8,13.9,9.9,25.8,23.8,26.6c0.5,0,1,0,1.5,0c14,0,25.3-11.3,25.2-25.3c0-14-11.3-25.3-25.3-25.2
C114.6,148.1,103.5,158.6,102.8,172z"/>
<path class="st0" d="M8.6,165.5c-4.5-0.3-8.4,3.2-8.6,7.7s3.2,8.4,7.7,8.6c4.5,0.3,8.3-3.2,8.6-7.7
C16.6,169.6,13.1,165.8,8.6,165.5C8.6,165.5,8.6,165.5,8.6,165.5z"/>
<path class="st0" d="M101.2,25.4c4-2,5.6-7,3.6-11c-2-4-7-5.6-11-3.6c-4,2-5.6,6.9-3.6,10.9C92.2,25.8,97.1,27.5,101.2,25.4
C101.1,25.4,101.2,25.4,101.2,25.4z"/>
<path class="st0" d="M126.8,70.1c6.2-3.1,8.7-10.7,5.6-16.9s-10.7-8.7-16.9-5.6c-6.2,3.1-8.7,10.7-5.6,16.9
C113,70.7,120.6,73.2,126.8,70.1z"/>
<path class="st0" d="M40.6,100.8c4.8,3.1,11.2,1.8,14.4-3c3.1-4.8,1.8-11.2-3-14.4c-4.8-3.1-11.2-1.8-14.4,3c0,0,0,0,0,0
C34.4,91.2,35.8,97.7,40.6,100.8z"/>
<path class="st0" d="M55.9,161c-7-0.4-12.9,4.9-13.3,11.9s4.9,12.9,11.9,13.3c7,0.4,12.9-4.9,13.3-11.9c0,0,0,0,0,0
C68.2,167.4,62.9,161.4,55.9,161z"/>
<path class="st0" d="M42,245.7c-5.1,2.6-7.2,8.8-4.6,14c2.6,5.1,8.8,7.2,14,4.6c5.1-2.6,7.2-8.8,4.6-14c0,0,0,0,0,0
C53.4,245.2,47.1,243.1,42,245.7C42,245.7,42,245.7,42,245.7z"/>
<path class="st0" d="M91,134.9c6.9,4.5,16.1,2.6,20.5-4.3c4.5-6.9,2.6-16.1-4.3-20.5c-6.9-4.5-16.1-2.6-20.5,4.3
C82.2,121.2,84.1,130.4,91,134.9C91,134.9,91,134.9,91,134.9z"/>
<path class="st0" d="M246.5,69.1c5.8,3.8,13.7,2.2,17.5-3.6s2.2-13.7-3.6-17.5c-5.8-3.8-13.7-2.2-17.5,3.6c0,0,0,0,0,0
C239,57.5,240.6,65.3,246.5,69.1C246.5,69.1,246.5,69.1,246.5,69.1z"/>
<path class="st0" d="M272.3,24.6c3.8,2.5,8.8,1.4,11.3-2.4s1.4-8.8-2.4-11.3c-3.8-2.5-8.8-1.4-11.3,2.3
C267.5,17,268.6,22.1,272.3,24.6C272.3,24.6,272.3,24.6,272.3,24.6z"/>
<path class="st0" d="M248.4,147.9c-13.9-0.8-25.9,9.9-26.6,23.8c-0.8,13.9,9.9,25.9,23.8,26.6c0.5,0,1,0,1.4,0
c13.9,0,25.2-11.3,25.2-25.3C272.3,159.7,261.8,148.6,248.4,147.9L248.4,147.9z"/>
<path class="st0" d="M135.1,133.1c4.3,8.5,13,13.9,22.6,13.9c13.9,0,25.2-11.3,25.2-25.3c0-3.9-0.9-7.8-2.7-11.4
c-6.3-12.5-21.5-17.5-33.9-11.2C133.8,105.5,128.8,120.7,135.1,133.1L135.1,133.1z"/>
<path class="st0" d="M333,100.8c5.1-2.6,7.1-8.9,4.5-14c-2.6-5.1-8.9-7.1-14-4.5c-5.1,2.6-7.1,8.8-4.6,13.9
C321.6,101.3,327.8,103.4,333,100.8C333,100.8,333,100.8,333,100.8z"/>
<path class="st0" d="M269,108.8c-7.3,3.7-10.3,12.6-6.6,19.9c3.7,7.3,12.6,10.3,19.9,6.6c7.3-3.7,10.3-12.6,6.6-19.9
C285.2,108.1,276.3,105.2,269,108.8z"/>
<path class="st0" d="M186.5,20.8c5.7,0.3,10.6-4.1,11-9.8s-4.1-10.6-9.8-11c-5.7-0.3-10.6,4-11,9.7
C176.4,15.5,180.8,20.4,186.5,20.8C186.5,20.8,186.5,20.8,186.5,20.8z"/>
<path class="st0" d="M186.4,86.1c8.2,0.5,15.2-5.8,15.6-14c0.5-8.2-5.8-15.2-14-15.6c-8.2-0.5-15.2,5.8-15.6,14
C172,78.7,178.2,85.7,186.4,86.1C186.4,86.1,186.4,86.1,186.4,86.1z"/>
<path class="st0" d="M106,237.7c7.3-3.7,10.3-12.6,6.6-19.9c-3.7-7.3-12.6-10.3-19.9-6.6c-7.3,3.7-10.3,12.6-6.6,19.9
C89.8,238.4,98.7,241.4,106,237.7z"/>
<path class="st0" d="M196,107.8c-7.6,11.7-4.4,27.3,7.3,34.9c11.7,7.6,27.3,4.4,34.9-7.3c7.6-11.7,4.4-27.3-7.3-34.9
c-4.1-2.7-8.9-4.1-13.8-4.1C208.6,96.4,200.7,100.7,196,107.8z"/>
<path class="st0" d="M239.9,213.4c-6.3-12.5-21.5-17.5-33.9-11.2c-12.5,6.3-17.5,21.5-11.2,33.9c6.3,12.5,21.5,17.5,33.9,11.2
c0,0,0,0,0,0c12.4-6.2,17.5-21.2,11.3-33.7C240,213.5,240,213.5,239.9,213.4z"/>
<path class="st0" d="M284,211.6c-6.9-4.5-16.1-2.6-20.5,4.3c-4.5,6.9-2.6,16.1,4.3,20.5c6.9,4.5,16.1,2.6,20.5-4.3
C292.8,225.3,290.9,216.1,284,211.6C284,211.6,284,211.6,284,211.6z"/>
<path class="st0" d="M332.4,173.7c0.4-7-4.9-12.9-11.9-13.3c-7-0.4-12.9,4.9-13.3,11.9c-0.4,7,4.9,12.9,11.9,13.3c0,0,0,0,0,0
C326,186,332,180.6,332.4,173.7z"/>
<path class="st0" d="M367.3,164.7c-4.5-0.3-8.4,3.2-8.6,7.7s3.2,8.4,7.7,8.6c4.5,0.3,8.3-3.2,8.6-7.7
C375.2,168.8,371.8,165,367.3,164.7z"/>
<path class="st0" d="M334.4,245.7c-4.8-3.1-11.2-1.8-14.4,3c-3.1,4.8-1.8,11.2,3,14.4c4.8,3.1,11.2,1.8,14.4-3
C340.6,255.3,339.2,248.8,334.4,245.7C334.4,245.7,334.4,245.7,334.4,245.7z"/>
<path class="st0" d="M102.6,321.9c-3.8-2.5-8.8-1.4-11.3,2.3c-2.5,3.8-1.4,8.8,2.3,11.3c3.8,2.5,8.8,1.4,11.3-2.3c0,0,0,0,0,0
C107.5,329.5,106.4,324.4,102.6,321.9z"/>
<path class="st0" d="M273.8,321.1c-4,2-5.6,7-3.6,11c2,4,7,5.6,11,3.6c4-2,5.6-6.9,3.6-10.9C282.8,320.7,277.9,319,273.8,321.1
C273.9,321.1,273.8,321.1,273.8,321.1z"/>
<path class="st0" d="M179,238.7c7.6-11.7,4.4-27.3-7.3-35c-11.7-7.6-27.3-4.4-35,7.3s-4.4,27.3,7.3,35c4.1,2.7,8.9,4.1,13.8,4.1
C166.4,250.2,174.3,245.9,179,238.7z"/>
<path class="st0" d="M128.5,277.4c-5.8-3.8-13.7-2.2-17.5,3.6c-3.8,5.8-2.2,13.7,3.6,17.5s13.7,2.2,17.5-3.6c0,0,0,0,0,0
C136,289.1,134.4,281.2,128.5,277.4z"/>
<path class="st0" d="M187.4,325.7c-5.7-0.3-10.6,4.1-11,9.8s4.1,10.6,9.8,11c5.7,0.3,10.6-4,11-9.7
C197.5,331,193.1,326.1,187.4,325.7C187.4,325.7,187.4,325.7,187.4,325.7z"/>
<path class="st0" d="M187.5,260.4c-8.2-0.5-15.2,5.8-15.6,14c-0.5,8.2,5.8,15.2,14,15.6c8.2,0.4,15.2-5.8,15.6-14
C202,267.9,195.7,260.8,187.5,260.4C187.5,260.4,187.5,260.4,187.5,260.4z"/>
<path class="st0" d="M248.2,276.4c-6.2,3.2-8.7,10.8-5.5,17c3.2,6.2,10.8,8.7,17,5.5c6.2-3.1,8.7-10.7,5.6-16.9
C262.1,275.8,254.5,273.2,248.2,276.4C248.2,276.4,248.2,276.4,248.2,276.4z"/>
</g>
</g>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Cardano</span>
<span class="text-xs text-gray-500">ADA</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$0.245322</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.3%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.3%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-green-500">6.4%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$100,329,073</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$8,551,032,069</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-9"></div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<button type="button" class="flex items-center gap-x-2">
<svg class="flex-shrink-0 w-4 h-4 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
<span class="text-sm text-gray-800 dark:text-gray-200">10</span>
</button>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="flex items-center gap-x-3">
<svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 38.4 33.5" style="enable-background:new 0 0 38.4 33.5;" xml:space="preserve">
<style type="text/css">
.st0{fill:#8247E5;}
</style>
<g>
<path class="st0" d="M29,10.2c-0.7-0.4-1.6-0.4-2.4,0L21,13.5l-3.8,2.1l-5.5,3.3c-0.7,0.4-1.6,0.4-2.4,0L5,16.3
c-0.7-0.4-1.2-1.2-1.2-2.1v-5c0-0.8,0.4-1.6,1.2-2.1l4.3-2.5c0.7-0.4,1.6-0.4,2.4,0L16,7.2c0.7,0.4,1.2,1.2,1.2,2.1v3.3l3.8-2.2V7
c0-0.8-0.4-1.6-1.2-2.1l-8-4.7c-0.7-0.4-1.6-0.4-2.4,0L1.2,5C0.4,5.4,0,6.2,0,7v9.4c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7
c0.7,0.4,1.6,0.4,2.4,0l5.5-3.2l3.8-2.2l5.5-3.2c0.7-0.4,1.6-0.4,2.4,0l4.3,2.5c0.7,0.4,1.2,1.2,1.2,2.1v5c0,0.8-0.4,1.6-1.2,2.1
L29,28.8c-0.7,0.4-1.6,0.4-2.4,0l-4.3-2.5c-0.7-0.4-1.2-1.2-1.2-2.1V21l-3.8,2.2v3.3c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7
c0.7,0.4,1.6,0.4,2.4,0l8.1-4.7c0.7-0.4,1.2-1.2,1.2-2.1V17c0-0.8-0.4-1.6-1.2-2.1L29,10.2z"/>
</g>
</svg>
<span class="font-semibold text-sm text-gray-800 dark:text-white">Polygon</span>
<span class="text-xs text-gray-500">MATIC</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$0.058460</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-red-500">-0.1%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-green-500">0.9%</span>
</td>
<td class="h-px w-72 whitespace-nowrap">
<span class="text-sm text-red-500">-5.0%</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$181,045,590</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<span class="text-sm text-gray-800 dark:text-white">$8,258,820,867</span>
</td>
<td class="h-px w-px whitespace-nowrap px-6 py-3">
<div class="inline-block">
<div id="hs-sparklines-line-chart-10"></div>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->
<!-- Lodash -->
<script src="../assets/vendor/lodash/lodash.min.js"></script>
<!-- Apex Charts -->
<script src="../assets/vendor/apexcharts/dist/apexcharts.min.js"></script>
<script src="../assets/js/hs-apexcharts-helpers.js"></script>
<script>
// INITIALIZATION OF CHARTS
// =======================================================
window.addEventListener('load', () => {
// Apex Lines Chart
(function () {
const lineCharts = [
{
id: '#hs-sparklines-line-chart-1',
data: [21,20,24,20,18,17,11,17,18,30,31,30,30,35,25,35,35,40,60,90,90]
}, {
id: '#hs-sparklines-line-chart-2',
data: [21,20,24,20,18,27,25,27,30,30,35,25,18,30,31,35,35,90,90,90,85]
}, {
id: '#hs-sparklines-line-chart-3',
data: [25,48,10,11,11,15,60,60,60,75,21,20,24,20,38,37,35,37,30,120,120]
}, {
id: '#hs-sparklines-line-chart-4',
data: [21,20,24,45,47,30,30,35,35,35,40,60,42,90,90,85,70,75,43,75,90]
}, {
id: '#hs-sparklines-line-chart-5',
data: [21,20,24,20,18,17,11,17,18,30,31,30,30,35,25,35,35,40,60,90,90]
}, {
id: '#hs-sparklines-line-chart-6',
data: [21,20,24,20,18,27,25,27,30,30,35,25,18,30,31,35,35,90,90,90,85]
}, {
id: '#hs-sparklines-line-chart-7',
data: [25,48,10,11,11,15,60,60,60,75,21,20,24,20,38,37,35,37,30,120,120]
}, {
id: '#hs-sparklines-line-chart-8',
data: [21,20,24,45,47,30,30,35,35,35,40,60,42,90,90,85,70,75,43,75,90]
}, {
id: '#hs-sparklines-line-chart-9',
data: [21,20,24,20,18,27,25,27,30,30,35,25,18,30,31,35,35,90,90,90,85]
}, {
id: '#hs-sparklines-line-chart-10',
data: [25,48,10,11,11,15,60,60,60,75,21,20,24,20,38,37,35,37,30,120,120]
}
];
lineCharts.forEach(({id, data}) => {
buildChart(id, (mode) => ({
series: [{
name: 'Sales',
data
}],
chart: {
width: 100,
height: 30,
type: 'line',
sparkline: {
enabled: true
}
},
stroke: {
curve: 'straight',
width: 2
},
xaxis: {
type: 'category',
categories: [
'25 January 2023',
'26 January 2023',
'27 January 2023',
'28 January 2023',
'29 January 2023',
'30 January 2023',
'31 January 2023',
'1 February 2023',
'2 February 2023',
'3 February 2023',
'4 February 2023',
'5 February 2023',
'6 February 2023',
'25 January 2023',
'26 January 2023',
'27 January 2023',
'28 January 2023',
'29 January 2023',
'30 January 2023',
'31 January 2023',
'1 February 2023'
],
crosshairs: {
show: false
}
},
markers: {
hover: {
size: 0
}
},
tooltip: {
marker: {
show: false
},
fixed: {
enabled: true,
position: 'bottomLeft',
offsetX: 10,
offsetY: -15,
},
custom: function (props) {
const { categories } = props.ctx.opts.xaxis;
const { dataPointIndex } = props;
const title = categories[dataPointIndex].split(' ');
const newTitle = `${title[0]} ${title[1]}`;
return buildTooltip(props, {
title: newTitle,
mode,
hasTextLabel: true,
wrapperExtClasses: 'min-w-[120px]',
titleExtClasses: 'text-left',
labelDivider: ':',
labelExtClasses: 'ms-2'
});
}
}
}), {
colors: ['#3b82f6']
}, {
colors: ['#3b82f6']
});
});
})();
});
</script>
Users
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-b border-gray-200 dark:border-gray-700">
<div>
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
Users
</h2>
<p class="text-sm text-gray-600 dark:text-gray-400">
Add users, edit and more.
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
View all
</a>
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-3 h-3" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M2.63452 7.50001L13.6345 7.5M8.13452 13V2" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
</svg>
Add user
</a>
</div>
</div>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-800">
<tr>
<th scope="col" class="ps-6 py-3 text-start">
<label for="hs-at-with-checkboxes-main" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-main">
<span class="sr-only">Checkbox</span>
</label>
</th>
<th scope="col" class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Name
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Position
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Status
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Portfolio
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Created
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-end"></th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-1" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-1">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Christina Bersh</span>
<span class="block text-sm text-gray-500">christina@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Director</span>
<span class="block text-sm text-gray-500">Human resources</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Active
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">1/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">28 Dec, 12:12</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-2" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-2">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">David Harrison</span>
<span class="block text-sm text-gray-500">david@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Seller</span>
<span class="block text-sm text-gray-500">Branding products</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-yellow-100 text-yellow-800 rounded-full dark:bg-yellow-500/10 dark:text-yellow-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
</svg>
Warning
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">3/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 78%" aria-valuenow="78" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">20 Dec, 09:27</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-3" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-3">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<span class="inline-flex items-center justify-center h-[2.375rem] w-[2.375rem] rounded-full bg-gray-300 dark:bg-gray-700">
<span class="font-medium text-gray-800 leading-none dark:text-gray-200">A</span>
</span>
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Anne Richard</span>
<span class="block text-sm text-gray-500">anne@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Designer</span>
<span class="block text-sm text-gray-500">IT department</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Active
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">5/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">18 Dec, 15:20</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-4" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-4">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&&auto=format&fit=facearea&facepad=3&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Samia Kartoon</span>
<span class="block text-sm text-gray-500">samia@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Executive director</span>
<span class="block text-sm text-gray-500">Marketing</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Active
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">0/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 1%" aria-valuenow="1" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">18 Dec, 15:20</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-5" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-5">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<span class="inline-flex items-center justify-center h-[2.375rem] w-[2.375rem] rounded-full bg-gray-300 dark:bg-gray-700">
<span class="font-medium text-gray-800 leading-none dark:text-gray-200">D</span>
</span>
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">David Harrison</span>
<span class="block text-sm text-gray-500">david@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Developer</span>
<span class="block text-sm text-gray-500">Mobile app</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-red-100 text-red-800 rounded-full dark:bg-red-500/10 dark:text-red-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
</svg>
Danger
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">3/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 78%" aria-valuenow="78" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">15 Dec, 14:41</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-6" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-6">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 lg:ps-3 xl:ps-0 pe-6 py-3">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1492562080023-ab3db95bfbce?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Brian Halligan</span>
<span class="block text-sm text-gray-500">brian@site.com</span>
</div>
</div>
</div>
</td>
<td class="h-px w-72 whitespace-nowrap">
<div class="px-6 py-3">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Accountant</span>
<span class="block text-sm text-gray-500">Finance</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Active
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-3">
<span class="text-xs text-gray-500">2/5</span>
<div class="flex w-full h-1.5 bg-gray-200 rounded-full overflow-hidden dark:bg-gray-700">
<div class="flex flex-col justify-center overflow-hidden bg-gray-800 dark:bg-gray-200" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-500">11 Dec, 18:51</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<a class="inline-flex items-center gap-x-1 text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Edit
</a>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
<!-- Footer -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-t border-gray-200 dark:border-gray-700">
<div>
<p class="text-sm text-gray-600 dark:text-gray-400">
<span class="font-semibold text-gray-800 dark:text-gray-200">6</span> results
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
Prev
</button>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Next
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
</div>
</div>
<!-- End Footer -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->
Products Review
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-b border-gray-200 dark:border-gray-700">
<!-- Input -->
<div class="sm:col-span-1">
<label for="hs-as-table-product-review-search" class="sr-only">Search</label>
<div class="relative">
<input type="text" id="hs-as-table-product-review-search" name="hs-as-table-product-review-search" class="py-2 px-3 ps-11 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" placeholder="Search">
<div class="absolute inset-y-0 start-0 flex items-center pointer-events-none ps-4">
<svg class="h-4 w-4 text-gray-400" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg>
</div>
</div>
</div>
<!-- End Input -->
<div class="sm:col-span-2 md:grow">
<div class="flex justify-end gap-x-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-as-table-table-export-dropdown" type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-3 h-3" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
<path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
</svg>
Export
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[12rem] z-10 bg-white shadow-md rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-as-table-table-export-dropdown">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Options
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
<path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
</svg>
Copy
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M2.5 8a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1z"/>
<path d="M5 1a2 2 0 0 0-2 2v2H2a2 2 0 0 0-2 2v3a2 2 0 0 0 2 2h1v1a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-1h1a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-1V3a2 2 0 0 0-2-2H5zM4 3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2H4V3zm1 5a2 2 0 0 0-2 2v1H2a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1v-1a2 2 0 0 0-2-2H5zm7 2v3a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"/>
</svg>
Print
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Download options
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M5.884 6.68a.5.5 0 1 0-.768.64L7.349 10l-2.233 2.68a.5.5 0 0 0 .768.64L8 10.781l2.116 2.54a.5.5 0 0 0 .768-.641L8.651 10l2.233-2.68a.5.5 0 0 0-.768-.64L8 9.219l-2.116-2.54z"/>
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
</svg>
Excel
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M14 4.5V14a2 2 0 0 1-2 2h-1v-1h1a1 1 0 0 0 1-1V4.5h-2A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v9H2V2a2 2 0 0 1 2-2h5.5L14 4.5ZM3.517 14.841a1.13 1.13 0 0 0 .401.823c.13.108.289.192.478.252.19.061.411.091.665.091.338 0 .624-.053.859-.158.236-.105.416-.252.539-.44.125-.189.187-.408.187-.656 0-.224-.045-.41-.134-.56a1.001 1.001 0 0 0-.375-.357 2.027 2.027 0 0 0-.566-.21l-.621-.144a.97.97 0 0 1-.404-.176.37.37 0 0 1-.144-.299c0-.156.062-.284.185-.384.125-.101.296-.152.512-.152.143 0 .266.023.37.068a.624.624 0 0 1 .246.181.56.56 0 0 1 .12.258h.75a1.092 1.092 0 0 0-.2-.566 1.21 1.21 0 0 0-.5-.41 1.813 1.813 0 0 0-.78-.152c-.293 0-.551.05-.776.15-.225.099-.4.24-.527.421-.127.182-.19.395-.19.639 0 .201.04.376.122.524.082.149.2.27.352.367.152.095.332.167.539.213l.618.144c.207.049.361.113.463.193a.387.387 0 0 1 .152.326.505.505 0 0 1-.085.29.559.559 0 0 1-.255.193c-.111.047-.249.07-.413.07-.117 0-.223-.013-.32-.04a.838.838 0 0 1-.248-.115.578.578 0 0 1-.255-.384h-.765ZM.806 13.693c0-.248.034-.46.102-.633a.868.868 0 0 1 .302-.399.814.814 0 0 1 .475-.137c.15 0 .283.032.398.097a.7.7 0 0 1 .272.26.85.85 0 0 1 .12.381h.765v-.072a1.33 1.33 0 0 0-.466-.964 1.441 1.441 0 0 0-.489-.272 1.838 1.838 0 0 0-.606-.097c-.356 0-.66.074-.911.223-.25.148-.44.359-.572.632-.13.274-.196.6-.196.979v.498c0 .379.064.704.193.976.131.271.322.48.572.626.25.145.554.217.914.217.293 0 .554-.055.785-.164.23-.11.414-.26.55-.454a1.27 1.27 0 0 0 .226-.674v-.076h-.764a.799.799 0 0 1-.118.363.7.7 0 0 1-.272.25.874.874 0 0 1-.401.087.845.845 0 0 1-.478-.132.833.833 0 0 1-.299-.392 1.699 1.699 0 0 1-.102-.627v-.495Zm8.239 2.238h-.953l-1.338-3.999h.917l.896 3.138h.038l.888-3.138h.879l-1.327 4Z"/>
</svg>
.CSV
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
<path d="M4.603 14.087a.81.81 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.68 7.68 0 0 1 1.482-.645 19.697 19.697 0 0 0 1.062-2.227 7.269 7.269 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.65-.823.192-.077.4-.12.602-.077a.7.7 0 0 1 .477.365c.088.164.12.356.127.538.007.188-.012.396-.047.614-.084.51-.27 1.134-.52 1.794a10.954 10.954 0 0 0 .98 1.686 5.753 5.753 0 0 1 1.334.05c.364.066.734.195.96.465.12.144.193.32.2.518.007.192-.047.382-.138.563a1.04 1.04 0 0 1-.354.416.856.856 0 0 1-.51.138c-.331-.014-.654-.196-.933-.417a5.712 5.712 0 0 1-.911-.95 11.651 11.651 0 0 0-1.997.406 11.307 11.307 0 0 1-1.02 1.51c-.292.35-.609.656-.927.787a.793.793 0 0 1-.58.029zm1.379-1.901c-.166.076-.32.156-.459.238-.328.194-.541.383-.647.547-.094.145-.096.25-.04.361.01.022.02.036.026.044a.266.266 0 0 0 .035-.012c.137-.056.355-.235.635-.572a8.18 8.18 0 0 0 .45-.606zm1.64-1.33a12.71 12.71 0 0 1 1.01-.193 11.744 11.744 0 0 1-.51-.858 20.801 20.801 0 0 1-.5 1.05zm2.446.45c.15.163.296.3.435.41.24.19.407.253.498.256a.107.107 0 0 0 .07-.015.307.307 0 0 0 .094-.125.436.436 0 0 0 .059-.2.095.095 0 0 0-.026-.063c-.052-.062-.2-.152-.518-.209a3.876 3.876 0 0 0-.612-.053zM8.078 7.8a6.7 6.7 0 0 0 .2-.828c.031-.188.043-.343.038-.465a.613.613 0 0 0-.032-.198.517.517 0 0 0-.145.04c-.087.035-.158.106-.196.283-.04.192-.03.469.046.822.024.111.054.227.09.346z"/>
</svg>
.PDF
</a>
</div>
</div>
</div>
<div class="hs-dropdown relative inline-block [--placement:bottom-right]" data-hs-dropdown-auto-close="inside">
<button id="hs-as-table-table-filter-dropdown" type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M7 12h10"/><path d="M10 18h4"/></svg>
Filter
<span class="ps-2 text-xs font-semibold text-blue-600 border-s border-gray-200 dark:border-gray-700 dark:text-blue-500">
1
</span>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[12rem] z-10 bg-white shadow-md rounded-lg mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-as-table-table-filter-dropdown">
<div class="divide-y divide-gray-200 dark:divide-gray-700">
<label for="hs-as-filters-dropdown-all" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-all" checked>
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">All</span>
</label>
<label for="hs-as-filters-dropdown-published" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-published">
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Published</span>
</label>
<label for="hs-as-filters-dropdown-pending" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-pending">
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Pending</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-800">
<tr>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Product
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Reviewer
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Review
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Date
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Status
</span>
</div>
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-4">
<img class="flex-shrink-0 h-[2.375rem] w-[2.375rem] rounded-lg" src="https://images.unsplash.com/photo-1572307480813-ceb0e59d8325?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=320&h=320&q=80" alt="Image Description">
<div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Brown Hat</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Christina Bersh</span>
<span class="block text-sm text-gray-500">christina@site.com</span>
</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem] align-top">
<a class="block p-6" href="#">
<div class="flex gap-x-1 mb-2">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">I just love it!</span>
<span class="block text-sm text-gray-500">I bought this hat for my boyfriend, but then i found out he cheated on me so I kept it and I love it!! I wear it all the time and there is no problem with the fit even though its a mens" hat.</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="text-sm text-gray-600 dark:text-gray-400">10 Jan 2022</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Published
</span>
</a>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-4">
<img class="flex-shrink-0 h-[2.375rem] w-[2.375rem] rounded-lg" src="https://images.unsplash.com/photo-1523381294911-8d3cead13475?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=320&h=320&q=80" alt="Image Description">
<div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Calvin Klein T-shirts</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">David Harrison</span>
<span class="block text-sm text-gray-500">david@site.com</span>
</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem] align-top">
<a class="block p-6" href="#">
<div class="flex gap-x-1 mb-2">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Really nice</span>
<span class="block text-sm text-gray-500">Material is great and very comfortable and stylish.</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="text-sm text-gray-600 dark:text-gray-400">04 Aug 2020</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-red-100 text-red-800 rounded-full dark:bg-red-500/10 dark:text-red-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
</svg>
Rejected
</span>
</a>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-4">
<img class="flex-shrink-0 h-[2.375rem] w-[2.375rem] rounded-lg" src="https://images.unsplash.com/photo-1626947346165-4c2288dadc2a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=320&h=320&q=80" alt="Image Description">
<div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Clarks shoes</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-3">
<span class="inline-flex items-center justify-center h-[2.375rem] w-[2.375rem] rounded-full bg-gray-300 dark:bg-gray-700">
<span class="font-medium text-gray-800 leading-none dark:text-gray-200">A</span>
</span>
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Anne Richard</span>
<span class="block text-sm text-gray-500">anne@site.com</span>
</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem] align-top">
<a class="block p-6" href="#">
<div class="flex gap-x-1 mb-2">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Good product</span>
<span class="block text-sm text-gray-500">A really well built shoe. It looks great and wears just as well. A great staple in ball caps.</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="text-sm text-gray-600 dark:text-gray-400">June 18 2022</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Published
</span>
</a>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-4">
<img class="flex-shrink-0 h-[2.375rem] w-[2.375rem] rounded-lg" src="https://images.unsplash.com/photo-1598554747436-c9293d6a588f?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=320&h=320&q=80" alt="Image Description">
<div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Levis women's jeans</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-3">
<img class="inline-block h-[2.375rem] w-[2.375rem] rounded-full" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&&auto=format&fit=facearea&facepad=3&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Samia Kartoon</span>
<span class="block text-sm text-gray-500">samia@site.com</span>
</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem] align-top">
<a class="block p-6" href="#">
<div class="flex gap-x-1 mb-2">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Buy the product, you will not regret it!</span>
<span class="block text-sm text-gray-500">Don't let this merchandise get away! It's a must buy and you will look good in it while working out.</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="text-sm text-gray-600 dark:text-gray-400">10 Jan 2022</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Published
</span>
</a>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-4">
<img class="flex-shrink-0 h-[2.375rem] w-[2.375rem] rounded-lg" src="https://images.unsplash.com/photo-1594032194509-0056023973b2?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=320&h=320&q=80" alt="Image Description">
<div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Asos T-shirts</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<div class="flex items-center gap-x-3">
<span class="inline-flex items-center justify-center h-[2.375rem] w-[2.375rem] rounded-full bg-gray-300 dark:bg-gray-700">
<span class="font-medium text-gray-800 leading-none dark:text-gray-200">D</span>
</span>
<div class="grow">
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">David Harrison</span>
<span class="block text-sm text-gray-500">david@site.com</span>
</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem] align-top">
<a class="block p-6" href="#">
<div class="flex gap-x-1 mb-2">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
<span class="block text-sm font-semibold text-gray-800 dark:text-gray-200">Ready for the heat!</span>
<span class="block text-sm text-gray-500">As good as the heat Rdy T-shirt but without the sleeves. Love the stripes on the back.</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="text-sm text-gray-600 dark:text-gray-400">07 May 2022</span>
</a>
</td>
<td class="h-px w-px whitespace-nowrap align-top">
<a class="block p-6" href="#">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Published
</span>
</a>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
<!-- Footer -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-t border-gray-200 dark:border-gray-700">
<div class="max-w-sm space-y-3">
<select class="py-2 px-3 pe-9 block border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option selected>5</option>
<option>6</option>
</select>
</div>
<div>
<div class="inline-flex gap-x-2">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
Prev
</button>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Next
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
</div>
</div>
<!-- End Footer -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->
Teams
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-b border-gray-200 dark:border-gray-700">
<div>
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
Teams
</h2>
<p class="text-sm text-gray-600 dark:text-gray-400">
Create teams, edit, download and more.
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-as-table-table-export-dropdown" type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/></svg>
Export
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[12rem] z-20 bg-white shadow-md rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-as-table-table-export-dropdown">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Options
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
Copy
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 6 2 18 2 18 9"/><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><rect width="12" height="8" x="6" y="14"/></svg>
Print
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Download options
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M5.884 6.68a.5.5 0 1 0-.768.64L7.349 10l-2.233 2.68a.5.5 0 0 0 .768.64L8 10.781l2.116 2.54a.5.5 0 0 0 .768-.641L8.651 10l2.233-2.68a.5.5 0 0 0-.768-.64L8 9.219l-2.116-2.54z"/>
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
</svg>
Excel
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M14 4.5V14a2 2 0 0 1-2 2h-1v-1h1a1 1 0 0 0 1-1V4.5h-2A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v9H2V2a2 2 0 0 1 2-2h5.5L14 4.5ZM3.517 14.841a1.13 1.13 0 0 0 .401.823c.13.108.289.192.478.252.19.061.411.091.665.091.338 0 .624-.053.859-.158.236-.105.416-.252.539-.44.125-.189.187-.408.187-.656 0-.224-.045-.41-.134-.56a1.001 1.001 0 0 0-.375-.357 2.027 2.027 0 0 0-.566-.21l-.621-.144a.97.97 0 0 1-.404-.176.37.37 0 0 1-.144-.299c0-.156.062-.284.185-.384.125-.101.296-.152.512-.152.143 0 .266.023.37.068a.624.624 0 0 1 .246.181.56.56 0 0 1 .12.258h.75a1.092 1.092 0 0 0-.2-.566 1.21 1.21 0 0 0-.5-.41 1.813 1.813 0 0 0-.78-.152c-.293 0-.551.05-.776.15-.225.099-.4.24-.527.421-.127.182-.19.395-.19.639 0 .201.04.376.122.524.082.149.2.27.352.367.152.095.332.167.539.213l.618.144c.207.049.361.113.463.193a.387.387 0 0 1 .152.326.505.505 0 0 1-.085.29.559.559 0 0 1-.255.193c-.111.047-.249.07-.413.07-.117 0-.223-.013-.32-.04a.838.838 0 0 1-.248-.115.578.578 0 0 1-.255-.384h-.765ZM.806 13.693c0-.248.034-.46.102-.633a.868.868 0 0 1 .302-.399.814.814 0 0 1 .475-.137c.15 0 .283.032.398.097a.7.7 0 0 1 .272.26.85.85 0 0 1 .12.381h.765v-.072a1.33 1.33 0 0 0-.466-.964 1.441 1.441 0 0 0-.489-.272 1.838 1.838 0 0 0-.606-.097c-.356 0-.66.074-.911.223-.25.148-.44.359-.572.632-.13.274-.196.6-.196.979v.498c0 .379.064.704.193.976.131.271.322.48.572.626.25.145.554.217.914.217.293 0 .554-.055.785-.164.23-.11.414-.26.55-.454a1.27 1.27 0 0 0 .226-.674v-.076h-.764a.799.799 0 0 1-.118.363.7.7 0 0 1-.272.25.874.874 0 0 1-.401.087.845.845 0 0 1-.478-.132.833.833 0 0 1-.299-.392 1.699 1.699 0 0 1-.102-.627v-.495Zm8.239 2.238h-.953l-1.338-3.999h.917l.896 3.138h.038l.888-3.138h.879l-1.327 4Z"/>
</svg>
.CSV
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
<path d="M4.603 14.087a.81.81 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.68 7.68 0 0 1 1.482-.645 19.697 19.697 0 0 0 1.062-2.227 7.269 7.269 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.65-.823.192-.077.4-.12.602-.077a.7.7 0 0 1 .477.365c.088.164.12.356.127.538.007.188-.012.396-.047.614-.084.51-.27 1.134-.52 1.794a10.954 10.954 0 0 0 .98 1.686 5.753 5.753 0 0 1 1.334.05c.364.066.734.195.96.465.12.144.193.32.2.518.007.192-.047.382-.138.563a1.04 1.04 0 0 1-.354.416.856.856 0 0 1-.51.138c-.331-.014-.654-.196-.933-.417a5.712 5.712 0 0 1-.911-.95 11.651 11.651 0 0 0-1.997.406 11.307 11.307 0 0 1-1.02 1.51c-.292.35-.609.656-.927.787a.793.793 0 0 1-.58.029zm1.379-1.901c-.166.076-.32.156-.459.238-.328.194-.541.383-.647.547-.094.145-.096.25-.04.361.01.022.02.036.026.044a.266.266 0 0 0 .035-.012c.137-.056.355-.235.635-.572a8.18 8.18 0 0 0 .45-.606zm1.64-1.33a12.71 12.71 0 0 1 1.01-.193 11.744 11.744 0 0 1-.51-.858 20.801 20.801 0 0 1-.5 1.05zm2.446.45c.15.163.296.3.435.41.24.19.407.253.498.256a.107.107 0 0 0 .07-.015.307.307 0 0 0 .094-.125.436.436 0 0 0 .059-.2.095.095 0 0 0-.026-.063c-.052-.062-.2-.152-.518-.209a3.876 3.876 0 0 0-.612-.053zM8.078 7.8a6.7 6.7 0 0 0 .2-.828c.031-.188.043-.343.038-.465a.613.613 0 0 0-.032-.198.517.517 0 0 0-.145.04c-.087.035-.158.106-.196.283-.04.192-.03.469.046.822.024.111.054.227.09.346z"/>
</svg>
.PDF
</a>
</div>
</div>
</div>
<div class="hs-dropdown relative inline-block [--placement:bottom-right]" data-hs-dropdown-auto-close="inside">
<button id="hs-as-table-table-filter-dropdown" type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M7 12h10"/><path d="M10 18h4"/></svg>
Filter
<span class="inline-flex items-center gap-1.5 py-0.5 px-1.5 rounded-full text-xs font-medium border border-gray-300 text-gray-800 dark:border-gray-700 dark:text-gray-300">
2
</span>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[12rem] z-20 bg-white shadow-md rounded-lg mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-as-table-table-filter-dropdown">
<div class="divide-y divide-gray-200 dark:divide-gray-700">
<label for="hs-as-filters-dropdown-frequency" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-frequency" checked>
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Frequency</span>
</label>
<label for="hs-as-filters-dropdown-status" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-status" checked>
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Status</span>
</label>
<label for="hs-as-filters-dropdown-created" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-created">
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Created</span>
</label>
<label for="hs-as-filters-dropdown-due-date" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-due-date">
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Due Date</span>
</label>
<label for="hs-as-filters-dropdown-amount" class="flex py-2.5 px-3">
<input type="checkbox" class="shrink-0 mt-0.5 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-as-filters-dropdown-amount">
<span class="ms-3 text-sm text-gray-800 dark:text-gray-200">Amount</span>
</label>
</div>
</div>
</div>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Download all
</button>
</div>
</div>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-800">
<tr>
<th scope="col" class="px-6 py-3 text-start">
<a class="group inline-flex items-center gap-x-2" href="#">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Team
</span>
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</a>
</th>
<th scope="col" class="px-6 py-3 text-start">
<a class="group inline-flex items-center gap-x-2" href="#">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Description
</span>
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</a>
</th>
<th scope="col" class="px-6 py-3 text-start">
<a class="group inline-flex items-center gap-x-2" href="#">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Industry
</span>
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</a>
</th>
<th scope="col" class="px-6 py-3 text-start">
<a class="group inline-flex items-center gap-x-2" href="#">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Rated
</span>
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</a>
</th>
<th scope="col" class="px-6 py-3 text-start">
<a class="group inline-flex items-center gap-x-2" href="#">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Members
</span>
<svg class="flex-shrink-0 w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m7 15 5 5 5-5"/><path d="m7 9 5-5 5 5"/></svg>
</a>
</th>
<th scope="col" class="px-6 py-3 text-end"></th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#digitalmarketing</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">Our group promotes and sells products and services by leveraging online marketing tactics</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Marketing team
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-transparent" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
David Harrison
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Amanda Jr.
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&&auto=format&fit=facearea&facepad=3&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Asia Boone
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-1" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-1">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#ethereum</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">Focusing on innovative and disruptive business models</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Blockchain
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">A</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Alex Brown
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Ella Lauda
</span>
</div>
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">J</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Jeremy Johnson
</span>
</div>
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex justify-center items-center h-6 w-6 bg-gray-100 text-xs rounded-full ring-2 ring-white dark:bg-slate-500 dark:text-white dark:ring-slate-900">
<span class="font-medium leading-none">9+</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Rachel Does, Brian Halligan and 7 more
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-2" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-2">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#conference</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">Online meeting services group</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Marketing team
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M5.354 5.119 7.538.792A.516.516 0 0 1 8 .5c.183 0 .366.097.465.292l2.184 4.327 4.898.696A.537.537 0 0 1 16 6.32a.548.548 0 0 1-.17.445l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256a.52.52 0 0 1-.146.05c-.342.06-.668-.254-.6-.642l.83-4.73L.173 6.765a.55.55 0 0 1-.172-.403.58.58 0 0 1 .085-.302.513.513 0 0 1 .37-.245l4.898-.696zM8 12.027a.5.5 0 0 1 .232.056l3.686 1.894-.694-3.957a.565.565 0 0 1 .162-.505l2.907-2.77-4.052-.576a.525.525 0 0 1-.393-.288L8.001 2.223 8 2.226v9.8z"/>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">A</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Alex Brown
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Ella Lauda
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
David Harrison
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1492562080023-ab3db95bfbce?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Chris Taker
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-3" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-3">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#invoices</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">This group serves online money transfers as an electronic alternative to paper methods</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Online payment
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-transparent" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"></path>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-transparent" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"></path>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">A</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Alex Brown
</span>
</div>
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">O</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Omar Iman
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-4" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-4">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#event</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">This group serves online money transfers as an electronic alternative to paper methods</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Organize
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"></path>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M5.354 5.119 7.538.792A.516.516 0 0 1 8 .5c.183 0 .366.097.465.292l2.184 4.327 4.898.696A.537.537 0 0 1 16 6.32a.548.548 0 0 1-.17.445l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256a.52.52 0 0 1-.146.05c-.342.06-.668-.254-.6-.642l.83-4.73L.173 6.765a.55.55 0 0 1-.172-.403.58.58 0 0 1 .085-.302.513.513 0 0 1 .37-.245l4.898-.696zM8 12.027a.5.5 0 0 1 .232.056l3.686 1.894-.694-3.957a.565.565 0 0 1 .162-.505l2.907-2.77-4.052-.576a.525.525 0 0 1-.393-.288L8.001 2.223 8 2.226v9.8z"/>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">A</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Alex Brown
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Amanda Jr.
</span>
</div>
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-600 ring-2 ring-white dark:bg-slate-400 dark:ring-slate-900">
<span class="text-xs font-medium text-white leading-none">T</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Tibek Winston
</span>
</div>
<div class="hs-tooltip inline-flex">
<span class="hs-tooltip-toggle inline-flex justify-center items-center h-6 w-6 bg-gray-100 text-xs rounded-full ring-2 ring-white dark:bg-slate-500 dark:text-white dark:ring-slate-900">
<span class="font-medium leading-none">2+</span>
</span>
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Rachel Does and Brian Halligan
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-5" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-5">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="bg-white hover:bg-gray-50 dark:bg-slate-900 dark:hover:bg-slate-800">
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<div class="block text-sm text-blue-600 decoration-2 hover:underline dark:text-blue-500">#softwaretester</div>
</div>
</a>
</td>
<td class="h-px w-72 min-w-[18rem]">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<p class="text-sm text-gray-500">Software testers play a critical role in application development. They are quality assurance experts who put applications</p>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2">
<span class="inline-flex items-center gap-1.5 py-1 px-2 rounded-lg text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200">
Software
</span>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-800 dark:text-gray-200" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-transparent" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<a class="block relative z-10" href="#">
<div class="px-6 py-2 flex -space-x-2">
<div class="hs-tooltip inline-flex">
<img class="hs-tooltip-toggle inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
David Harrison
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Amanda Jr.
</span>
</div>
<div class="hs-tooltip inline-flex">
<img class="inline-block h-6 w-6 rounded-full ring-2 ring-white dark:ring-gray-800" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&&auto=format&fit=facearea&facepad=3&w=300&h=300&q=80" alt="Image Description">
<span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
Asia Boone
</span>
</div>
</div>
</a>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-6" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-20 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-6">
<div class="py-2 first:pt-0 last:pb-0">
<span class="block py-2 px-3 text-xs font-medium uppercase text-gray-400 dark:text-gray-600">
Actions
</span>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename team
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Add to favorites
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Archive team
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
<!-- Footer -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-t border-gray-200 dark:border-gray-700">
<div>
<p class="text-sm text-gray-600 dark:text-gray-400">
<span class="font-semibold text-gray-800 dark:text-gray-200">6</span> results
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
Prev
</button>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Next
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
</div>
</div>
<!-- End Footer -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->
API Keys
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-b border-gray-200 dark:border-gray-700">
<div>
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
API Keys
</h2>
<p class="text-sm text-gray-600 dark:text-gray-400">
Keys you have generated to connect with third-party clients or access the <a class="inline-flex items-center gap-x-1.5 text-blue-600 decoration-2 hover:underline font-medium" href="#">Preline API.</a>
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
View all
</a>
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
Create
</a>
</div>
</div>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-900">
<tr>
<th scope="col" class="ps-6 py-3 text-start">
<label for="hs-at-with-checkboxes-main" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-main">
<span class="sr-only">Checkbox</span>
</label>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Name
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Created by
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
API Key
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Status
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Created
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-end"></th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-1" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-1">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">Streamlab</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<img class="inline-block h-6 w-6 rounded-full" src="https://images.unsplash.com/photo-1531927557220-a9e23c1e4794?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Christina Bersh</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Successful
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">28 Dec, 12:12</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-1" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-1">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-2" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-2">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">Node</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<img class="inline-block h-6 w-6 rounded-full" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">David Harrison</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="inline-flex items-center gap-1.5 py-0.5 px-2 rounded-full text-xs font-medium bg-orange-100 text-orange-800 dark:bg-orange-900 dark:text-green-200">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"></path>
</svg>
Warning
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">20 Dec, 09:27</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-2" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-2">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-3" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-3">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">FrontMail</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<span class="inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-300 dark:bg-gray-700">
<span class="text-xs font-medium text-gray-800 leading-none dark:text-gray-200">A</span>
</span>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Anne Richard</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Successful
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">18 Dec, 15:20</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-3" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-3">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-4" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-4">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">MobileAPI</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<img class="inline-block h-6 w-6 rounded-full" src="https://images.unsplash.com/photo-1541101767792-f9b2b1c4f127?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&&auto=format&fit=facearea&facepad=3&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Samia Kartoon</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Successful
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">18 Dec, 15:20</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-4" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-4">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-5" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-5">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">RachelsKey</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<span class="inline-flex items-center justify-center h-6 w-6 rounded-full bg-gray-300 dark:bg-gray-700">
<span class="text-xs font-medium text-gray-800 leading-none dark:text-gray-200">D</span>
</span>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">David Harrison</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="inline-flex items-center gap-1.5 py-0.5 px-2 rounded-full text-xs font-medium bg-red-100 text-red-800 dark:bg-red-900 dark:text-green-200">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"></path>
</svg>
Danger
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">15 Dec, 14:41</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-5" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-5">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-3">
<label for="hs-at-with-checkboxes-6" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-6">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">Gulp</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<div class="flex items-center gap-x-2">
<img class="inline-block h-6 w-6 rounded-full" src="https://images.unsplash.com/photo-1492562080023-ab3db95bfbce?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80" alt="Image Description">
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Brian Halligan</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-xs rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Copy Key
<svg class="flex-shrink-0 h-4 w-4 text-gray-400 dark:text-gray-600" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/></svg>
</button>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="py-1 px-1.5 inline-flex items-center gap-x-1 text-xs font-medium bg-teal-100 text-teal-800 rounded-full dark:bg-teal-500/10 dark:text-teal-500">
<svg class="w-2.5 h-2.5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
Successful
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-3">
<span class="text-sm text-gray-600 dark:text-gray-400">11 Dec, 18:51</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-1.5">
<div class="hs-dropdown relative inline-block [--placement:bottom-right]">
<button id="hs-table-dropdown-6" type="button" class="hs-dropdown-toggle py-1.5 px-2 inline-flex justify-center items-center gap-2 rounded-lg text-gray-700 align-middle disabled:opacity-50 disabled:pointer-events-none focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
</button>
<div class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden mt-2 divide-y divide-gray-200 min-w-[10rem] z-10 bg-white shadow-2xl rounded-lg p-2 mt-2 dark:divide-gray-700 dark:bg-gray-800 dark:border dark:border-gray-700" aria-labelledby="hs-table-dropdown-6">
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Rename
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Regenrate Key
</a>
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
Disable
</a>
</div>
<div class="py-2 first:pt-0 last:pb-0">
<a class="flex items-center gap-x-3 py-2 px-3 rounded-lg text-sm text-red-600 hover:bg-gray-100 focus:ring-2 focus:ring-blue-500 dark:text-red-500 dark:hover:bg-gray-700" href="#">
Delete
</a>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
<!-- Footer -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-t border-gray-200 dark:border-gray-700">
<div>
<p class="text-sm text-gray-600 dark:text-gray-400">
<span class="font-semibold text-gray-800 dark:text-gray-200">6</span> results
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
Prev
</button>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Next
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
</div>
</div>
<!-- End Footer -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->
Sales
<!-- Table Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<!-- Card -->
<div class="flex flex-col">
<div class="-m-1.5 overflow-x-auto">
<div class="p-1.5 min-w-full inline-block align-middle">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden dark:bg-slate-900 dark:border-gray-700">
<!-- Header -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-b border-gray-200 dark:border-gray-700">
<div>
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
Sales
</h2>
</div>
<div>
<div class="inline-flex gap-x-2">
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-red-500 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>
Delete (2)
</a>
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
View all
</a>
<a class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
Create
</a>
</div>
</div>
</div>
<!-- End Header -->
<!-- Table -->
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-slate-900">
<tr>
<th scope="col" class="ps-6 py-3 text-start">
<label for="hs-at-with-checkboxes-main" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-main">
<span class="sr-only">Checkbox</span>
</label>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Lead
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Next Meeting
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Last Interaction
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Email
</span>
</div>
</th>
<th scope="col" class="px-6 py-3 text-start">
<div class="flex items-center gap-x-2">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-gray-200">
Rating
</span>
</div>
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 dark:divide-gray-700">
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-1" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-1" checked>
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.0355 1.75926C10.6408 1.75926 5.30597 1.49951 0.0111241 1C-0.288584 7.23393 5.50578 13.1282 12.7987 14.5668L13.9975 14.7266C14.3372 12.4289 15.9956 3.7773 16.595 1.73928C16.4152 1.75926 16.2353 1.75926 16.0355 1.75926Z" fill="#A49DFF"/>
<path d="M16.615 1.75926C16.615 1.75926 25.2266 7.9932 28.5234 16.3451C30.0419 11.3499 31.1608 6.15498 32 1C26.8051 1.49951 21.71 1.75926 16.615 1.75926Z" fill="#28289A"/>
<path d="M13.9975 14.7466L13.8177 15.9455C13.8177 15.9455 12.2592 28.4133 23.1886 31.9699C25.2266 26.8748 27.0049 21.6599 28.5234 16.3251C21.9698 15.8456 13.9975 14.7466 13.9975 14.7466Z" fill="#5ADCEE"/>
<path d="M16.6149 1.75927C16.0155 3.79729 14.3571 12.4089 14.0175 14.7466C14.0175 14.7466 21.9897 15.8456 28.5233 16.3251C25.1866 7.9932 16.6149 1.75927 16.6149 1.75927Z" fill="#7878FF"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Guideline</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 2 days</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">45 minutes ago</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
amanda@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-2" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-2" checked>
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_4132_5800)">
<path d="M16 32.0022C24.8366 32.0022 32 24.8388 32 16.0022C32 7.16569 24.8366 0.00225067 16 0.00225067C7.16344 0.00225067 0 7.16569 0 16.0022C0 24.8388 7.16344 32.0022 16 32.0022Z" fill="#1977F3"/>
<path d="M22.2281 20.6283L22.9369 16.0023H18.4998V13.0007C18.4998 11.7362 19.1185 10.5009 21.1076 10.5009H23.1259V6.56335C23.1259 6.56335 21.2943 6.2506 19.5438 6.2506C15.8897 6.2506 13.5002 8.46463 13.5002 12.4764V16.0023H9.43665V20.6283H13.5002V31.8087C14.3147 31.937 15.1495 32.0023 16 32.0023C16.8505 32.0023 17.6853 31.9347 18.4998 31.8087V20.6283H22.2281Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_4132_5800">
<rect width="32" height="32" fill="white"/>
</clipPath>
</defs>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Facebook</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">Yesterday 09:12 am</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 1 hour</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
christina@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-3" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-3">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_6173_178913)">
<path d="M16 32C7.16 32 0 24.84 0 16C0 7.16 7.16 0 16 0C24.84 0 32 7.16 32 16C32 24.84 24.84 32 16 32Z" fill="#FFE01B"/>
<path d="M11.72 19.28C11.74 19.3 11.74 19.34 11.72 19.38C11.64 19.52 11.48 19.6 11.32 19.58C11.02 19.54 10.8 19.3 10.82 19C10.82 18.8 10.86 18.62 10.92 18.42C11.02 18.18 10.92 17.92 10.72 17.78C10.6 17.7 10.44 17.68 10.3 17.7C10.16 17.72 10.04 17.82 9.96001 17.94C9.90001 18.04 9.86001 18.14 9.84001 18.24C9.84001 18.26 9.82001 18.28 9.82001 18.28C9.78001 18.4 9.70001 18.44 9.64001 18.44C9.62001 18.44 9.58001 18.42 9.56001 18.36C9.50001 18.02 9.62001 17.68 9.84001 17.42C10.04 17.2 10.32 17.1 10.62 17.14C10.92 17.18 11.2 17.38 11.32 17.66C11.46 18 11.42 18.38 11.24 18.7C11.22 18.72 11.22 18.76 11.2 18.78C11.14 18.9 11.12 19.06 11.2 19.18C11.26 19.26 11.34 19.3 11.44 19.3C11.48 19.3 11.52 19.3 11.56 19.28C11.64 19.24 11.7 19.24 11.72 19.28ZM24.94 19.6C24.92 20.22 24.78 20.82 24.56 21.4C23.44 24.1 20.76 25.6 17.56 25.5C14.58 25.42 12.04 23.84 10.94 21.26C10.24 21.24 9.56001 20.96 9.06001 20.5C8.52001 20.04 8.18001 19.4 8.10001 18.7C8.04001 18.22 8.10001 17.74 8.28001 17.28L7.66001 16.76C4.78001 14.36 13.72 4.4 16.56 6.9C16.58 6.92 17.54 7.86 17.54 7.86C17.54 7.86 18.06 7.64 18.08 7.64C20.58 6.6 22.62 7.1 22.62 8.76C22.62 9.62 22.08 10.62 21.2 11.54C21.56 11.9 21.8 12.34 21.92 12.82C22.02 13.16 22.06 13.5 22.08 13.86C22.1 14.22 22.12 15.04 22.12 15.04C22.14 15.04 22.4 15.12 22.48 15.14C23 15.26 23.46 15.48 23.86 15.82C24.08 16.02 24.2 16.3 24.26 16.58C24.32 16.96 24.22 17.34 24 17.64C24.06 17.78 24.1 17.9 24.16 18.04C24.24 18.28 24.28 18.48 24.3 18.5C24.52 18.54 24.94 18.86 24.94 19.6ZM12.34 18.12C12.14 16.86 11.3 16.42 10.72 16.38C10.58 16.38 10.44 16.38 10.28 16.42C9.26001 16.62 8.66001 17.5 8.78001 18.64C8.96001 19.7 9.82001 20.5 10.88 20.56C10.98 20.56 11.08 20.56 11.18 20.54C12.24 20.38 12.5 19.24 12.34 18.12ZM14.1 10.12C14.98 9.4 15.9 8.76 16.88 8.2C16.88 8.2 16.1 7.3 15.86 7.22C14.42 6.82 11.3 8.98 9.30001 11.84C8.50001 13 7.34001 15.04 7.90001 16.08C8.10001 16.32 8.32001 16.52 8.56001 16.72C8.92001 16.2 9.48001 15.84 10.12 15.72C10.9 13.54 12.28 11.6 14.1 10.12ZM17.22 20.1C17.3 20.44 17.56 20.72 17.9 20.8C18.08 20.86 18.24 20.92 18.44 20.94C20.72 21.34 22.86 20.02 23.34 19.7C23.38 19.68 23.4 19.7 23.38 19.74C23.36 19.76 23.34 19.78 23.34 19.8C22.76 20.56 21.18 21.44 19.12 21.44C18.22 21.44 17.32 21.12 17 20.64C16.48 19.88 16.98 18.78 17.82 18.9C17.82 18.9 18.12 18.94 18.2 18.94C19.52 19.06 20.86 18.86 22.08 18.32C23.24 17.78 23.68 17.18 23.62 16.7C23.6 16.56 23.52 16.42 23.42 16.3C23.1 16.04 22.72 15.86 22.32 15.78C22.14 15.72 22.02 15.7 21.88 15.66C21.64 15.58 21.52 15.52 21.5 15.06C21.48 14.86 21.46 14.18 21.44 13.88C21.42 13.38 21.36 12.7 20.94 12.42C20.84 12.34 20.7 12.3 20.58 12.3C20.5 12.3 20.44 12.3 20.36 12.32C20.14 12.36 19.96 12.48 19.8 12.64C19.4 13 18.88 13.18 18.34 13.14C18.04 13.12 17.74 13.08 17.38 13.06C17.32 13.06 17.24 13.06 17.18 13.04C16.22 13.06 15.44 13.78 15.32 14.74C15.12 16.16 16.14 16.88 16.44 17.32C16.48 17.38 16.52 17.44 16.52 17.52C16.52 17.6 16.48 17.68 16.42 17.72C15.6 18.64 15.3 19.92 15.62 21.12C15.66 21.26 15.7 21.4 15.76 21.54C16.5 23.28 18.82 24.1 21.08 23.36C21.38 23.26 21.66 23.14 21.94 23C22.44 22.76 22.88 22.42 23.26 22.02C23.84 21.44 24.22 20.68 24.36 19.86C24.42 19.4 24.32 19.24 24.2 19.16C24.1 19.1 24 19.08 23.88 19.1C23.82 18.74 23.72 18.4 23.58 18.08C22.94 18.56 22.2 18.94 21.42 19.16C20.48 19.42 19.52 19.52 18.54 19.48C17.92 19.42 17.5 19.24 17.34 19.76C18.28 20.08 19.28 20.18 20.28 20.06C20.3 20.06 20.34 20.08 20.34 20.1C20.34 20.12 20.32 20.14 20.3 20.16C20.22 20.14 19.06 20.68 17.22 20.1ZM13.84 11.88C14.6 11.34 15.48 10.96 16.38 10.76C17.42 10.52 18.48 10.52 19.52 10.76C19.56 10.76 19.58 10.7 19.54 10.68C19 10.4 18.42 10.24 17.8 10.22C17.78 10.22 17.76 10.2 17.76 10.18V10.16C17.86 10.04 17.96 9.92 18.08 9.84C18.1 9.82 18.1 9.8 18.08 9.8L18.06 9.78C17.32 9.86 16.62 10.1 15.98 10.52C15.96 10.52 15.94 10.52 15.94 10.52V10.5C15.98 10.32 16.06 10.14 16.16 9.96C16.16 9.94 16.16 9.92 16.14 9.92H16.12C15.22 10.42 14.42 11.08 13.76 11.86C13.74 11.88 13.74 11.9 13.76 11.9C13.8 11.9 13.82 11.9 13.84 11.88ZM19.84 16.7C19.96 16.78 20.14 16.76 20.24 16.64C20.3 16.52 20.22 16.38 20.06 16.3C19.94 16.22 19.76 16.24 19.66 16.36C19.6 16.46 19.68 16.62 19.84 16.7ZM20.34 14.88C20.38 15.08 20.46 15.28 20.58 15.44C20.7 15.42 20.84 15.42 20.96 15.44C21.04 15.22 21.04 14.98 20.98 14.76C20.88 14.34 20.76 14.1 20.52 14.14C20.26 14.18 20.24 14.48 20.34 14.88ZM20.88 15.84C20.72 15.8 20.54 15.88 20.48 16.06C20.44 16.22 20.52 16.4 20.7 16.46C20.88 16.52 21.04 16.42 21.1 16.24C21.1 16.22 21.12 16.18 21.12 16.16C21.12 16 21.02 15.86 20.88 15.84Z" fill="black"/>
<path d="M16.66 15.8C16.62 15.8 16.6 15.78 16.6 15.76C16.58 15.68 16.7 15.58 16.8 15.48C17.14 15.22 17.6 15.18 17.98 15.34C18.16 15.42 18.32 15.54 18.42 15.7C18.46 15.76 18.46 15.82 18.44 15.84C18.4 15.88 18.3 15.84 18.12 15.76C17.92 15.66 17.68 15.6 17.46 15.62C17.2 15.66 16.92 15.72 16.66 15.8ZM18.38 16.16C18.22 16 18 15.92 17.8 15.96C17.64 15.98 17.5 16.04 17.38 16.14C17.32 16.18 17.28 16.24 17.28 16.32C17.28 16.34 17.28 16.36 17.3 16.36C17.32 16.36 17.32 16.38 17.34 16.38C17.4 16.38 17.46 16.36 17.5 16.34C17.74 16.26 17.98 16.22 18.22 16.26C18.34 16.28 18.38 16.28 18.42 16.24C18.4 16.2 18.4 16.18 18.38 16.16Z" fill="black"/>
</g>
<defs>
<clipPath id="clip0_6173_178913">
<rect width="32" height="32" fill="white"/>
</clipPath>
</defs>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Mailchimp</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">Monday 12:12 pm</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 3 days</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
brian@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-4" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-4">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M27.2192 10.9088C27.0336 11.0528 23.7568 12.8992 23.7568 17.0048C23.7568 21.7536 27.9264 23.4336 28.0512 23.4752C28.032 23.5776 27.3888 25.776 25.8528 28.016C24.4832 29.9872 23.0528 31.9552 20.8768 31.9552C18.7008 31.9552 18.1408 30.6912 15.6288 30.6912C13.1808 30.6912 12.3104 31.9968 10.32 31.9968C8.3296 31.9968 6.9408 30.1728 5.344 27.9328C3.4944 25.3024 2 21.216 2 17.3376C2 11.1168 6.0448 7.8176 10.0256 7.8176C12.1408 7.8176 13.904 9.2064 15.232 9.2064C16.496 9.2064 18.4672 7.7344 20.8736 7.7344C21.7856 7.7344 25.0624 7.8176 27.2192 10.9088ZM19.7312 5.1008C20.7264 3.92 21.4304 2.2816 21.4304 0.6432C21.4304 0.416 21.4112 0.1856 21.3696 0C19.7504 0.0608 17.824 1.0784 16.6624 2.4256C15.7504 3.4624 14.8992 5.1008 14.8992 6.7616C14.8992 7.0112 14.9408 7.2608 14.96 7.3408C15.0624 7.36 15.2288 7.3824 15.3952 7.3824C16.848 7.3824 18.6752 6.4096 19.7312 5.1008Z" fill="black"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Apple</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">Wednesday 06:45 pm</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 3 days</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
jackob@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-5" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-5">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.022522 25.602H4.0222V23.0837H9.1218V25.602H13.1215V6.31556H0.022522V25.602Z" fill="#1F2E5C"/>
<path d="M20.121 0.939339C19.521 0.939339 19.0211 1.43899 19.0211 2.03856C19.0211 2.63814 19.521 3.13779 20.121 3.13779C20.7209 3.13779 21.2209 2.63814 21.2209 2.03856C21.2209 1.43899 20.7209 0.939339 20.121 0.939339Z" fill="#1F2E5C"/>
<path d="M20.121 5.99578C19.521 5.99578 19.0211 6.49543 19.0211 7.095C19.0211 7.69458 19.521 8.19423 20.121 8.19423C20.7209 8.19423 21.2209 7.69458 21.2209 7.095C21.2209 6.47544 20.7209 5.99578 20.121 5.99578Z" fill="#1F2E5C"/>
<path d="M20.121 11.0322C19.521 11.0322 19.0211 11.5319 19.0211 12.1315C19.0211 12.731 19.521 13.2307 20.121 13.2307C20.7209 13.2307 21.2209 12.731 21.2209 12.1315C21.2209 11.5319 20.7209 11.0322 20.121 11.0322Z" fill="#1F2E5C"/>
<path d="M25.2606 0.939339C24.6606 0.939339 24.1606 1.43899 24.1606 2.03856C24.1606 2.63814 24.6606 3.13779 25.2606 3.13779C25.8605 3.13779 26.3605 2.63814 26.3605 2.03856C26.3605 1.43899 25.8805 0.939339 25.2606 0.939339Z" fill="#1F2E5C"/>
<path d="M25.2606 5.99578C24.6606 5.99578 24.1606 6.49543 24.1606 7.095C24.1606 7.69458 24.6606 8.19423 25.2606 8.19423C25.8605 8.19423 26.3605 7.69458 26.3605 7.095C26.3605 6.47544 25.8805 5.99578 25.2606 5.99578Z" fill="#1F2E5C"/>
<path d="M25.2606 11.0322C24.6606 11.0322 24.1606 11.5319 24.1606 12.1315C24.1606 12.731 24.6606 13.2307 25.2606 13.2307C25.8605 13.2307 26.3605 12.731 26.3605 12.1315C26.3605 11.5319 25.8805 11.0322 25.2606 11.0322Z" fill="#1F2E5C"/>
<path d="M30.3201 0.939339C29.7202 0.939339 29.2202 1.43899 29.2202 2.03856C29.2202 2.63814 29.7202 3.13779 30.3201 3.13779C30.9201 3.13779 31.42 2.63814 31.42 2.03856C31.44 1.43899 30.9401 0.939339 30.3201 0.939339Z" fill="#1F2E5C"/>
<path d="M30.3201 5.99578C29.7202 5.99578 29.2202 6.49543 29.2202 7.095C29.2202 7.69458 29.7202 8.19423 30.3201 8.19423C30.9201 8.19423 31.42 7.69458 31.42 7.095C31.44 6.47544 30.9401 5.99578 30.3201 5.99578Z" fill="#1F2E5C"/>
<path d="M30.3201 11.0322C29.7202 11.0322 29.2202 11.5319 29.2202 12.1315C29.2202 12.731 29.7202 13.2307 30.3201 13.2307C30.9201 13.2307 31.42 12.731 31.42 12.1315C31.42 11.5319 30.9401 11.0322 30.3201 11.0322Z" fill="#1F2E5C"/>
<path d="M6.722 18.8867C3.10228 18.8068 0.102519 21.6648 0.00252728 25.2822C-0.0974652 28.8997 2.78231 31.8975 6.40202 31.9975C10.0217 32.0974 13.0215 29.2194 13.1215 25.602C13.2015 21.9845 10.3417 18.9667 6.722 18.8867ZM8.76184 27.7804H4.36219V23.4035H8.74185V27.7804H8.76184Z" fill="#DE2179"/>
<path d="M6.56204 13.1108C10.1847 13.1108 13.1215 10.1758 13.1215 6.55539C13.1215 2.93494 10.1847 0 6.56204 0C2.93934 0 0.00256348 2.93494 0.00256348 6.55539C0.00256348 10.1758 2.93934 13.1108 6.56204 13.1108Z" fill="#42BA9B"/>
<path d="M18.4811 17.6476V31.1581H32V17.6476H18.4811ZM29.2602 27.4407H21.2409V25.7619H29.2602V27.4407ZM29.2602 23.0238H21.2409V21.345H29.2602V23.0238Z" fill="#42BA9B"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Capsule</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">January 15</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 1 week</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
amanda@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-6" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-6">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 2L0 7.27424L8 12.471L15.9999 7.27424L8 2ZM23.9999 2L15.9999 7.27424L23.9999 12.471L31.9998 7.27424L23.9999 2ZM0 17.7451L8 23.0194L15.9999 17.7451L8 12.471L0 17.7451ZM23.9999 12.471L15.9999 17.7451L23.9999 23.0194L31.9998 17.7451L23.9999 12.471ZM8 24.7258L15.9999 30L23.9999 24.7258L15.9999 19.5291L8 24.7258Z" fill="#0062FF"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Dropbox</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">January 19</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 2 weeks</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
baba@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-7" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-7">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M28.6156 25.8849C28.3919 27.5493 27.2718 28.9884 25.7044 29.6283C24.9363 29.9475 24.1041 30.0444 23.2719 29.9475C22.4725 29.852 21.6716 29.5955 20.8409 29.1167C19.6895 28.4754 18.5367 27.4851 17.193 26.0131C19.3047 23.421 20.5844 21.0542 21.0647 18.9424C21.2884 17.9506 21.3212 17.0542 21.2242 16.222C21.0959 15.4227 20.8081 14.6858 20.3607 14.0461C19.3689 12.6069 17.7045 11.7747 15.8492 11.7747C13.9938 11.7747 12.3295 12.6381 11.3377 14.0461C10.8902 14.6858 10.6024 15.4227 10.4741 16.222C10.3459 17.0542 10.3787 17.9819 10.6337 18.9424C11.114 21.0542 12.4249 23.4538 14.5054 26.0444C13.193 27.5164 12.0103 28.5082 10.8574 29.1481C10.0253 29.6283 9.22585 29.8848 8.42644 29.9802C7.60169 30.0727 6.768 29.9623 5.99545 29.6611C4.42798 29.0213 3.30794 27.5806 3.08423 25.9176C2.98878 25.1183 3.0529 24.3189 3.37207 23.4225C3.46752 23.1019 3.62859 22.7827 3.78817 22.3994C4.01188 21.8879 4.2684 21.3435 4.52343 20.7992L4.55624 20.735C6.76352 15.967 9.13185 11.1036 11.5957 6.3683L11.6911 6.17591C11.9476 5.69717 12.2027 5.18413 12.4592 4.7039C12.7157 4.19234 13.0036 3.71211 13.3556 3.29601C14.0281 2.52793 14.923 2.11183 15.9148 2.11183C16.9066 2.11183 17.8029 2.52793 18.4741 3.29601C18.826 3.71211 19.1138 4.19234 19.3704 4.7039C19.6269 5.18413 19.8819 5.69568 20.1384 6.17442L20.2354 6.36681C22.6664 11.1333 25.0347 15.9968 27.242 20.7649V20.7961C27.4985 21.3077 27.7223 21.8849 27.9773 22.3964C28.1369 22.7813 28.2979 23.1004 28.3934 23.4195C28.6484 24.2533 28.7438 25.0527 28.6156 25.8849ZM15.8492 24.38C14.1221 22.2041 13.0021 20.1564 12.6173 18.4293C12.4577 17.6926 12.4249 17.0527 12.5218 16.477C12.586 15.9655 12.7784 15.5166 13.0334 15.1333C13.6419 14.2698 14.665 13.7254 15.8492 13.7254C17.0333 13.7254 18.0893 14.2384 18.665 15.1333C18.9215 15.5181 19.1124 15.9655 19.1765 16.477C19.2719 17.0527 19.2407 17.7253 19.081 18.4293C18.6978 20.125 17.5777 22.1727 15.8492 24.38ZM30.28 22.7171C30.1204 22.3338 29.9594 21.9177 29.7998 21.5658C29.5432 20.9901 29.2882 20.4457 29.063 19.9341L29.0317 19.9028C26.8244 15.1035 24.4561 10.24 21.961 5.44065L21.8655 5.24826C21.609 4.76802 21.3539 4.25648 21.0974 3.74492C20.7768 3.16924 20.4576 2.56074 19.9461 1.98506C18.9215 0.703944 17.4495 0 15.882 0C14.2817 0 12.8425 0.703944 11.7851 1.91944C11.3049 2.49512 10.9529 3.10361 10.6337 3.6793C10.3772 4.19085 10.1221 4.7024 9.86562 5.18263L9.77022 5.37354C7.30639 10.1729 4.90672 15.0364 2.69944 19.8357L2.66812 19.8998C2.44441 20.4114 2.18789 20.9558 1.93137 21.5314C1.75986 21.9103 1.60028 22.295 1.45114 22.6828C1.03503 23.867 0.906774 24.987 1.06635 26.1384C1.41833 28.5381 3.0186 30.5544 5.22588 31.4493C6.05809 31.8012 6.92162 31.9609 7.81795 31.9609C8.07447 31.9609 8.39363 31.9295 8.65014 31.8967C9.70607 31.7684 10.7933 31.418 11.8493 30.8095C13.1616 30.0742 14.4085 29.0183 15.8164 27.4821C17.2243 29.0183 18.5038 30.0742 19.7835 30.8095C20.8394 31.418 21.9267 31.7684 22.9826 31.8967C23.2391 31.9295 23.5583 31.9609 23.8148 31.9609C24.7111 31.9609 25.606 31.8012 26.4068 31.4493C28.6469 30.5529 30.2144 28.5052 30.5664 26.1384C30.8229 25.0198 30.6947 23.9013 30.28 22.7171Z" fill="#E0565B"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Airbnb</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 2 days</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">45 minutes ago</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
amanda@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-8" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-8">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16 16C13.8 16 12 14.2 12 12C12 9.8 13.78 8 16 8C18.2 8 20 9.78 20 12C20 14.22 18.22 16 16 16ZM16 0C9.38 0 4 5.38 4 12C4 18.64 9.38 24 16 24C22.62 24 28 18.64 28 12.02C28 12.02 28 12.02 28 12C28 5.38 22.64 0 16 0Z" fill="#5C54FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 24C5.8 24 4 25.78 4 28C4 30.2 5.78 32 8 32C10.2 32 12 30.22 12 28C12 25.78 10.22 24 8 24Z" fill="#5C54FF"/>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Prosperops</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">January 19</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 2 weeks</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
baba@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-gray-300 dark:text-gray-700" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
<tr>
<td class="h-px w-px whitespace-nowrap">
<div class="ps-6 py-2">
<label for="hs-at-with-checkboxes-9" class="flex">
<input type="checkbox" class="shrink-0 border-gray-300 rounded text-blue-600 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" id="hs-at-with-checkboxes-9">
<span class="sr-only">Checkbox</span>
</label>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<div class="flex items-center gap-x-2">
<svg class="inline-block h-5 w-5" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.7756 0.817807C21.0668 1.14874 21.2152 1.59531 21.5122 2.48848L28 22C25.6013 20.8608 22.9936 20.0392 20.2435 19.5959L16.0194 6.52725C15.9502 6.31342 15.7357 6.16673 15.4921 6.16673C15.2479 6.16673 15.033 6.31419 14.9644 6.52876L10.7914 19.5893C8.02853 20.0306 5.40898 20.8537 3 21.997L9.51961 2.48395H9.51964C9.81754 1.59235 9.96647 1.14655 10.2577 0.8162C10.5147 0.52457 10.8491 0.298081 11.2289 0.158314C11.6592 -7.84748e-08 12.1684 0 13.1868 0H17.8435C18.8633 0 19.3731 -6.53957e-08 19.8038 0.158646C20.1839 0.298701 20.5185 0.525645 20.7756 0.817807Z" fill="url(#paint0_linear_6174_181132)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.7702 22.5899C20.6488 23.4013 18.4105 23.9547 15.8322 23.9547C12.6678 23.9547 10.0155 23.1211 9.31169 22C9.06009 22.6425 9.00367 23.3778 9.00367 23.8476C9.00367 23.8476 8.8379 26.154 10.7339 27.7585C10.7339 26.9254 11.532 26.2503 12.5165 26.2503C14.204 26.2503 14.2021 27.4959 14.2005 28.5065C14.2005 28.5368 14.2004 28.5668 14.2004 28.5966C14.2004 30.1306 15.3084 31.4455 16.8842 32C16.6489 31.5904 16.5168 31.1303 16.5168 30.6444C16.5168 29.1814 17.5319 28.6364 18.7116 28.0033C19.6503 27.4996 20.6933 26.94 21.412 25.8173C21.787 25.2314 22 24.5606 22 23.8476C22 23.4091 21.9195 22.9866 21.7702 22.5899Z" fill="#FF5D01"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.7702 22.5899C20.6488 23.4013 18.4105 23.9547 15.8322 23.9547C12.6678 23.9547 10.0155 23.1211 9.31169 22C9.06009 22.6425 9.00367 23.3778 9.00367 23.8476C9.00367 23.8476 8.8379 26.154 10.7339 27.7585C10.7339 26.9254 11.532 26.2503 12.5165 26.2503C14.204 26.2503 14.2021 27.4959 14.2005 28.5065C14.2005 28.5368 14.2004 28.5668 14.2004 28.5966C14.2004 30.1306 15.3084 31.4455 16.8842 32C16.6489 31.5904 16.5168 31.1303 16.5168 30.6444C16.5168 29.1814 17.5319 28.6364 18.7116 28.0033C19.6503 27.4996 20.6933 26.94 21.412 25.8173C21.787 25.2314 22 24.5606 22 23.8476C22 23.4091 21.9195 22.9866 21.7702 22.5899Z" fill="url(#paint1_linear_6174_181132)"/>
<defs>
<linearGradient id="paint0_linear_6174_181132" x1="22.8116" y1="-1.03449" x2="16.6052" y2="22.2941" gradientUnits="userSpaceOnUse">
<stop stop-color="#000014"/>
<stop offset="1" stop-color="#150426"/>
</linearGradient>
<linearGradient id="paint1_linear_6174_181132" x1="26.8194" y1="15.9897" x2="21.801" y2="28.406" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF1639"/>
<stop offset="1" stop-color="#FF1639" stop-opacity="0"/>
</linearGradient>
</defs>
</svg>
<div class="grow">
<span class="text-sm text-gray-600 dark:text-gray-400">Astro</span>
</div>
</div>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">Monday 12:12 pm</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">In 3 days</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2">
<span class="text-sm text-gray-600 dark:text-gray-400">
brian@site.com
</span>
</div>
</td>
<td class="h-px w-px whitespace-nowrap">
<div class="px-6 py-2 flex gap-x-1">
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
<svg class="flex-shrink-0 w-3 h-3 text-blue-600 dark:text-blue-500" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
<!-- Footer -->
<div class="px-6 py-4 grid gap-3 md:flex md:justify-between md:items-center border-t border-gray-200 dark:border-gray-700">
<div class="inline-flex items-center gap-x-2">
<p class="text-sm text-gray-600 dark:text-gray-400">
Showing:
</p>
<div class="max-w-sm space-y-3">
<select class="py-2 px-3 pe-9 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option selected>9</option>
<option>20</option>
</select>
</div>
<p class="text-sm text-gray-600 dark:text-gray-400">
of 20
</p>
</div>
<div>
<div class="inline-flex gap-x-2">
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
Prev
</button>
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
Next
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
</div>
</div>
<!-- End Footer -->
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Table Section -->