diff --git a/src/components/Account/AccountBalancesTable/index.tsx b/src/components/Account/AccountBalancesTable/index.tsx
index 91e4a914..13c6a3a6 100644
--- a/src/components/Account/AccountBalancesTable/index.tsx
+++ b/src/components/Account/AccountBalancesTable/index.tsx
@@ -45,7 +45,6 @@ export default function Index(props: Props) {
   const navigate = useNavigate()
   const { pathname } = useLocation()
   const address = useStore((s) => s.address)
-  const baseCurrency = useStore((s) => s.baseCurrency)
   const [sorting, setSorting] = useState<SortingState>([])
   const updatedAccount = useStore((s) => s.updatedAccount)
   const accountBalanceData = useAccountBalanceData({
@@ -186,7 +185,7 @@ export default function Index(props: Props) {
 
   return (
     <table className='w-full'>
-      <thead className='border-b border-white/5'>
+      <thead className='border-b border-white/10'>
         {table.getHeaderGroups().map((headerGroup) => (
           <tr key={headerGroup.id}>
             {headerGroup.headers.map((header) => {
diff --git a/src/components/Borrow/Table/AvailableBorrowingsTable.tsx b/src/components/Borrow/Table/AvailableBorrowingsTable.tsx
index 84aac910..9ba25a86 100644
--- a/src/components/Borrow/Table/AvailableBorrowingsTable.tsx
+++ b/src/components/Borrow/Table/AvailableBorrowingsTable.tsx
@@ -1,10 +1,12 @@
 import { Row } from '@tanstack/react-table'
 import { Table as TanstackTable } from '@tanstack/table-core/build/lib/types'
-import React, { useCallback } from 'react'
+import { useCallback } from 'react'
 
+import BorrowActionButtons from 'components/Borrow/BorrowActionButtons'
 import useAvailableColumns from 'components/Borrow/Table/Columns/useAvailableColumns'
 import MarketDetails from 'components/MarketDetails'
 import Table from 'components/Table'
+import ActionButtonRow from 'components/Table/ActionButtonRow'
 
 type Props = {
   data: BorrowMarketTableData[]
@@ -15,12 +17,17 @@ export default function AvailableBorrowingsTable(props: Props) {
   const columns = useAvailableColumns({ isLoading: props.isLoading })
 
   const renderExpanded = useCallback(
-    (row: Row<BorrowMarketTableData>, _: TanstackTable<BorrowMarketTableData>) => (
-      <MarketDetails
-        row={row as Row<BorrowMarketTableData | LendingMarketTableData>}
-        type='borrow'
-      />
-    ),
+    (row: Row<BorrowMarketTableData>, _: TanstackTable<BorrowMarketTableData>) => {
+      const currentRow = row as Row<BorrowMarketTableData>
+      return (
+        <>
+          <ActionButtonRow row={currentRow}>
+            <BorrowActionButtons data={row.original} />
+          </ActionButtonRow>
+          <MarketDetails row={currentRow} type='borrow' />
+        </>
+      )
+    },
     [],
   )
 
diff --git a/src/components/Borrow/Table/DepositedBorrowingsTable.tsx b/src/components/Borrow/Table/DepositedBorrowingsTable.tsx
index b532db61..00a18cea 100644
--- a/src/components/Borrow/Table/DepositedBorrowingsTable.tsx
+++ b/src/components/Borrow/Table/DepositedBorrowingsTable.tsx
@@ -1,10 +1,11 @@
 import { Row } from '@tanstack/react-table'
-import { Table as TanStackTable } from '@tanstack/table-core/build/lib/types'
-import React, { useCallback } from 'react'
+import { useCallback } from 'react'
 
 import useDepositedColumns from 'components/Borrow/Table/Columns/useDepositedColumns'
 import MarketDetails from 'components/MarketDetails'
 import Table from 'components/Table'
+import ActionButtonRow from 'components/Table/ActionButtonRow'
+import BorrowActionButtons from 'components/Borrow/BorrowActionButtons'
 
 type Props = {
   data: BorrowMarketTableData[]
@@ -14,13 +15,17 @@ type Props = {
 export default function DepositedBorrowingsTable(props: Props) {
   const columns = useDepositedColumns({ isLoading: props.isLoading })
 
-  const renderExpanded = useCallback(
-    (
-      row: Row<BorrowMarketTableData | LendingMarketTableData>,
-      table: TanStackTable<BorrowMarketTableData>,
-    ) => <MarketDetails row={row} type='borrow' />,
-    [],
-  )
+  const renderExpanded = useCallback((row: Row<BorrowMarketTableData>) => {
+    const currentRow = row as Row<BorrowMarketTableData>
+    return (
+      <>
+        <ActionButtonRow row={currentRow}>
+          <BorrowActionButtons data={row.original} />
+        </ActionButtonRow>
+        <MarketDetails row={row} type='borrow' />
+      </>
+    )
+  }, [])
 
   if (!props.data.length) return null
 
diff --git a/src/components/Earn/Farm/VaultExpanded.tsx b/src/components/Earn/Farm/VaultExpanded.tsx
index d58d3b1a..81071fe5 100644
--- a/src/components/Earn/Farm/VaultExpanded.tsx
+++ b/src/components/Earn/Farm/VaultExpanded.tsx
@@ -105,7 +105,7 @@ export default function VaultExpanded(props: Props) {
   return (
     <tr
       key={props.row.id}
-      className='hover:cursor-pointer bg-black/20 transition-colors'
+      className='transition-colors hover:cursor-pointer bg-black/20'
       onClick={(e) => {
         e.preventDefault()
         const isExpanded = props.row.getIsExpanded()
@@ -113,7 +113,7 @@ export default function VaultExpanded(props: Props) {
         !isExpanded && props.row.toggleExpanded()
       }}
     >
-      <td colSpan={props.row.getAllCells().length}>
+      <td colSpan={props.row.getAllCells().length} className='p-0'>
         <div className='flex justify-end gap-3 p-4 align-center'>
           {status && <DepositMoreButton />}
           {status === VaultStatus.ACTIVE && <UnlockButton />}
diff --git a/src/components/Earn/Farm/VaultRow.tsx b/src/components/Earn/Farm/VaultRow.tsx
index 49fc31b3..60eaf2a9 100644
--- a/src/components/Earn/Farm/VaultRow.tsx
+++ b/src/components/Earn/Farm/VaultRow.tsx
@@ -12,9 +12,9 @@ export const VaultRow = (props: AssetRowProps) => {
     <tr
       key={props.row.id}
       className={classNames(
-        'bg-white/3 group/row border-b border-t border-white/5 transition-colors hover:bg-white/5',
+        'group/row border-t border-white/10 transition-colors hover:bg-white/5',
         vault.status && 'hover:cursor-pointer',
-        props.row.getIsExpanded() && 'is-expanded',
+        props.row.getIsExpanded() ? 'is-expanded bg-black/20' : 'border-b',
       )}
       onClick={(e) => {
         e.preventDefault()
diff --git a/src/components/Earn/Lend/Table/AvailableLendsTable.tsx b/src/components/Earn/Lend/Table/AvailableLendsTable.tsx
index f6f803f9..e776ac4f 100644
--- a/src/components/Earn/Lend/Table/AvailableLendsTable.tsx
+++ b/src/components/Earn/Lend/Table/AvailableLendsTable.tsx
@@ -1,10 +1,12 @@
 import { Row } from '@tanstack/react-table'
-import React, { useCallback } from 'react'
+import { useCallback } from 'react'
 
+import LendingActionButtons from 'components/Earn/Lend/LendingActionButtons'
 import { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
 import useAvailableColumns from 'components/Earn/Lend/Table/Columns/useAvailableColumns'
 import MarketDetails from 'components/MarketDetails'
 import Table from 'components/Table'
+import ActionButtonRow from 'components/Table/ActionButtonRow'
 
 type Props = {
   data: LendingMarketTableData[]
@@ -15,7 +17,14 @@ export default function AvailableLendsTable(props: Props) {
   const columns = useAvailableColumns({ isLoading: props.isLoading })
 
   const renderExpanded = useCallback(
-    (row: Row<LendingMarketTableData>) => <MarketDetails row={row} type='lend' />,
+    (row: Row<LendingMarketTableData>) => (
+      <>
+        <ActionButtonRow row={row}>
+          <LendingActionButtons data={row.original} />
+        </ActionButtonRow>
+        <MarketDetails row={row} type='lend' />
+      </>
+    ),
     [],
   )
 
diff --git a/src/components/Earn/Lend/Table/Columns/Apr.tsx b/src/components/Earn/Lend/Table/Columns/Apy.tsx
similarity index 62%
rename from src/components/Earn/Lend/Table/Columns/Apr.tsx
rename to src/components/Earn/Lend/Table/Columns/Apy.tsx
index 426f7c2a..11996422 100644
--- a/src/components/Earn/Lend/Table/Columns/Apr.tsx
+++ b/src/components/Earn/Lend/Table/Columns/Apy.tsx
@@ -1,10 +1,8 @@
-import React from 'react'
-
 import AssetRate from 'components/Asset/AssetRate'
 import Loading from 'components/Loading'
-import { convertLiquidityRateToAPR } from 'utils/formatters'
+import { convertAprToApy } from 'utils/parsers'
 
-export const APR_META = { accessorKey: 'marketLiquidityRate', header: 'APR' }
+export const APY_META = { accessorKey: 'marketLiquidityRate', header: 'APY' }
 
 interface Props {
   marketLiquidityRate: number
@@ -16,10 +14,10 @@ export default function Apr(props: Props) {
 
   return (
     <AssetRate
-      rate={convertLiquidityRateToAPR(props.marketLiquidityRate)}
+      rate={convertAprToApy((props.marketLiquidityRate ?? 0) * 100, 365)}
       isEnabled={props.borrowEnabled}
       className='justify-end text-xs'
-      type='apr'
+      type='apy'
       orientation='ltr'
     />
   )
diff --git a/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx b/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx
index ac7199ad..297b6c8a 100644
--- a/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx
@@ -1,7 +1,7 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apr, { APR_META } from 'components/Earn/Lend/Table/Columns/Apr'
+import Apy, { APY_META } from 'components/Earn/Lend/Table/Columns/Apy'
 import DepositCap, { DEPOSIT_CAP_META } from 'components/Earn/Lend/Table/Columns/DepositCap'
 import Manage, { MANAGE_META } from 'components/Earn/Lend/Table/Columns/Manage'
 import Name, { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
@@ -18,9 +18,9 @@ export default function useAvailableColumns(props: Props) {
         cell: ({ row }) => <Name asset={row.original.asset} />,
       },
       {
-        ...APR_META,
+        ...APY_META,
         cell: ({ row }) => (
-          <Apr
+          <Apy
             isLoading={props.isLoading}
             borrowEnabled={row.original.borrowEnabled}
             marketLiquidityRate={row.original.marketLiquidityRate}
@@ -36,5 +36,5 @@ export default function useAvailableColumns(props: Props) {
         cell: ({ row }) => <Manage isExpanded={row.getIsExpanded()} />,
       },
     ]
-  }, [])
+  }, [props.isLoading])
 }
diff --git a/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx b/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx
index 5c14cbd4..4aff3f9f 100644
--- a/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx
+++ b/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx
@@ -1,7 +1,7 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apr, { APR_META } from 'components/Earn/Lend/Table/Columns/Apr'
+import Apy, { APY_META } from 'components/Earn/Lend/Table/Columns/Apy'
 import DepositCap, { DEPOSIT_CAP_META } from 'components/Earn/Lend/Table/Columns/DepositCap'
 import DepositValue, { DEPOSIT_VALUE_META } from 'components/Earn/Lend/Table/Columns/DepositValue'
 import Manage, { MANAGE_META } from 'components/Earn/Lend/Table/Columns/Manage'
@@ -25,9 +25,9 @@ export default function useDepositedColumns(props: Props) {
         ),
       },
       {
-        ...APR_META,
+        ...APY_META,
         cell: ({ row }) => (
-          <Apr
+          <Apy
             isLoading={props.isLoading}
             borrowEnabled={row.original.borrowEnabled}
             marketLiquidityRate={row.original.marketLiquidityRate}
@@ -43,5 +43,5 @@ export default function useDepositedColumns(props: Props) {
         cell: ({ row }) => <Manage isExpanded={row.getIsExpanded()} />,
       },
     ]
-  }, [])
+  }, [props.isLoading])
 }
diff --git a/src/components/Earn/Lend/Table/DepositedLendsTable.tsx b/src/components/Earn/Lend/Table/DepositedLendsTable.tsx
index 1c41d49d..16b7a6e5 100644
--- a/src/components/Earn/Lend/Table/DepositedLendsTable.tsx
+++ b/src/components/Earn/Lend/Table/DepositedLendsTable.tsx
@@ -1,10 +1,12 @@
 import { Row } from '@tanstack/react-table'
-import React, { useCallback } from 'react'
+import { useCallback } from 'react'
 
+import LendingActionButtons from 'components/Earn/Lend/LendingActionButtons'
 import { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
 import useDepositedColumns from 'components/Earn/Lend/Table/Columns/useDepositedColumns'
 import MarketDetails from 'components/MarketDetails'
 import Table from 'components/Table'
+import ActionButtonRow from 'components/Table/ActionButtonRow'
 
 type Props = {
   data: LendingMarketTableData[]
@@ -15,7 +17,14 @@ export default function DepositedLendsTable(props: Props) {
   const columns = useDepositedColumns({ isLoading: props.isLoading })
 
   const renderExpanded = useCallback(
-    (row: Row<LendingMarketTableData>) => <MarketDetails row={row} type='borrow' />,
+    (row: Row<LendingMarketTableData>) => (
+      <>
+        <ActionButtonRow row={row}>
+          <LendingActionButtons data={row.original} />
+        </ActionButtonRow>
+        <MarketDetails row={row} type='lend' />
+      </>
+    ),
     [],
   )
 
diff --git a/src/components/MarketDetails.tsx b/src/components/MarketDetails.tsx
index 1f512b2e..219fe65f 100644
--- a/src/components/MarketDetails.tsx
+++ b/src/components/MarketDetails.tsx
@@ -120,8 +120,8 @@ export default function MarketDetails({ row, type }: Props) {
 
   return (
     <tr>
-      <td colSpan={row.getAllCells().length}>
-        <div className='flex justify-between flex-1 bg-white rounded-md bg-opacity-5'>
+      <td colSpan={row.getAllCells().length} className='p-4 border-b bg-black/20 border-white/10'>
+        <div className='flex justify-between flex-1 rounded-md bg-white/5'>
           {details.map((detail, index) => (
             <TitleAndSubCell
               key={index}
diff --git a/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx b/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
index 1365e644..361b4191 100644
--- a/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
+++ b/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
@@ -75,7 +75,7 @@ export default function AddVaultAssetsModalContent(props: Props) {
 
   return (
     <>
-      <div className='border-b border-white/5 bg-white/10 px-4 py-3'>
+      <div className='px-4 py-3 border-b border-white/5 bg-white/10'>
         <SearchBar
           value={searchString}
           placeholder={`Search for e.g. "ETH" or "Ethereum"`}
@@ -90,6 +90,7 @@ export default function AddVaultAssetsModalContent(props: Props) {
           </Text>
         </div>
         <AssetSelectTable
+          isBorrow={true}
           assets={poolAssets}
           onChangeSelected={onChangePoolDenoms}
           selectedDenoms={selectedPoolDenoms}
@@ -102,6 +103,7 @@ export default function AddVaultAssetsModalContent(props: Props) {
           </Text>
         </div>
         <AssetSelectTable
+          isBorrow={true}
           assets={stableAssets}
           onChangeSelected={onChangeOtherDenoms}
           selectedDenoms={selectedOtherDenoms}
diff --git a/src/components/Modals/AddVaultAssets/index.tsx b/src/components/Modals/AddVaultAssets/index.tsx
index df6d17ef..fb4e7e5f 100644
--- a/src/components/Modals/AddVaultAssets/index.tsx
+++ b/src/components/Modals/AddVaultAssets/index.tsx
@@ -40,7 +40,9 @@ export default function AddVaultBorrowAssetsModal() {
           onChangeBorrowDenoms={updateSelectedDenoms}
         />
       ) : (
-        <CircularProgress />
+        <div className='flex items-center justify-center w-full h-[380px]'>
+          <CircularProgress />
+        </div>
       )}
       <div className='flex w-full p-4'>
         <Button className='w-full' onClick={onClose} color='tertiary' text='Select Assets' />
diff --git a/src/components/Modals/AssetsSelect/AssetSelectTable.tsx b/src/components/Modals/AssetsSelect/AssetSelectTable.tsx
index 57641eae..5ca92f93 100644
--- a/src/components/Modals/AssetsSelect/AssetSelectTable.tsx
+++ b/src/components/Modals/AssetsSelect/AssetSelectTable.tsx
@@ -20,6 +20,7 @@ interface Props {
   assets: Asset[] | BorrowAsset[]
   selectedDenoms: string[]
   onChangeSelected: (denoms: string[]) => void
+  isBorrow: boolean
 }
 
 export default function AssetSelectTable(props: Props) {
@@ -39,7 +40,7 @@ export default function AssetSelectTable(props: Props) {
   const [sorting, setSorting] = useState<SortingState>([{ id: 'symbol', desc: false }])
   const [selected, setSelected] = useState<RowSelectionState>(defaultSelected)
   const balances = useStore((s) => s.balances)
-  const columns = useAssetTableColumns()
+  const columns = useAssetTableColumns(props.isBorrow)
   const tableData: AssetTableRow[] = useMemo(() => {
     return props.assets.map((asset) => {
       const balancesForAsset = balances.find(byDenom(asset.denom))
@@ -79,7 +80,7 @@ export default function AssetSelectTable(props: Props) {
 
   return (
     <table className='w-full'>
-      <thead className='border-b border-white/5'>
+      <thead className='border-b border-white/10'>
         {table.getHeaderGroups().map((headerGroup) => (
           <tr key={headerGroup.id}>
             {headerGroup.headers.map((header) => {
diff --git a/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx b/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx
index fc3384ef..b96e5802 100644
--- a/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx
+++ b/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx
@@ -17,7 +17,7 @@ function showBorrowRate(data: AssetTableRow[]) {
   return !!(assetData && assetData?.borrowRate)
 }
 
-export default function useAssetTableColumns() {
+export default function useAssetTableColumns(isBorrow: boolean) {
   return React.useMemo<ColumnDef<AssetTableRow>[]>(
     () => [
       {
@@ -29,6 +29,9 @@ export default function useAssetTableColumns() {
           const market = row.original.market
           const borrowAsset = row.original.asset as BorrowAsset
           const showRate = !borrowAsset?.borrowRate
+          const rate = isBorrow ? market?.borrowRate : market?.liquidityRate
+          const apy = convertAprToApy((rate ?? 0) * 100, 365)
+
           return (
             <div className='flex items-center'>
               <Checkbox checked={row.getIsSelected()} onChange={row.getToggleSelectedHandler()} />
@@ -39,7 +42,7 @@ export default function useAssetTableColumns() {
                 </Text>
                 {showRate && market ? (
                   <AssetRate
-                    rate={convertAprToApy(market.borrowRate * 100, 365)}
+                    rate={apy}
                     isEnabled={market.borrowEnabled}
                     className='text-xs'
                     type='apy'
@@ -85,6 +88,6 @@ export default function useAssetTableColumns() {
         },
       },
     ],
-    [],
+    [isBorrow],
   )
 }
diff --git a/src/components/Modals/FundWithdraw/index.tsx b/src/components/Modals/FundWithdraw/index.tsx
index f581146b..9e9d21a2 100644
--- a/src/components/Modals/FundWithdraw/index.tsx
+++ b/src/components/Modals/FundWithdraw/index.tsx
@@ -33,7 +33,9 @@ export default function FundAndWithdrawModal() {
       {modal && currentAccount ? (
         <FundWithdrawModalContent account={currentAccount} isFunding={isFunding} />
       ) : (
-        <CircularProgress />
+        <div className='flex items-center justify-center w-full h-[380px]'>
+          <CircularProgress />
+        </div>
       )}
     </Modal>
   )
diff --git a/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx b/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
index 9b420437..95309aa0 100644
--- a/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
+++ b/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
@@ -34,6 +34,7 @@ export default function WalletAssetsModalContent(props: Props) {
     )
   }, [assets, searchString])
 
+  const isBorrow = useStore((s) => s.walletAssetsModal?.isBorrow ?? false)
   const currentSelectedDenom = useStore((s) => s.walletAssetsModal?.selectedDenoms ?? [])
   const [selectedDenoms, setSelectedDenoms] = useState<string[]>(
     currentSelectedDenom.filter((denom) => filteredAssets.findIndex(byDenom(denom)) || []),
@@ -58,6 +59,7 @@ export default function WalletAssetsModalContent(props: Props) {
       </div>
       <div className='max-h-[446px] overflow-y-scroll scrollbar-hide'>
         <AssetSelectTable
+          isBorrow={isBorrow}
           assets={filteredAssets}
           onChangeSelected={onChangeSelect}
           selectedDenoms={selectedDenoms}
diff --git a/src/components/Modals/WithdrawFromVaultsModal.tsx b/src/components/Modals/WithdrawFromVaultsModal.tsx
index a9eb4436..686dee0c 100644
--- a/src/components/Modals/WithdrawFromVaultsModal.tsx
+++ b/src/components/Modals/WithdrawFromVaultsModal.tsx
@@ -88,7 +88,9 @@ export default function WithdrawFromVaultsModal() {
           <Button onClick={withdrawHandler} className='w-full mt-4' text='Withdraw from all' />
         </div>
       ) : (
-        <CircularProgress />
+        <div className='flex items-center justify-center w-full h-[380px]'>
+          <CircularProgress />
+        </div>
       )}
     </Modal>
   )
diff --git a/src/components/Table/ActionButtonRow.tsx b/src/components/Table/ActionButtonRow.tsx
new file mode 100644
index 00000000..16faf1af
--- /dev/null
+++ b/src/components/Table/ActionButtonRow.tsx
@@ -0,0 +1,25 @@
+import { Row as TanstackRow } from '@tanstack/react-table'
+import { ReactNode } from 'react'
+
+import Text from 'components/Text'
+
+interface Props<T> {
+  row: TanstackRow<T>
+  children: ReactNode
+}
+
+export default function ActionButtonRow<T>(props: Props<T>) {
+  return (
+    <tr>
+      <td
+        colSpan={props.row.getAllCells().length}
+        className='p-4 border-b border-white/10 bg-black/20'
+      >
+        <div className='flex justify-between'>
+          <Text className='flex items-center p-0 font-bold'>Details</Text>
+          {props.children}
+        </div>
+      </td>
+    </tr>
+  )
+}
diff --git a/src/components/Table/Row.tsx b/src/components/Table/Row.tsx
index 63999a32..79af29a7 100644
--- a/src/components/Table/Row.tsx
+++ b/src/components/Table/Row.tsx
@@ -15,9 +15,9 @@ export default function Row<T>(props: Props<T>) {
       <tr
         key={props.row.id}
         className={classNames(
-          'bg-white/3 group/row border-b border-t border-white/5 transition-colors hover:bg-white/5',
+          'group/row transition-bg',
           props.renderExpanded && 'hover:cursor-pointer',
-          props.row.getIsExpanded() && 'is-expanded',
+          props.row.getIsExpanded() ? 'is-expanded bg-black/20' : 'hover:bg-white/5',
         )}
         onClick={(e) => {
           e.preventDefault()
diff --git a/src/components/Table/index.tsx b/src/components/Table/index.tsx
index e2e2c16e..99145ecc 100644
--- a/src/components/Table/index.tsx
+++ b/src/components/Table/index.tsx
@@ -52,13 +52,15 @@ export default function Table<T>(props: Props<T>) {
                     className={classNames(
                       'px-4 py-3',
                       header.column.getCanSort() && 'hover:cursor-pointer',
-                      header.id === 'symbol' ? 'text-left' : 'text-right',
+                      header.id === 'symbol' || header.id === 'name' ? 'text-left' : 'text-right',
                     )}
                   >
                     <div
                       className={classNames(
                         'flex',
-                        header.id === 'name' ? 'justify-start' : 'justify-end',
+                        header.id === 'symbol' || header.id === 'name'
+                          ? 'justify-start'
+                          : 'justify-end',
                         'align-center',
                       )}
                     >
diff --git a/src/components/TableSkeleton.tsx b/src/components/TableSkeleton.tsx
index 55a83b76..68b27e8f 100644
--- a/src/components/TableSkeleton.tsx
+++ b/src/components/TableSkeleton.tsx
@@ -1,5 +1,4 @@
 import classNames from 'classnames'
-import React from 'react'
 
 import { SortNone } from 'components/Icons'
 import Loading from 'components/Loading'
@@ -13,7 +12,7 @@ interface Props {
 export default function TableSkeleton(props: Props) {
   return (
     <table className='w-full'>
-      <thead className='border-b border-white/5'>
+      <thead className='border-b border-white/10'>
         <tr>
           {props.labels.map((label, index) => {
             return (
@@ -58,7 +57,7 @@ export default function TableSkeleton(props: Props) {
                     <td
                       key={`${index}-${index2}`}
                       className={classNames(
-                        index === 0 && 'justify-end',
+                        index !== 0 && 'justify-end',
                         index2 === 0 && 'pl-4',
                         index2 === props.labels.length - 1 && 'pr-4',
                         'p-2 text-right',
diff --git a/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx b/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx
index 4a9e441c..87a082c9 100644
--- a/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx
+++ b/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx
@@ -45,7 +45,7 @@ export default function AssetAmountInput(props: Props) {
     <div className={containerClassName}>
       <label>
         {label}
-        <div className='flex flex-1 flex-row py-3 border-[1px] border-white border-opacity-20 rounded bg-white bg-opacity-5 pl-3 pr-2 mt-2'>
+        <div className='flex flex-1 flex-row py-3 border-[1px] border-white/20 rounded bg-white bg-opacity-5 pl-3 pr-2 mt-2'>
           <NumberInput
             asset={asset}
             amount={amount}
diff --git a/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx b/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
index 8a4e67a8..d694d4d7 100644
--- a/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
+++ b/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
@@ -55,7 +55,7 @@ export default function TradeSummary(props: Props) {
     <div
       className={classNames(
         containerClassName,
-        'flex flex-1 flex-col bg-white bg-opacity-5 rounded border-[1px] border-white border-opacity-20',
+        'flex flex-1 flex-col bg-white bg-opacity-5 rounded border-[1px] border-white/20',
       )}
     >
       <div className='flex flex-col flex-1 m-3'>
diff --git a/src/constants/env.ts b/src/constants/env.ts
index 616eb3cd..7ac92492 100644
--- a/src/constants/env.ts
+++ b/src/constants/env.ts
@@ -13,7 +13,6 @@ interface EnvironmentVariables {
   URL_GQL: string
   URL_REST: string
   URL_RPC: string
-  URL_API: string
   URL_VAULT_APR: string
   WALLETS: string[]
   PYTH_ENDPOINT: string
@@ -36,16 +35,9 @@ export const ENV: EnvironmentVariables = {
   URL_GQL: process.env.NEXT_PUBLIC_GQL || '',
   URL_REST: process.env.NEXT_PUBLIC_REST || '',
   URL_RPC: process.env.NEXT_PUBLIC_RPC || '',
-  URL_API: process.env.NEXT_PUBLIC_VERCEL_URL
-    ? `https://${process.env.NEXT_PUBLIC_VERCEL_URL}/api`
-    : process.env.NEXT_PUBLIC_API || '',
   URL_VAULT_APR: process.env.NEXT_PUBLIC_VAULT_APR || '',
   WALLETS: process.env.NEXT_PUBLIC_WALLETS?.split(',') || [],
   PYTH_ENDPOINT: process.env.NEXT_PUBLIC_PYTH_ENDPOINT || '',
   MAINNET_REST_API: process.env.NEXT_PUBLIC_MAINNET_REST || '',
   WALLET_CONNECT_ID: process.env.NEXT_PUBLIC_WALLET_CONNECT_ID || '',
 }
-
-export const VERCEL_BYPASS = process.env.NEXT_PUBLIC_BYPASS
-  ? `?x-vercel-protection-bypass=${process.env.NEXT_PUBLIC_BYPASS}`
-  : ''
diff --git a/src/styles/globals.css b/src/styles/globals.css
index b6f71615..46ceede1 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -57,3 +57,7 @@
 .Toastify__toast--error {
   background-color: #fda29b33 !important;
 }
+
+table tr:last-child td {
+  border-bottom-width: 0;
+}