diff --git a/packages/ui/src/components/avatar.tsx b/packages/ui/src/components/avatar.tsx
index 2563ed882b..8fc2e38395 100644
--- a/packages/ui/src/components/avatar.tsx
+++ b/packages/ui/src/components/avatar.tsx
@@ -37,7 +37,7 @@ export interface AvatarProps extends ComponentPropsWithoutRef<'span'> {
 }
 
 const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(
-  ({ name, src, size = 'md', rounded = false, className, ...props }, ref) => {
+  ({ name, src, size = 'sm', rounded = false, className, ...props }, ref) => {
     const initials = getInitials(name || '')
 
     return (
diff --git a/packages/ui/src/components/branch-tag.tsx b/packages/ui/src/components/branch-tag.tsx
index d31d69e472..96d72f5bad 100644
--- a/packages/ui/src/components/branch-tag.tsx
+++ b/packages/ui/src/components/branch-tag.tsx
@@ -1,4 +1,4 @@
-import { CopyTag, Link } from '@/components'
+import { CopyTag, Link, Tag } from '@/components'
 
 import type { TagProps } from './tag'
 
@@ -7,6 +7,7 @@ interface BranchTagProps {
   spaceId?: string
   repoId?: string
   hideBranchIcon?: boolean
+  hideCopyButton?: boolean
   theme?: TagProps['theme']
   variant?: TagProps['variant']
   size?: TagProps['size']
@@ -17,13 +18,16 @@ const BranchTag: React.FC<BranchTagProps> = ({
   spaceId,
   repoId,
   hideBranchIcon,
+  hideCopyButton,
   theme = 'gray',
   variant = 'secondary',
   size = 'md'
 }) => {
+  const TagComponent = hideCopyButton ? Tag : CopyTag
+
   return (
     <Link noHoverUnderline to={`${spaceId ? `/${spaceId}` : ''}/repos/${repoId}/files/${branchName}`}>
-      <CopyTag
+      <TagComponent
         variant={variant}
         theme={theme}
         size={size}
diff --git a/packages/ui/src/components/copy-tag.tsx b/packages/ui/src/components/copy-tag.tsx
index 11005d22f0..8f0395c41b 100644
--- a/packages/ui/src/components/copy-tag.tsx
+++ b/packages/ui/src/components/copy-tag.tsx
@@ -9,7 +9,7 @@ type CopyTagProps = TagProps & {
   onActionClick?: never
 }
 
-export function CopyTag(props: CopyTagProps) {
+export function CopyTag({ ...props }: CopyTagProps) {
   const { value } = props
 
   const [copied, setCopied] = useState(false)
diff --git a/packages/ui/src/components/more-actions-tooltip.tsx b/packages/ui/src/components/more-actions-tooltip.tsx
index 500c86b7c5..6631139023 100644
--- a/packages/ui/src/components/more-actions-tooltip.tsx
+++ b/packages/ui/src/components/more-actions-tooltip.tsx
@@ -1,7 +1,7 @@
 import { forwardRef } from 'react'
 
 import { useRouterContext } from '@/context'
-import { Button, ButtonVariants } from '@components/button'
+import { Button, ButtonProps, ButtonVariants } from '@components/button'
 import { DropdownMenu } from '@components/dropdown-menu'
 import { IconV2, type IconPropsV2 } from '@components/icon-v2'
 import { cn } from '@utils/cn'
@@ -17,6 +17,7 @@ export interface ActionData {
 }
 
 export interface MoreActionsTooltipProps {
+  theme?: ButtonProps['theme']
   actions: ActionData[]
   isInTable?: boolean
   iconName?: IconPropsV2['name']
@@ -30,7 +31,10 @@ export interface MoreActionsTooltipProps {
  * A component for displaying a button that, when clicked, shows a tooltip with a list of actions.
  */
 export const MoreActionsTooltip = forwardRef<HTMLButtonElement, MoreActionsTooltipProps>(
-  ({ actions, iconName = 'more-vert', sideOffset = 2, alignOffset = 0, className, buttonVariant = 'ghost' }, ref) => {
+  (
+    { theme, actions, iconName = 'more-vert', sideOffset = 2, alignOffset = 0, className, buttonVariant = 'ghost' },
+    ref
+  ) => {
     const { Link } = useRouterContext()
     if (!actions.length) return <></>
 
@@ -38,6 +42,7 @@ export const MoreActionsTooltip = forwardRef<HTMLButtonElement, MoreActionsToolt
       <DropdownMenu.Root>
         <DropdownMenu.Trigger ref={ref} asChild>
           <Button
+            theme={theme}
             className={cn('text-icons-1 hover:text-icons-2 data-[state=open]:text-icons-2')}
             variant={buttonVariant}
             iconOnly
diff --git a/packages/ui/src/components/text.tsx b/packages/ui/src/components/text.tsx
index a6b0934ad4..d715fbafb6 100644
--- a/packages/ui/src/components/text.tsx
+++ b/packages/ui/src/components/text.tsx
@@ -74,7 +74,7 @@ export const textVariants = cva('', {
       warning: 'text-cn-warning',
       merged: 'text-cn-merged',
       danger: 'text-cn-danger',
-      accent: 'text-cn-brand'
+      brand: 'text-cn-brand'
     },
     lineClamp: {
       default: '',
diff --git a/packages/ui/src/views/repo/pull-request/components/pull-request-side-bar.tsx b/packages/ui/src/views/repo/pull-request/components/pull-request-side-bar.tsx
index b6b13057b8..562ea6887b 100644
--- a/packages/ui/src/views/repo/pull-request/components/pull-request-side-bar.tsx
+++ b/packages/ui/src/views/repo/pull-request/components/pull-request-side-bar.tsx
@@ -74,7 +74,7 @@ export const PullRequestSideBar: FC<PullRequestSideBarProps> = ({
 }) => {
   return (
     <Layout.Vertical gap="md">
-      <Layout.Vertical gap="md">
+      <Layout.Vertical gap="2xs">
         <ReviewersHeader
           currentUserId={currentUserId}
           usersList={usersList}
@@ -95,7 +95,7 @@ export const PullRequestSideBar: FC<PullRequestSideBarProps> = ({
         />
       </Layout.Vertical>
       {!isCreatingPr ? (
-        <Layout.Vertical gap="md">
+        <Layout.Vertical gap="2xs">
           <LabelsHeader
             labelsList={labelsList}
             labelsValues={labelsValues}
diff --git a/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-header.tsx b/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-header.tsx
index f3dba47bc7..67a2391569 100644
--- a/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-header.tsx
+++ b/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-header.tsx
@@ -1,6 +1,14 @@
 import { useMemo, useRef } from 'react'
 
-import { Button, DropdownMenu, IconV2, SearchInput, Text, useSearchableDropdownKeyboardNavigation } from '@/components'
+import {
+  Button,
+  DropdownMenu,
+  IconV2,
+  Layout,
+  SearchInput,
+  Text,
+  useSearchableDropdownKeyboardNavigation
+} from '@/components'
 import { useTranslation } from '@/context'
 import { PrincipalType } from '@/types'
 import { PRReviewer } from '@/views'
@@ -46,7 +54,7 @@ const ReviewersHeader = ({
   const handleCloseValuesView = useRef(debounce(() => handleSearchQuery(''), 300)).current
 
   return (
-    <div className="mb-0.5 flex items-center justify-between">
+    <Layout.Flex align="center" justify="between">
       <Text as="h5" variant="body-strong" color="foreground-1">
         {t('views:pullRequests.reviewers', 'Reviewers')}
       </Text>
@@ -94,7 +102,7 @@ const ReviewersHeader = ({
           })}
         </DropdownMenu.Content>
       </DropdownMenu.Root>
-    </div>
+    </Layout.Flex>
   )
 }
 
diff --git a/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-list.tsx b/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-list.tsx
index 8d34634c25..c828cbc462 100644
--- a/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-list.tsx
+++ b/packages/ui/src/views/repo/pull-request/components/reviewers/pull-request-reviewers-list.tsx
@@ -1,4 +1,5 @@
 import { Alert } from '@components/alert'
+import { Layout } from '@components/layout'
 import { Text } from '@components/text'
 
 import { EnumPullReqReviewDecision, PullReqReviewDecision } from '../../pull-request.types'
@@ -28,13 +29,13 @@ const ReviewersList: React.FC<ReviewersListProps> = ({
   addReviewerError,
   removeReviewerError
 }) => (
-  <div className="flex flex-col gap-3">
-    {addReviewerError || removeReviewerError ? (
+  <Layout.Vertical gapY="md">
+    {(addReviewerError || removeReviewerError) && (
       <Alert.Root theme="danger">
         <Alert.Title>Failed to add reviewer</Alert.Title>
         <Alert.Description>{addReviewerError ?? removeReviewerError}</Alert.Description>
       </Alert.Root>
-    ) : null}
+    )}
 
     {reviewers.length ? (
       reviewers.map(({ reviewer, review_decision, sha }) => (
@@ -52,7 +53,7 @@ const ReviewersList: React.FC<ReviewersListProps> = ({
         No reviewers
       </Text>
     )}
-  </div>
+  </Layout.Vertical>
 )
 
 export { ReviewersList }
diff --git a/packages/ui/src/views/repo/pull-request/details/components/conversation/pull-request-panel.tsx b/packages/ui/src/views/repo/pull-request/details/components/conversation/pull-request-panel.tsx
index c362b73fe5..c3bfdaeab1 100644
--- a/packages/ui/src/views/repo/pull-request/details/components/conversation/pull-request-panel.tsx
+++ b/packages/ui/src/views/repo/pull-request/details/components/conversation/pull-request-panel.tsx
@@ -10,19 +10,18 @@ import {
   Checkbox,
   CounterBadge,
   Dialog,
-  IconV2,
   Layout,
   MoreActionsTooltip,
+  Separator,
   SplitButton,
   StackedList,
-  StatusBadge,
   Text,
   Textarea,
   TextInput,
+  TextProps,
   TimeAgoCard,
   type ButtonThemes
 } from '@/components'
-import { useRouterContext } from '@/context'
 import {
   EnumCheckStatus,
   extractInfoFromRuleViolationArr,
@@ -96,27 +95,8 @@ interface ButtonStateProps {
 }
 
 const HeaderTitle = ({ ...props }: HeaderProps) => {
-  const {
-    pullReqMetadata,
-    spaceId,
-    repoId,
-    onRevertPR,
-    onDeleteBranch,
-    onRestoreBranch,
-    headerMsg,
-    showDeleteBranchButton,
-    showRestoreBranchButton,
-    isDraft,
-    isClosed,
-    unchecked,
-    mergeable,
-    isOpen,
-    ruleViolation,
-    actions,
-    mergeButtonValue
-  } = props
-  const areRulesBypassed = pullReqMetadata?.merge_violations_bypassed
-  const mergeMethod = getMergeMethodDisplay(pullReqMetadata?.merge_method as MergeStrategy)
+  const { pullReqMetadata, isDraft, isClosed, unchecked, mergeable, isOpen, ruleViolation, actions, mergeButtonValue } =
+    props
   const isRebasable = pullReqMetadata?.merge_target_sha !== pullReqMetadata?.merge_base_sha && !pullReqMetadata?.merged
 
   // Get the current selected merge method
@@ -138,9 +118,12 @@ const HeaderTitle = ({ ...props }: HeaderProps) => {
 
   const currentMergeMethod = getCurrentMergeMethod()
   const isFastForwardNotPossible = isRebasable && currentMergeMethod === MergeStrategy.FAST_FORWARD
+  const isMerged = pullReqMetadata?.state === PullRequestFilterOption.MERGED
 
-  const getStatusTextColor = (): 'success' | 'danger' | 'foreground-1' => {
-    if (isDraft || isClosed) return 'foreground-1'
+  const getStatusTextColor = (): TextProps['color'] => {
+    if (isDraft) return 'foreground-1'
+    if (isClosed) return 'brand'
+    if (isMerged) return 'merged'
 
     if (isOpen && (mergeable === false || ruleViolation || isFastForwardNotPossible)) {
       return 'danger'
@@ -152,66 +135,12 @@ const HeaderTitle = ({ ...props }: HeaderProps) => {
     return 'foreground-1'
   }
 
-  if (pullReqMetadata?.state === PullRequestFilterOption.MERGED) {
-    return (
-      <>
-        <div className="inline-flex w-full items-center justify-between gap-2">
-          <Text
-            className="text-cn-merged flex flex-wrap items-center space-x-1"
-            variant="body-single-line-strong"
-            as="h2"
-            color="inherit"
-          >
-            <Avatar name={pullReqMetadata?.merger?.display_name || ''} rounded size="xs" />
-            <span>{pullReqMetadata?.merger?.display_name}</span>
-            <span>{areRulesBypassed ? `bypassed rules and ${mergeMethod}` : `${mergeMethod}`}</span>
-            <span>into</span>
-            <BranchTag
-              branchName={pullReqMetadata?.target_branch || ''}
-              spaceId={spaceId}
-              repoId={repoId}
-              theme="purple"
-              variant="secondary"
-            />
-            <span>from</span>
-            <BranchTag
-              branchName={pullReqMetadata?.source_branch || ''}
-              spaceId={spaceId}
-              repoId={repoId}
-              theme="purple"
-              variant="secondary"
-            />
-            <TimeAgoCard timestamp={pullReqMetadata?.merged} />
-          </Text>
-          <Layout.Horizontal>
-            <Button variant="secondary" onClick={onRevertPR}>
-              Revert
-            </Button>
-            {showDeleteBranchButton ? (
-              <Button variant="primary" theme="danger" onClick={onDeleteBranch}>
-                Delete Branch
-              </Button>
-            ) : showRestoreBranchButton ? (
-              <Button variant="outline" onClick={onRestoreBranch}>
-                Restore Branch
-              </Button>
-            ) : null}
-          </Layout.Horizontal>
-        </div>
-        {headerMsg && (
-          <div className="flex w-full justify-end">
-            <span className="text-1 text-cn-danger">{headerMsg}</span>
-          </div>
-        )}
-      </>
-    )
-  }
-
   return (
-    <div className="inline-flex items-center gap-2">
-      <Text variant="body-single-line-strong" as="h2" color={getStatusTextColor()}>
-        {isDraft
-          ? 'This pull request is still a work in progress'
+    <Text variant="body-strong" as="h4" color={getStatusTextColor()}>
+      {isDraft
+        ? 'This pull request is still a work in progress'
+        : isMerged
+          ? 'This pull request is merged'
           : isClosed
             ? 'This pull request is closed'
             : unchecked
@@ -223,8 +152,7 @@ const HeaderTitle = ({ ...props }: HeaderProps) => {
                   : isFastForwardNotPossible
                     ? 'Cannot merge pull request'
                     : `Pull request can be merged`}
-      </Text>
-    </div>
+    </Text>
   )
 }
 
@@ -254,7 +182,7 @@ const getButtonState = ({
       checksNotAllowingMerge = true
     }
   })
-  if (checksNotAllowingMerge) {
+  if (checksNotAllowingMerge || isMergeable === false) {
     return {
       disabled: canBypass ? !checkboxBypass : true,
       theme: 'danger',
@@ -384,7 +312,6 @@ const PullRequestPanel = ({
   onMergeMethodSelect,
   ...routingProps
 }: PullRequestPanelProps) => {
-  const { Link } = useRouterContext()
   const [notBypassable, setNotBypassable] = useState(false)
   const [mergeButtonValue, setMergeButtonValue] = useState<string>(() => {
     const firstEnabledAction = actions.find(action => !action.disabled)
@@ -564,17 +491,12 @@ const PullRequestPanel = ({
   const prState = getPrState()
   const headerRowBgClass = cn({
     'bg-cn-green-surface': prState === PrState.Success,
-    'bg-cn-2': prState === PrState.Draft,
+    'bg-cn-1': prState === PrState.Draft,
     'bg-cn-red-surface': prState === PrState.Error,
-    'bg-cn-gray-surface': prState === PrState.Closed,
+    'bg-cn-brand-surface': prState === PrState.Closed,
     'bg-cn-purple-surface': prState === PrState.Merged
   })
 
-  const headerTitleColorClass = cn({
-    'text-cn-success': prState === PrState.Success,
-    'text-cn-danger': prState === PrState.Error
-  })
-
   const shouldShowConfirmation = actions && !pullReqMetadata?.closed && (showActionBtn || isMerging || mergeInitiated)
 
   const shouldShowSplitButton =
@@ -586,34 +508,40 @@ const PullRequestPanel = ({
     !mergeInitiated
 
   const shouldShowMoreActions = !shouldShowConfirmation && isOpen
+  const areRulesBypassed = pullReqMetadata?.merge_violations_bypassed
+  const mergeMethod = getMergeMethodDisplay(pullReqMetadata?.merge_method as MergeStrategy)
 
   return (
     <>
       <StackedList.Root>
-        <StackedList.Item className={cn('pl-cn-md', headerRowBgClass)} paddingY="sm" paddingX="sm" disableHover>
+        <StackedList.Item
+          className={cn('pl-cn-md gap-y-cn-sm', headerRowBgClass)}
+          paddingY="sm"
+          paddingX="sm"
+          disableHover
+        >
           <StackedList.Field
+            className="min-w-fit max-w-fit"
             title={
-              <div className={headerTitleColorClass}>
-                <HeaderTitle
-                  isDraft={isDraft}
-                  isClosed={isClosed}
-                  unchecked={isUnchecked}
-                  mergeable={isMergeable}
-                  isOpen={isOpen}
-                  ruleViolation={prPanelData.ruleViolation}
-                  pullReqMetadata={pullReqMetadata}
-                  onRestoreBranch={onRestoreBranch}
-                  onDeleteBranch={onDeleteBranch}
-                  onRevertPR={onRevertPR}
-                  showRestoreBranchButton={showRestoreBranchButton}
-                  showDeleteBranchButton={showDeleteBranchButton}
-                  headerMsg={headerMsg}
-                  spaceId={spaceId}
-                  repoId={repoId}
-                  actions={actions}
-                  mergeButtonValue={mergeButtonValue}
-                />
-              </div>
+              <HeaderTitle
+                isDraft={isDraft}
+                isClosed={isClosed}
+                unchecked={isUnchecked}
+                mergeable={isMergeable}
+                isOpen={isOpen}
+                ruleViolation={prPanelData.ruleViolation}
+                pullReqMetadata={pullReqMetadata}
+                onRestoreBranch={onRestoreBranch}
+                onDeleteBranch={onDeleteBranch}
+                onRevertPR={onRevertPR}
+                showRestoreBranchButton={showRestoreBranchButton}
+                showDeleteBranchButton={showDeleteBranchButton}
+                headerMsg={headerMsg}
+                spaceId={spaceId}
+                repoId={repoId}
+                actions={actions}
+                mergeButtonValue={mergeButtonValue}
+              />
             }
           />
 
@@ -621,21 +549,12 @@ const PullRequestPanel = ({
             <>
               <StackedList.Field
                 right
+                className="grow [&>.cn-stacked-list-field-title]:overflow-visible"
                 title={
-                  <Layout.Horizontal align="center" justify="center" gap="xs">
-                    {!!commitSuggestionsBatchCount && (
-                      <Dialog.Trigger>
-                        <Button variant="outline" onClick={() => onCommitSuggestions()}>
-                          Commit suggestion
-                          {/* TODO: Design system: Add Badge counter icon theme once it is ready */}
-                          <CounterBadge theme="info">{commitSuggestionsBatchCount}</CounterBadge>
-                        </Button>
-                      </Dialog.Trigger>
-                    )}
-
+                  <Layout.Horizontal align="center" gap="sm" wrap="wrap">
                     {!notBypassable && isMergeable && !isDraft && prPanelData.ruleViolation && (
                       <Checkbox
-                        className="flex-1"
+                        className="!w-fit"
                         id="checkbox-bypass"
                         showOptionalLabel
                         checked={!!checkboxBypass}
@@ -649,6 +568,78 @@ const PullRequestPanel = ({
                       />
                     )}
 
+                    {shouldShowMoreActions && (
+                      <MoreActionsTooltip
+                        theme={buttonState.theme}
+                        className="!ml-2"
+                        iconName="more-horizontal"
+                        sideOffset={4}
+                        actions={[
+                          ...(!isDraft
+                            ? [
+                                {
+                                  title: 'Mark as draft',
+                                  onClick: () => handlePrState('draft'),
+                                  iconName: 'page-edit' as const
+                                }
+                              ]
+                            : []),
+                          {
+                            title: 'Close pull request',
+                            onClick: () => handlePrState('closed'),
+                            iconName: 'git-pull-request-closed'
+                          },
+                          ...(isRebasable
+                            ? [
+                                {
+                                  title: 'Rebase',
+                                  onClick: () => handleRebaseBranch(),
+                                  iconName: 'git-rebase' as const
+                                }
+                              ]
+                            : [])
+                        ]}
+                      />
+                    )}
+
+                    {!!commitSuggestionsBatchCount && (
+                      <Dialog.Trigger>
+                        <Button variant="outline" onClick={() => onCommitSuggestions()}>
+                          Commit suggestion
+                          {/* TODO: Design system: Add Badge counter icon theme once it is ready */}
+                          <CounterBadge theme="info">{commitSuggestionsBatchCount}</CounterBadge>
+                        </Button>
+                      </Dialog.Trigger>
+                    )}
+
+                    {/* When in merge input mode or merging, show Cancel/Confirm buttons */}
+                    {shouldShowConfirmation && (
+                      <ButtonLayout>
+                        <Button
+                          variant="outline"
+                          onClick={handleCancelMerge}
+                          loading={cancelInitiated}
+                          disabled={isMerging || mergeInitiated}
+                        >
+                          Cancel
+                        </Button>
+                        <Button
+                          theme="success"
+                          onClick={handleConfirmMerge}
+                          loading={isMerging || mergeInitiated}
+                          disabled={cancelInitiated || shouldDisableFastForwardMerge()}
+                        >
+                          Confirm {actions[parseInt(mergeButtonValue || '0')]?.title || 'Merge'}
+                        </Button>
+                      </ButtonLayout>
+                    )}
+
+                    {actions?.length === 1 && (
+                      <Button variant="primary" theme="default" onClick={actions[0].action}>
+                        {actions[0].title}
+                      </Button>
+                    )}
+
                     {/*Only show SplitButton if we're not in any merge-related state*/}
                     {shouldShowSplitButton && (
                       <SplitButton
@@ -683,101 +674,85 @@ const PullRequestPanel = ({
                         {actions[parseInt(mergeButtonValue)].title}
                       </SplitButton>
                     )}
-
-                    {/* When in merge input mode or merging, show Cancel/Confirm buttons */}
-                    {shouldShowConfirmation && (
-                      <ButtonLayout>
-                        <Button
-                          variant="outline"
-                          onClick={handleCancelMerge}
-                          loading={cancelInitiated}
-                          disabled={isMerging || mergeInitiated}
-                        >
-                          Cancel
-                        </Button>
-                        <Button
-                          theme="success"
-                          onClick={handleConfirmMerge}
-                          loading={isMerging || mergeInitiated}
-                          disabled={cancelInitiated || shouldDisableFastForwardMerge()}
-                        >
-                          Confirm {actions[parseInt(mergeButtonValue || '0')]?.title || 'Merge'}
-                        </Button>
-                      </ButtonLayout>
-                    )}
-
-                    {actions?.length === 1 && (
-                      <Button variant="primary" theme="default" onClick={actions[0].action}>
-                        {actions[0].title}
-                      </Button>
-                    )}
-
-                    {shouldShowMoreActions && (
-                      <MoreActionsTooltip
-                        className="!ml-2"
-                        iconName="more-horizontal"
-                        sideOffset={4}
-                        alignOffset={0}
-                        actions={[
-                          ...(!isDraft
-                            ? [
-                                {
-                                  title: 'Mark as draft',
-                                  onClick: () => handlePrState('draft'),
-                                  iconName: 'page-edit' as const
-                                }
-                              ]
-                            : []),
-                          {
-                            title: 'Close pull request',
-                            onClick: () => handlePrState('closed'),
-                            iconName: 'git-pull-request-closed'
-                          },
-                          ...(isRebasable
-                            ? [
-                                {
-                                  title: 'Rebase',
-                                  onClick: () => handleRebaseBranch(),
-                                  iconName: 'git-rebase' as const
-                                }
-                              ]
-                            : [])
-                        ]}
-                      />
-                    )}
                   </Layout.Horizontal>
                 }
               />
               {showMergeInputs && (
-                <Layout.Vertical className="pb-cn-xs mt-2 w-full items-center">
-                  <Layout.Vertical className="border-cn-3 bg-cn-1 w-full gap-1 rounded-md border p-3">
-                    <TextInput
-                      id="merge-title"
-                      label="Commit message"
-                      className="bg-cn-1 w-full"
-                      value={mergeTitle}
-                      onChange={(e: React.ChangeEvent<HTMLInputElement>) => setMergeTitle(e.target.value)}
-                      optional
-                      placeholder="Enter commit message (optional)"
-                    />
-                    <Textarea
-                      id="merge-message"
-                      label="Commit description"
-                      className="bg-cn-1 w-full"
-                      value={mergeMessage}
-                      onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setMergeMessage(e.target.value)}
-                      optional
-                      resizable
-                      rows={5}
-                      placeholder="Enter commit description (optional)"
-                    />
-                  </Layout.Vertical>
+                <Layout.Vertical className="bg-cn-1 gap-cn-md p-cn-sm rounded-3 mb-cn-3xs w-full">
+                  <TextInput
+                    id="merge-title"
+                    label="Commit message"
+                    className="bg-cn-1 w-full"
+                    value={mergeTitle}
+                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setMergeTitle(e.target.value)}
+                    optional
+                    placeholder="Enter commit message (optional)"
+                  />
+                  <Textarea
+                    id="merge-message"
+                    label="Commit description"
+                    className="bg-cn-1 w-full"
+                    value={mergeMessage}
+                    onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setMergeMessage(e.target.value)}
+                    optional
+                    resizable
+                    rows={5}
+                    placeholder="Enter commit description (optional)"
+                  />
                 </Layout.Vertical>
               )}
             </>
           )}
         </StackedList.Item>
 
+        {pullReqMetadata?.state === PullRequestFilterOption.MERGED && (
+          <StackedList.Item paddingY="sm" disableHover>
+            <Layout.Horizontal gap="sm" align="center" justify="between" className="w-full">
+              <Layout.Horizontal align="center" wrap="wrap" gap="2xs">
+                <Avatar name={pullReqMetadata?.merger?.display_name || ''} rounded />
+                <Text variant="body-single-line-strong">{pullReqMetadata?.merger?.display_name}</Text>
+                <Text variant="body-single-line-normal">
+                  {areRulesBypassed ? `bypassed rules and ${mergeMethod}` : `${mergeMethod}`} into
+                </Text>
+                <BranchTag
+                  branchName={pullReqMetadata?.target_branch || ''}
+                  spaceId={spaceId}
+                  repoId={repoId}
+                  variant="secondary"
+                />
+                <Text variant="body-single-line-normal">from</Text>
+                <BranchTag
+                  branchName={pullReqMetadata?.source_branch || ''}
+                  spaceId={spaceId}
+                  repoId={repoId}
+                  variant="secondary"
+                />
+                <Separator orientation="vertical" className="h-4" />
+                <TimeAgoCard timestamp={pullReqMetadata?.merged} />
+              </Layout.Horizontal>
+              <ButtonLayout>
+                <Button variant="secondary" onClick={onRevertPR}>
+                  Revert
+                </Button>
+                {showDeleteBranchButton ? (
+                  <Button variant="primary" theme="danger" onClick={onDeleteBranch}>
+                    Delete Branch
+                  </Button>
+                ) : showRestoreBranchButton ? (
+                  <Button variant="outline" onClick={onRestoreBranch}>
+                    Restore Branch
+                  </Button>
+                ) : null}
+              </ButtonLayout>
+              {headerMsg && (
+                <div className="flex w-full justify-end">
+                  <span className="text-1 text-cn-danger">{headerMsg}</span>
+                </div>
+              )}
+            </Layout.Horizontal>
+          </StackedList.Item>
+        )}
+
         {!isClosed ? (
           (!pullReqMetadata?.merged || !!checks?.length) && (
             <StackedList.Item paddingY="0" disableHover>
@@ -838,19 +813,19 @@ const PullRequestPanel = ({
             </StackedList.Item>
           )
         ) : (
-          <StackedList.Item paddingY="0" disableHover>
-            <Layout.Horizontal gap="xs" align="center" justify="between" className="w-full py-4">
-              <Layout.Horizontal gap="3xs" align="center" className="w-full">
-                <StatusBadge variant="secondary" size="sm">
-                  <Link
-                    className="flex items-center gap-x-1.5"
-                    to={`${spaceId ? `/${spaceId}` : ''}/repos/${repoId}/files/${pullReqMetadata?.source_branch}`}
-                  >
-                    <IconV2 name="git-branch" size="2xs" className="text-cn-3" />
-                    {pullReqMetadata?.source_branch}
-                  </Link>
-                </StatusBadge>
-                <span className="text-2 text-cn-1"> branch has unmerged changes.</span>
+          <StackedList.Item paddingY="sm" disableHover>
+            <Layout.Horizontal gap="xs" align="center" justify="between" className="w-full">
+              <Layout.Horizontal gap="2xs" align="center" className="w-full">
+                <BranchTag
+                  branchName={pullReqMetadata?.source_branch || ''}
+                  repoId={repoId}
+                  spaceId={spaceId}
+                  hideCopyButton
+                />
+
+                <Text variant="body-single-line-normal" color="foreground-3">
+                  branch has unmerged changes.
+                </Text>
               </Layout.Horizontal>
               {showDeleteBranchButton && (
                 <Button theme="danger" size="sm" onClick={onDeleteBranch}>
diff --git a/packages/ui/src/views/repo/pull-request/details/components/conversation/sections/pull-request-checks-section.tsx b/packages/ui/src/views/repo/pull-request/details/components/conversation/sections/pull-request-checks-section.tsx
index c7d1e4cefa..8109a31e5d 100644
--- a/packages/ui/src/views/repo/pull-request/details/components/conversation/sections/pull-request-checks-section.tsx
+++ b/packages/ui/src/views/repo/pull-request/details/components/conversation/sections/pull-request-checks-section.tsx
@@ -37,7 +37,7 @@ const PullRequestCheckSection = ({
   }
 
   return (
-    <Accordion.Item value={ACCORDION_VALUE}>
+    <Accordion.Item value={ACCORDION_VALUE} className="only:border-0">
       <Accordion.Trigger className="py-3">
         <Layout.Flex>
           <StackedList.Field
diff --git a/packages/ui/tailwind-design-system.ts b/packages/ui/tailwind-design-system.ts
index ff2b760ce8..4f0d53e891 100644
--- a/packages/ui/tailwind-design-system.ts
+++ b/packages/ui/tailwind-design-system.ts
@@ -89,7 +89,8 @@ export default {
         'cn-brand': {
           DEFAULT: 'lch(from var(--cn-set-brand-solid-bg) l c h / <alpha-value>)',
           hover: 'lch(from var(--cn-set-brand-solid-bg-hover) l c h / <alpha-value>)',
-          selected: 'lch(from var(--cn-set-brand-solid-bg-selected) l c h / <alpha-value>)'
+          selected: 'lch(from var(--cn-set-brand-solid-bg-selected) l c h / <alpha-value>)',
+          surface: 'lch(from var(--cn-set-brand-surface-bg) l c h / <alpha-value>)'
         },
 
         // States