diff --git a/src/views/orders/components/MailBox.jsx b/src/views/orders/components/MailBox.jsx
index 4332e48..afc7164 100644
--- a/src/views/orders/components/MailBox.jsx
+++ b/src/views/orders/components/MailBox.jsx
@@ -100,11 +100,8 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
     const hasAtta = item.MAI_Attachment !== 0 ? <AttachmentIcon className='text-blue-500' /> : null
     return (
       <li
-        className={`flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 active:bg-gray-200 p-2 ${props.currentActiveMailItem === item.key ? 'bg-gray-200' : ''}`}>
-        <div className='flex flex-col gap-1'>
-          <Checkbox></Checkbox>{hasAtta}
-        className='flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 p-2'>
-        <div className=''>
+        className={`flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 active:bg-gray-200 p-2 ${props.currentActiveMailItem === item.key ? 'bg-neutral-100' : ''}`}>
+          <div className=''>
           <Checkbox
           checked={selectedItems.some((i) => i.MAI_SN === item.MAI_SN)}
             onClick={e => {
@@ -117,7 +114,7 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
             console.info('selectedItems: ', updatedSelection)
             }
           }></Checkbox>
-        </div>
+          </div>
         <div className='flex-1 pl-2'
         onClick={() => {
           console.info('item: ', item)
@@ -127,6 +124,7 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
             <div>
               {orderNumber}
               <span className={mailStateClass}>{item.MAI_Subject}</span>
+              {hasAtta}
             </div>
             <span className='text-neutral-500 text-wrap break-words break-all '>{countryName + item.SenderReceiver + ' ' + item.SRDate}</span>
           </Flex>