diff --git a/frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketDetails.styles.ts b/frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketDetailsCard.styles.ts
similarity index 80%
rename from frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketDetails.styles.ts
rename to frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketDetailsCard.styles.ts
index ccda7be2df4..f6c3d0c0205 100644
--- a/frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketDetails.styles.ts
+++ b/frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketDetailsCard.styles.ts
@@ -16,8 +16,13 @@
  */
 
 import ChevronIcon from '@assets/icons/outlined/thin_chevron-outlined.svg';
+import { CardHeader } from '@components/viewer/cards/card.styles';
 import styled from 'styled-components';
 
+export const GroupsCardHeader = styled(CardHeader)`
+	gap: 0;
+`;
+
 const CommonChevronStyle = styled(ChevronIcon)`
 	&& {
 		height: 10px;
@@ -33,3 +38,11 @@ export const ChevronRight = styled(CommonChevronStyle)`
 	transform: rotate(-90deg);
 	margin-left: 2px;
 `;
+
+export const BreakableText = styled.div`
+	margin-left: 5px;
+	max-width: 100%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+`;
diff --git a/frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketsDetailsCard.component.tsx b/frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketsDetailsCard.component.tsx
similarity index 95%
rename from frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketsDetailsCard.component.tsx
rename to frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketsDetailsCard.component.tsx
index a36b76f73e7..6b01ceafc53 100644
--- a/frontend/src/v5/ui/routes/viewer/tickets/ticketDetails/ticketsDetailsCard.component.tsx
+++ b/frontend/src/v5/ui/routes/viewer/tickets/ticketDetailsCard/ticketsDetailsCard.component.tsx
@@ -30,13 +30,13 @@ import { dirtyValues, filterErrors, nullifyEmptyObjects, removeEmptyObjects } fr
 import { FormattedMessage } from 'react-intl';
 import { InputController } from '@controls/inputs/inputController.component';
 import { goToView } from '@/v5/helpers/viewpoint.helpers';
+import { Viewpoint } from '@/v5/store/tickets/tickets.types';
 import { TicketsCardViews } from '../tickets.constants';
 import { TicketForm } from '../ticketsForm/ticketForm.component';
-import { ChevronLeft, ChevronRight } from './ticketDetails.styles';
+import { BreakableText, ChevronLeft, ChevronRight, GroupsCardHeader } from './ticketDetailsCard.styles';
 import { TicketGroups } from '../ticketsForm/ticketGroups/ticketGroups.component';
 import { TicketContext, TicketDetailsView } from '../ticket.context';
 import { useSearchParam } from '../../../useSearchParam';
-import { Viewpoint } from '@/v5/store/tickets/tickets.types';
 
 enum IndexChange {
 	PREV = -1,
@@ -157,10 +157,11 @@ export const TicketDetailsCard = () => {
 				{view === TicketDetailsView.Groups
 					&& (
 						<>
-							<CardHeader>
+							<GroupsCardHeader>
 								<ArrowBack onClick={onClickBackFromGroups} />
-								{ticket.title}:<FormattedMessage id="ticket.groups.header" defaultMessage="Groups" />
-							</CardHeader>
+								<BreakableText>{ticket.title}</BreakableText>
+								<span>:<FormattedMessage id="ticket.groups.header" defaultMessage="Groups" /></span>
+							</GroupsCardHeader>
 							<InputController
 								Input={TicketGroups}
 								name={viewProps.name}
diff --git a/frontend/src/v5/ui/routes/viewer/tickets/tickets.component.tsx b/frontend/src/v5/ui/routes/viewer/tickets/tickets.component.tsx
index d8370860184..dcac5065251 100644
--- a/frontend/src/v5/ui/routes/viewer/tickets/tickets.component.tsx
+++ b/frontend/src/v5/ui/routes/viewer/tickets/tickets.component.tsx
@@ -31,7 +31,7 @@ import { ContainersHooksSelectors, FederationsHooksSelectors, TicketsCardHooksSe
 import { TicketsActionsDispatchers, TicketsCardActionsDispatchers, UsersActionsDispatchers } from '@/v5/services/actionsDispatchers';
 import { AdditionalProperties, TicketsCardViews } from './tickets.constants';
 import { TicketsListCard } from './ticketsList/ticketsListCard.component';
-import { TicketDetailsCard } from './ticketDetails/ticketsDetailsCard.component';
+import { TicketDetailsCard } from './ticketDetailsCard/ticketsDetailsCard.component';
 import { NewTicketCard } from './newTicket/newTicket.component';
 import { ViewerParams } from '../../routes.constants';
 import { TicketContext, TicketContextComponent, TicketDetailsView } from './ticket.context';