diff --git a/frontend/src/Context/BackgroundEffectsDialog/BackgroundEffectsDialogContext.tsx b/frontend/src/Context/BackgroundEffectsDialog/BackgroundEffectsDialogContext.tsx
new file mode 100644
index 000000000..cdbcb9796
--- /dev/null
+++ b/frontend/src/Context/BackgroundEffectsDialog/BackgroundEffectsDialogContext.tsx
@@ -0,0 +1,62 @@
+import React, { createContext, useState, useContext, ReactNode, useMemo } from 'react';
+
+interface BackgroundEffectsDialogContextType {
+  isOpen: boolean;
+  open: () => void;
+  close: () => void;
+}
+
+const BackgroundEffectsDialogContext = createContext<
+  BackgroundEffectsDialogContextType | undefined
+>(undefined);
+
+interface BackgroundEffectsDialogProviderProps {
+  children: ReactNode;
+}
+
+/**
+ * BackgroundEffectsDialogProvider
+ *
+ * Provides context for managing the BackgroundEffectsDialog state across components.
+ * This allows any child component to open or close the background effects dialog.
+ * @param {BackgroundEffectsDialogProviderProps} props - The props for the component.
+ * @property {ReactNode} children - The child components.
+ * @returns {React.ReactElement} - The BackgroundEffectsDialogProvider component
+ */
+export const BackgroundEffectsDialogProvider: React.FC<BackgroundEffectsDialogProviderProps> = ({
+  children,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  const value = useMemo(
+    () => ({
+      isOpen,
+      open: () => setIsOpen(true),
+      close: () => setIsOpen(false),
+    }),
+    [isOpen]
+  );
+
+  return (
+    <BackgroundEffectsDialogContext.Provider value={value}>
+      {children}
+    </BackgroundEffectsDialogContext.Provider>
+  );
+};
+
+/**
+ * useBackgroundEffectsDialog
+ *
+ * Custom hook to access the BackgroundEffectsDialog context.
+ * @returns {BackgroundEffectsDialogContextType} The context value with isOpen, open, and close functions.
+ * @throws {Error} If used outside of BackgroundEffectsDialogProvider.
+ */
+export const useBackgroundEffectsDialog = (): BackgroundEffectsDialogContextType => {
+  const context = useContext(BackgroundEffectsDialogContext);
+  if (!context) {
+    throw new Error(
+      'useBackgroundEffectsDialog must be used within a BackgroundEffectsDialogProvider'
+    );
+  }
+  return context;
+};
diff --git a/frontend/src/Context/BackgroundEffectsDialog/index.ts b/frontend/src/Context/BackgroundEffectsDialog/index.ts
new file mode 100644
index 000000000..a4d6089ed
--- /dev/null
+++ b/frontend/src/Context/BackgroundEffectsDialog/index.ts
@@ -0,0 +1,4 @@
+export {
+  BackgroundEffectsDialogProvider,
+  useBackgroundEffectsDialog,
+} from './BackgroundEffectsDialogContext';
diff --git a/frontend/src/Context/Theme/helpers/getMuiCustomTheme.ts b/frontend/src/Context/Theme/helpers/getMuiCustomTheme.ts
index d853a5cd0..d37225c8e 100644
--- a/frontend/src/Context/Theme/helpers/getMuiCustomTheme.ts
+++ b/frontend/src/Context/Theme/helpers/getMuiCustomTheme.ts
@@ -159,6 +159,13 @@ const getMuiCustomTheme = ({ tokens }: { tokens: ThemeTokens }) => {
           root: {
             backgroundColor: colors.onSecondary,
             color: colors.textSecondary,
+          },
+        },
+      },
+      MuiMenuItem: {
+        styleOverrides: {
+          root: {
+            color: colors.textSecondary,
             fontSize: tokens.typography.typeScale.desktop['body-base'].fontSize.value,
             lineHeight: tokens.typography.typeScale.desktop['body-base'].lineHeight.value,
           },
diff --git a/frontend/src/components/JoinExistingRoom/JoinExistingRoom.tsx b/frontend/src/components/JoinExistingRoom/JoinExistingRoom.tsx
index ec89eeca8..fdab97009 100644
--- a/frontend/src/components/JoinExistingRoom/JoinExistingRoom.tsx
+++ b/frontend/src/components/JoinExistingRoom/JoinExistingRoom.tsx
@@ -14,13 +14,7 @@ const JoinExistingRoom = (): ReactElement => {
   const [hasError, setHasError] = useState(false);
 
   return (
-    <Stack
-      direction="column"
-      component="form"
-      data-testid="JoinExistingRoom"
-      spacing={3}
-      sx={{ mb: 6, width: '100%' }}
-    >
+    <Stack direction="column" data-testid="JoinExistingRoom" spacing={3} sx={{ width: '100%' }}>
       <RoomNameInput
         setRoomName={setRoomName}
         roomName={roomName}
diff --git a/frontend/src/components/LanguageSelector/LanguageSelector.tsx b/frontend/src/components/LanguageSelector/LanguageSelector.tsx
index 201860923..9c5767117 100644
--- a/frontend/src/components/LanguageSelector/LanguageSelector.tsx
+++ b/frontend/src/components/LanguageSelector/LanguageSelector.tsx
@@ -6,6 +6,7 @@ import FormControl from '@ui/FormControl';
 import Select from '@ui/Select';
 import { SelectChangeEvent } from '@ui/SelectChangeEvent';
 import useCustomTheme from '@Context/Theme';
+import { SvgIconProps } from '@mui/material';
 import { LanguageOption, LanguageSelectorProps } from './LanguageSelector.types';
 import useIsSmallViewport from '../../hooks/useIsSmallViewport';
 import VividIcon from '../VividIcon/VividIcon';
@@ -19,6 +20,10 @@ const languageOptions: LanguageOption[] = [
   { code: 'es-MX', name: 'Español (México)', flag: 'flag-mexico' },
 ];
 
+const ChevronDownIcon = (props: SvgIconProps) => (
+  <VividIcon name="chevron-down-line" customSize={-5} {...props} sx={{ color: 'black' }} />
+);
+
 /**
  * LanguageSelector Component
  * A dropdown component that allows users to select their preferred language.
@@ -48,6 +53,7 @@ const LanguageSelector = ({ showFlag = true }: LanguageSelectorProps): ReactElem
       <Select
         value={currentLanguage}
         onChange={handleLanguageChange}
+        IconComponent={ChevronDownIcon}
         displayEmpty
         sx={{
           '& .MuiOutlinedInput-notchedOutline': {
diff --git a/frontend/src/components/RoomJoinContainer/RoomJoinContainer.tsx b/frontend/src/components/RoomJoinContainer/RoomJoinContainer.tsx
index 9097f80cf..17e9df5ce 100644
--- a/frontend/src/components/RoomJoinContainer/RoomJoinContainer.tsx
+++ b/frontend/src/components/RoomJoinContainer/RoomJoinContainer.tsx
@@ -1,9 +1,8 @@
 import { useNavigate } from 'react-router-dom';
 import { ReactElement } from 'react';
-import Box from '@ui/Box';
 import Typography from '@ui/Typography';
 import { useTranslation } from 'react-i18next';
-import useCustomTheme from '@Context/Theme';
+import Card from '@ui/Card';
 import generateRoomName from '../../utils/generateRoomName';
 import NewRoomButton from '../NewRoomButton';
 import JoinContainerSeparator from '../JoinContainerSeparator';
@@ -19,31 +18,19 @@ const RoomJoinContainer = (): ReactElement => {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const randomRoom = generateRoomName();
-  const theme = useCustomTheme();
 
   const handleNewRoom = () => {
     navigate(`/waiting-room/${randomRoom}`);
   };
 
   return (
-    <Box
-      sx={{
-        maxWidth: { xs: '100%', md: '500px' },
-        flex: 1,
-        display: 'flex',
-        flexDirection: 'column',
-        alignItems: 'start',
-        bgcolor: 'background.paper',
-        padding: { xs: '0px 0px 0px 0px', md: '40px 40px 0px 40px' },
-        borderRadius: theme.shapes.borderRadiusMedium,
-      }}
-    >
+    <Card component="form">
       <Typography sx={{ mb: 2, typography: 'h6' }}>{t('button.startNewRoom')}</Typography>
       <NewRoomButton handleNewRoom={handleNewRoom} />
       <JoinContainerSeparator />
       <Typography sx={{ mb: 2, typography: 'h6' }}>{t('button.joinExistingMeeting')}</Typography>
       <JoinExistingRoom />
-    </Box>
+    </Card>
   );
 };
 
diff --git a/frontend/src/components/SoundTest/SoundTest.tsx b/frontend/src/components/SoundTest/SoundTest.tsx
index 120f0075c..6e9da7019 100644
--- a/frontend/src/components/SoundTest/SoundTest.tsx
+++ b/frontend/src/components/SoundTest/SoundTest.tsx
@@ -1,6 +1,7 @@
-import { MenuItem, Typography, ClickAwayListener } from '@mui/material';
 import { ReactElement, useCallback, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import ClickAwayListener from '@ui/ClickAwayListener';
+import MenuItem from '@ui/MenuItem';
 import useAudioOutputContext from '../../hooks/useAudioOutputContext';
 
 export type SoundTestProps = {
@@ -48,9 +49,7 @@ const SoundTest = ({ children }: SoundTestProps): ReactElement => {
     <ClickAwayListener onClickAway={() => stopAudio()}>
       <MenuItem onClick={handlePlayAudio} data-testid="soundTest">
         {children}
-        <Typography noWrap>
-          {!audioIsPlaying ? t('soundTest.start') : t('soundTest.stop')}
-        </Typography>
+        {!audioIsPlaying ? t('soundTest.start') : t('soundTest.stop')}
       </MenuItem>
     </ClickAwayListener>
   );
diff --git a/frontend/src/components/VividIcon/VividIcon.tsx b/frontend/src/components/VividIcon/VividIcon.tsx
index c150f813f..50e07de59 100644
--- a/frontend/src/components/VividIcon/VividIcon.tsx
+++ b/frontend/src/components/VividIcon/VividIcon.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-interface VividIconProps {
+interface VividIconProps extends Record<string, unknown> {
   name: string;
   customSize: -6 | -5 | -4 | -3 | -2 | -1 | 0 | 1 | 2 | 3 | 4 | 5;
 }
@@ -13,9 +13,9 @@ interface VividIconProps {
  * @property {number} customSize - The size of the icon, ranging from -6 to 5. -6 is the smallest and 5 is the largest.
  * @returns {React.ReactElement} The rendered VividIcon component.
  */
-const VividIcon: React.FC<VividIconProps> = ({ name, customSize }) => {
+const VividIcon: React.FC<VividIconProps> = ({ name, customSize, ...props }) => {
   // @ts-expect-error custom element
-  return <vwc-icon size={customSize} name={name} data-testid={`vivid-icon-${name}`} />;
+  return <vwc-icon size={customSize} name={name} data-testid={`vivid-icon-${name}`} {...props} />;
 };
 
 export default VividIcon;
diff --git a/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.spec.tsx b/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.spec.tsx
index cbcc2ad60..b256f2eae 100644
--- a/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.spec.tsx
+++ b/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.spec.tsx
@@ -1,10 +1,11 @@
 import { afterEach, beforeEach, describe, expect, it, Mock, vi } from 'vitest';
 import { cleanup, screen, render as renderBase } from '@testing-library/react';
-import { ReactElement } from 'react';
+import React, { ReactElement } from 'react';
 import useDevices from '@hooks/useDevices';
 import { AllMediaDevices } from '@app-types/room';
 import { allMediaDevices } from '@utils/mockData/device';
 import { AppConfigProviderWrapperOptions, makeAppConfigProviderWrapper } from '@test/providers';
+import { BackgroundEffectsDialogProvider } from '@Context/BackgroundEffectsDialog/BackgroundEffectsDialogContext';
 import ControlPanel from '.';
 
 vi.mock('@hooks/useDevices.tsx');
@@ -169,5 +170,11 @@ function render(
 ) {
   const { AppConfigWrapper } = makeAppConfigProviderWrapper(options?.appConfigOptions);
 
-  return renderBase(ui, { ...options, wrapper: AppConfigWrapper });
+  const AllProviders = ({ children }: { children: React.ReactNode }) => (
+    <AppConfigWrapper>
+      <BackgroundEffectsDialogProvider>{children}</BackgroundEffectsDialogProvider>
+    </AppConfigWrapper>
+  );
+
+  return renderBase(ui, { ...options, wrapper: AllProviders });
 }
diff --git a/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.tsx b/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.tsx
index 524536526..42328d0fd 100644
--- a/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.tsx
+++ b/frontend/src/components/WaitingRoom/ControlPanel/ControlPanel.tsx
@@ -1,16 +1,17 @@
-import { Button, SxProps } from '@mui/material';
-import { ReactElement, MouseEvent, TouchEvent } from 'react';
-import MicNone from '@mui/icons-material/MicNone';
-import VideoCall from '@mui/icons-material/VideoCall';
-import Speaker from '@mui/icons-material/Speaker';
-import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
+import { ReactElement, MouseEvent, TouchEvent, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import usePreviewPublisherContext from '@hooks/usePreviewPublisherContext';
 import useDevices from '@hooks/useDevices';
 import useAudioOutputContext from '@hooks/useAudioOutputContext';
 import useIsSmallViewport from '@hooks/useIsSmallViewport';
 import useAppConfig from '@Context/AppConfig/hooks/useAppConfig';
+import Box from '@ui/Box';
+import { SxProps } from '@ui/SxProps';
+import useCustomTheme from '@Context/Theme';
+import VividIcon from '@components/VividIcon';
+import ButtonBase from '@ui/ButtonBase';
 import MenuDevicesWaitingRoom from '../MenuDevices';
+import MenuMoreOptions from '../MenuMoreOptions/MenuMoreOptions';
 
 export type ControlPanelProps = {
   handleAudioInputOpen: (
@@ -54,48 +55,89 @@ const ControlPanel = ({
   openAudioOutput,
   anchorEl,
 }: ControlPanelProps): ReactElement | false => {
+  const [openMoreOptions, setOpenMoreOptions] = useState(false);
+  const [moreOptionsAnchorEl, setMoreOptionsAnchorEl] = useState<HTMLElement | null>(null);
+  const handleCloseMoreOptions = () => {
+    setOpenMoreOptions(false);
+    setMoreOptionsAnchorEl(null);
+  };
+  const handleOpenMoreOptions = (event: MouseEvent<HTMLElement>) => {
+    setMoreOptionsAnchorEl(event.currentTarget);
+    setOpenMoreOptions(true);
+  };
+
   const { t } = useTranslation();
   const isSmallViewport = useIsSmallViewport();
   const { allMediaDevices } = useDevices();
   const { localAudioSource, localVideoSource, changeAudioSource, changeVideoSource } =
     usePreviewPublisherContext();
   const { currentAudioOutputDevice, setAudioOutputDevice } = useAudioOutputContext();
+  const theme = useCustomTheme();
 
   const allowDeviceSelection = useAppConfig(
     ({ waitingRoomSettings }) => waitingRoomSettings.allowDeviceSelection
   );
 
   const buttonSx: SxProps = {
-    borderRadius: '10px',
-    color: 'rgb(95, 99, 104)',
-    textTransform: 'none', // ensures that the text is not upper case
-    border: 'none',
-    boxShadow: 'none',
-    whiteSpace: 'nowrap',
+    display: 'flex',
+    alignItems: 'center',
+    gap: 1.5,
+    borderRadius: theme.shapes.borderRadiusMedium,
+    padding: '8px',
+    color: theme.colors.textSecondary,
+    fontWeight: theme.typography.weight.caption.value,
+    fontSize: theme.typography.typeScale.desktop['body-base'].fontSize.value,
+
+    minWidth: 0,
+
     '&:hover': {
-      border: 'none',
-      boxShadow: 'none',
+      backgroundColor: theme.colors.background,
     },
   };
 
+  const textSx: SxProps = {
+    flex: '1 1 0',
+    minWidth: 0,
+    whiteSpace: 'nowrap',
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+  };
+
   return (
     allowDeviceSelection && (
-      <div className="m-auto my-4 max-w-[100dvw]" data-testid="ControlPanel">
-        <div className="flex flex-row justify-evenly min-[400px]:w-[400px]">
-          <Button
+      <Box
+        sx={{
+          my: 4,
+          maxWidth: '100vw',
+        }}
+        data-testid="ControlPanel"
+      >
+        <Box
+          sx={{
+            display: 'flex',
+            flexDirection: 'row',
+            gap: 1,
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            padding: '0 4px',
+          }}
+        >
+          <ButtonBase
             sx={buttonSx}
-            endIcon={<KeyboardArrowDownIcon />}
-            variant="outlined"
-            startIcon={<MicNone />}
-            aria-controls={openVideoInput ? 'basic-menu' : undefined}
+            aria-controls={openAudioInput ? 'basic-menu' : undefined}
             aria-haspopup="true"
-            aria-expanded={openVideoInput ? 'true' : undefined}
+            aria-expanded={openAudioInput ? 'true' : undefined}
+            aria-label={t('devices.audio.microphone.ariaLabel')}
             onClick={handleAudioInputOpen}
           >
-            {isSmallViewport
-              ? t('devices.audio.microphone.short')
-              : t('devices.audio.microphone.full')}
-          </Button>
+            <VividIcon name="microphone-line" customSize={-6} />
+            <Box component="span" sx={textSx}>
+              {isSmallViewport
+                ? t('devices.audio.microphone.short')
+                : t('devices.audio.microphone.full')}
+            </Box>
+            <VividIcon name="chevron-down-line" customSize={-6} />
+          </ButtonBase>
           <MenuDevicesWaitingRoom
             devices={allMediaDevices.audioInputDevices}
             open={openAudioInput}
@@ -105,17 +147,21 @@ const ControlPanel = ({
             deviceChangeHandler={changeAudioSource}
             deviceType="audioInput"
           />
-          <Button
+
+          <ButtonBase
             onClick={handleVideoInputOpen}
-            endIcon={<KeyboardArrowDownIcon />}
             sx={buttonSx}
-            variant="outlined"
-            startIcon={<VideoCall />}
-            aria-label={t('devices.video.camera.button.ariaLabel')}
+            aria-controls={openVideoInput ? 'basic-menu' : undefined}
+            aria-haspopup="true"
+            aria-expanded={openVideoInput ? 'true' : undefined}
+            aria-label={t('devices.video.camera.ariaLabel')}
           >
-            {t('button.camera')}
-          </Button>
-
+            <VividIcon name="audio-off-2-line" customSize={-6} />
+            <Box component="span" sx={textSx}>
+              {t('button.camera')}
+            </Box>
+            <VividIcon name="chevron-down-line" customSize={-6} />
+          </ButtonBase>
           <MenuDevicesWaitingRoom
             devices={allMediaDevices.videoInputDevices}
             open={openVideoInput}
@@ -125,15 +171,21 @@ const ControlPanel = ({
             deviceChangeHandler={changeVideoSource}
             deviceType="videoInput"
           />
-          <Button
+
+          <ButtonBase
             onClick={handleAudioOutputOpen}
-            endIcon={<KeyboardArrowDownIcon />}
             sx={buttonSx}
-            variant="outlined"
-            startIcon={<Speaker />}
+            aria-controls={openAudioOutput ? 'basic-menu' : undefined}
+            aria-haspopup="true"
+            aria-expanded={openAudioOutput ? 'true' : undefined}
+            aria-label={t('devices.audio.speakers.full')}
           >
-            {t('button.speaker')}
-          </Button>
+            <VividIcon name="video-line" customSize={-6} />
+            <Box component="span" sx={textSx}>
+              {t('button.speaker')}
+            </Box>
+            <VividIcon name="chevron-down-line" customSize={-6} />
+          </ButtonBase>
           <MenuDevicesWaitingRoom
             devices={allMediaDevices.audioOutputDevices}
             open={openAudioOutput}
@@ -143,8 +195,17 @@ const ControlPanel = ({
             deviceChangeHandler={setAudioOutputDevice}
             deviceType="audioOutput"
           />
-        </div>
-      </div>
+
+          <ButtonBase onClick={handleOpenMoreOptions} sx={buttonSx}>
+            <VividIcon name="more-vertical-solid" customSize={-5} />
+          </ButtonBase>
+          <MenuMoreOptions
+            onClose={handleCloseMoreOptions}
+            open={openMoreOptions}
+            anchorEl={moreOptionsAnchorEl}
+          />
+        </Box>
+      </Box>
     )
   );
 };
diff --git a/frontend/src/components/WaitingRoom/MenuDevices/MenuDevices.tsx b/frontend/src/components/WaitingRoom/MenuDevices/MenuDevices.tsx
index b4529c9a4..6703455ff 100644
--- a/frontend/src/components/WaitingRoom/MenuDevices/MenuDevices.tsx
+++ b/frontend/src/components/WaitingRoom/MenuDevices/MenuDevices.tsx
@@ -1,10 +1,12 @@
-import { Menu, MenuItem } from '@mui/material';
-import { Speaker } from '@mui/icons-material';
 import { AudioOutputDevice, Device } from '@vonage/client-sdk-video';
 import { ReactElement, useMemo } from 'react';
-import { isGetActiveAudioOutputDeviceSupported } from '../../../utils/util';
-import SoundTest from '../../SoundTest';
+import MenuItem from '@ui/MenuItem';
+import Menu from '@ui/Menu';
+import VividIcon from '@components/VividIcon';
+import Box from '@ui/Box';
 import cleanAndDedupeDeviceLabels from '../../../utils/cleanAndDedupeDeviceLabels/cleanAndDedupeDeviceLabels';
+import SoundTest from '../../SoundTest';
+import { isGetActiveAudioOutputDeviceSupported } from '../../../utils/util';
 
 export type MenuDevicesWaitingRoomProps = {
   onClose: () => void;
@@ -67,24 +69,15 @@ const MenuDevices = ({
             }}
             key={device.deviceId}
             selected={device.deviceId === localSource}
-            sx={{
-              pl: 4,
-              backgroundColor: device.deviceId === localSource ? 'rgba(26,115,232,.9)' : '',
-            }}
           >
             {device.label}
           </MenuItem>
         ))}
       {deviceType === 'audioOutput' && (
         <SoundTest>
-          <Speaker
-            sx={{
-              fontSize: 24,
-              mr: 1,
-              ml: 1.5,
-              color: 'rgb(95, 99, 104)',
-            }}
-          />
+          <Box sx={{ mr: 1 }}>
+            <VividIcon name="hearing-line" customSize={-5} />
+          </Box>
         </SoundTest>
       )}
     </Menu>
diff --git a/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.spec.tsx b/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.spec.tsx
new file mode 100644
index 000000000..58d9e3dc0
--- /dev/null
+++ b/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.spec.tsx
@@ -0,0 +1,53 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { render as renderBase, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { ReactElement } from 'react';
+import { BackgroundEffectsDialogProvider } from '../../../Context/BackgroundEffectsDialog';
+import MenuMoreOptions from './MenuMoreOptions';
+
+describe('MenuMoreOptions', () => {
+  const mockOnClose = vi.fn();
+  const mockAnchorEl = document.createElement('button');
+
+  beforeEach(() => {
+    mockOnClose.mockClear();
+  });
+
+  it('should render when open is true', () => {
+    render(<MenuMoreOptions onClose={mockOnClose} open anchorEl={mockAnchorEl} />);
+
+    expect(screen.getByTestId('menu-more-options')).toBeInTheDocument();
+  });
+
+  it('should not render menu items when open is false', () => {
+    render(<MenuMoreOptions onClose={mockOnClose} open={false} anchorEl={mockAnchorEl} />);
+
+    expect(screen.queryByText(/background effects/i)).not.toBeInTheDocument();
+  });
+
+  it('should display background effects option', () => {
+    render(<MenuMoreOptions onClose={mockOnClose} open anchorEl={mockAnchorEl} />);
+
+    expect(screen.getByText(/background effects/i)).toBeInTheDocument();
+  });
+
+  it('should call onClose when clicking on background effects option', async () => {
+    const user = userEvent.setup();
+    render(<MenuMoreOptions onClose={mockOnClose} open anchorEl={mockAnchorEl} />);
+
+    const menuItem = screen.getByText(/background effects/i);
+    await user.click(menuItem);
+
+    expect(mockOnClose).toHaveBeenCalledTimes(1);
+  });
+
+  it('should display icon for background effects', () => {
+    render(<MenuMoreOptions onClose={mockOnClose} open anchorEl={mockAnchorEl} />);
+
+    expect(screen.getByTestId('vivid-icon-gallery-line')).toBeInTheDocument();
+  });
+});
+
+function render(ui: ReactElement) {
+  return renderBase(<BackgroundEffectsDialogProvider>{ui}</BackgroundEffectsDialogProvider>);
+}
diff --git a/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.tsx b/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.tsx
new file mode 100644
index 000000000..ee5775eb7
--- /dev/null
+++ b/frontend/src/components/WaitingRoom/MenuMoreOptions/MenuMoreOptions.tsx
@@ -0,0 +1,60 @@
+import { ReactElement } from 'react';
+import MenuItem from '@ui/MenuItem';
+import Menu from '@ui/Menu';
+import { useTranslation } from 'react-i18next';
+import VividIcon from '@components/VividIcon';
+import Box from '@ui/Box';
+import { useBackgroundEffectsDialog } from '../../../Context/BackgroundEffectsDialog';
+
+export type MenuMoreOptionsWaitingRoomProps = {
+  onClose: () => void;
+  open: boolean;
+  anchorEl: HTMLElement | null;
+};
+
+/**
+ * MenuMoreOptions Component
+ *
+ * Displays a list of options in the waiting room.
+ * @param {MenuMoreOptionsWaitingRoomProps} props - The props for the component.
+ *  @property {Function} onClose - Menu close handler.
+ *  @property {boolean} open - Whether the menu is open or not.
+ *  @property {HTMLElement | null} anchorEl - The anchor element.
+ * @returns {ReactElement} - The MenuMoreOptions component
+ */
+const MenuMoreOptions = ({
+  onClose,
+  open,
+  anchorEl,
+}: MenuMoreOptionsWaitingRoomProps): ReactElement => {
+  const { t } = useTranslation();
+  const { open: openBackgroundEffects } = useBackgroundEffectsDialog();
+
+  const handleClick = () => {
+    openBackgroundEffects();
+    onClose();
+  };
+
+  return (
+    <Menu
+      id="menu-more-options"
+      anchorEl={anchorEl}
+      open={open}
+      onClose={onClose}
+      MenuListProps={{ 'aria-labelledby': 'basic-button' }}
+      data-testid="menu-more-options"
+    >
+      <MenuItem
+        onClick={() => {
+          handleClick();
+        }}
+        key="backgroundEffects-option"
+      >
+        <VividIcon name="gallery-line" customSize={-6} />
+        <Box sx={{ ml: 1 }}>{t('backgroundEffects.title')}</Box>
+      </MenuItem>
+    </Menu>
+  );
+};
+
+export default MenuMoreOptions;
diff --git a/frontend/src/components/WaitingRoom/MenuMoreOptions/index.tsx b/frontend/src/components/WaitingRoom/MenuMoreOptions/index.tsx
new file mode 100644
index 000000000..a068c07c1
--- /dev/null
+++ b/frontend/src/components/WaitingRoom/MenuMoreOptions/index.tsx
@@ -0,0 +1,3 @@
+import MenuDevices from './MenuMoreOptions';
+
+export default MenuDevices;
diff --git a/frontend/src/components/WaitingRoom/UserNameInput/UserNameInput.tsx b/frontend/src/components/WaitingRoom/UserNameInput/UserNameInput.tsx
index 4e77e905c..44a359e6d 100644
--- a/frontend/src/components/WaitingRoom/UserNameInput/UserNameInput.tsx
+++ b/frontend/src/components/WaitingRoom/UserNameInput/UserNameInput.tsx
@@ -1,12 +1,17 @@
-import { TextField, Button, InputAdornment } from '@mui/material';
 import React, { Dispatch, MouseEvent, ReactElement, SetStateAction, useState } from 'react';
-import { PersonOutline } from '@mui/icons-material';
 import { useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
+import TextField from '@ui/TextField';
+import Button from '@ui/Button';
+import Box from '@ui/Box';
+import Typography from '@ui/Typography';
+import Card from '@ui/Card';
+import useCustomTheme from '@Context/Theme';
 import useUserContext from '../../../hooks/useUserContext';
 import { UserType } from '../../../Context/user';
 import useRoomName from '../../../hooks/useRoomName';
 import isValidRoomName from '../../../utils/isValidRoomName';
+import isValidUserName from '../../../utils/isValidUserName';
 import { setStorageItem, STORAGE_KEYS } from '../../../utils/storage';
 
 export type UserNameInputProps = {
@@ -29,20 +34,16 @@ const UsernameInput = ({ username, setUsername }: UserNameInputProps): ReactElem
   const navigate = useNavigate();
   const roomName = useRoomName();
   const [isUserNameInvalid, setIsUserNameInvalid] = useState(false);
+  const theme = useCustomTheme();
 
   const onChangeParticipantName = (e: React.ChangeEvent<HTMLInputElement>) => {
     const inputUserName = e.target.value;
-    if (inputUserName === '' || inputUserName.trim() === '') {
-      // Space detected
-      setUsername('');
-      return;
-    }
     setIsUserNameInvalid(false);
     setUsername(inputUserName);
   };
 
   const validateForm = () => {
-    if (username === '') {
+    if (!isValidUserName(username)) {
       setIsUserNameInvalid(true);
       return false;
     }
@@ -75,62 +76,43 @@ const UsernameInput = ({ username, setUsername }: UserNameInputProps): ReactElem
   };
 
   return (
-    <form className="flex w-full flex-col justify-center px-6 md:relative md:top-[-48px] md:max-w-[480px]">
-      <div className="mt-4 flex flex-col items-center justify-end">
-        <div className="mb-2 text-[28px] leading-8">{t('waitingRoom.title')}</div>
-        <div className="flex w-full flex-col content-end py-2 text-lg decoration-solid md:max-w-[480px]">
-          <p className="truncate">{roomName}</p>
-        </div>
-        <div className="mt-6 text-[24px] leading-8">{t('waitingRoom.user.input.label')}</div>
-        <div className="mb-5 flex w-full flex-wrap items-center justify-center">
-          <TextField
-            size="small"
-            margin="dense"
-            placeholder={t('waitingRoom.user.input.placeholder')}
-            onChange={onChangeParticipantName}
-            sx={{
-              display: 'flex',
-              width: '100%',
-              maxWidth: '212px',
-              marginTop: '20px',
-              paddingLeft: '0px',
-            }}
-            required
-            id="user-name"
-            name="Name"
-            error={isUserNameInvalid}
-            autoComplete="Name"
-            autoFocus
-            value={username}
-            InputProps={{
-              startAdornment: (
-                <InputAdornment position="start">
-                  <PersonOutline />
-                </InputAdornment>
-              ),
-              inputProps: { maxLength: 60 },
-            }}
-          />
-        </div>
-        <Button
-          onClick={handleJoinClick}
-          variant="contained"
-          color="primary"
-          sx={{
-            width: '117px',
-            borderRadius: '24px',
-            color: 'white',
-            textTransform: 'none',
-            fontSize: '14px',
-            height: '48px',
-          }}
-          disabled={!username}
-          type="submit"
-        >
-          {t('button.join')}
-        </Button>
-      </div>
-    </form>
+    <Card component="form">
+      <Typography sx={{ mb: 2, typography: 'h6' }}>{t('waitingRoom.user.input.title')}</Typography>
+      <Box
+        sx={{
+          width: '100%',
+          mt: 2,
+          mb: 5,
+        }}
+      >
+        <TextField
+          fullWidth
+          size="small"
+          label={t('waitingRoom.user.input.label')}
+          onChange={onChangeParticipantName}
+          required
+          id="user-name"
+          name="username"
+          error={isUserNameInvalid}
+          helperText={isUserNameInvalid ? t('waitingRoom.user.input.error') : ''}
+          autoComplete="nickname"
+          autoFocus
+          value={username}
+          inputProps={{ maxLength: 60 }}
+        />
+      </Box>
+
+      <Typography sx={{ mb: 2, typography: 'h6' }}>{t('waitingRoom.title')}</Typography>
+
+      <Box>
+        <Typography sx={{ mb: 2, typography: 'h6', color: theme.colors.textTertiary }} noWrap>
+          {roomName}
+        </Typography>
+      </Box>
+      <Button onClick={handleJoinClick} variant="contained" color="primary" type="submit" fullWidth>
+        {t('button.join')}
+      </Button>
+    </Card>
   );
 };
 
diff --git a/frontend/src/components/WaitingRoom/VideoContainer/VideoContainer.tsx b/frontend/src/components/WaitingRoom/VideoContainer/VideoContainer.tsx
index 29597ab0b..74113ef49 100644
--- a/frontend/src/components/WaitingRoom/VideoContainer/VideoContainer.tsx
+++ b/frontend/src/components/WaitingRoom/VideoContainer/VideoContainer.tsx
@@ -13,6 +13,7 @@ import VignetteEffect from '../VignetteEffect';
 import useIsSmallViewport from '../../../hooks/useIsSmallViewport';
 import BackgroundEffectsDialog from '../BackgroundEffects/BackgroundEffectsDialog';
 import BackgroundEffectsButton from '../BackgroundEffects/BackgroundEffectsButton';
+import { useBackgroundEffectsDialog } from '../../../Context/BackgroundEffectsDialog';
 
 export type VideoContainerProps = {
   username: string;
@@ -30,7 +31,7 @@ export type VideoContainerProps = {
 const VideoContainer = ({ username }: VideoContainerProps): ReactElement => {
   const containerRef = useRef<HTMLDivElement>(null);
   const [isVideoLoading, setIsVideoLoading] = useState<boolean>(true);
-  const [isBackgroundEffectsOpen, setIsBackgroundEffectsOpen] = useState<boolean>(false);
+  const { isOpen: isBackgroundEffectsOpen, open, close } = useBackgroundEffectsDialog();
   const { user } = useUserContext();
   const { publisherVideoElement, isVideoEnabled, isAudioEnabled, speechLevel } =
     usePreviewPublisherContext();
@@ -94,10 +95,10 @@ const VideoContainer = ({ username }: VideoContainerProps): ReactElement => {
             <CameraButton />
           </Stack>
           <div className="absolute right-[20px]">
-            <BackgroundEffectsButton onClick={() => setIsBackgroundEffectsOpen(true)} />
+            <BackgroundEffectsButton onClick={open} />
             <BackgroundEffectsDialog
               isBackgroundEffectsOpen={isBackgroundEffectsOpen}
-              setIsBackgroundEffectsOpen={setIsBackgroundEffectsOpen}
+              setIsBackgroundEffectsOpen={close}
             />
           </div>
         </div>
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index 1a08fbad6..9e63942eb 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -47,7 +47,7 @@
   "button.startNewRoom": "Start a new video meeting",
   "button.joinExistingMeeting": "Join existing meeting",
   "button.joinWaitingRoom": "Join waiting room",
-  "button.join": "Join",
+  "button.join": "Join meeting",
   "button.mute": "Mute",
   "button.send": "Send",
   "button.speaker": "Speaker",
@@ -89,7 +89,6 @@
   "devices.video.blur.ariaLabel": "Toggle background blur",
   "devices.video.blur.label": "Blur your background",
   "devices.video.camera.ariaLabel": "toggle video",
-  "devices.video.camera.button.ariaLabel": "video",
   "devices.video.camera.state.on": "Enable camera",
   "devices.video.camera.state.off": "Disable camera",
   "devices.video.camera.full": "Camera",
@@ -192,9 +191,10 @@
   "unknown.device": "Unknown Device",
   "user.unknown": "unknown user",
   "user.you": "You",
-  "waitingRoom.title": "Prepare to join:",
-  "waitingRoom.user.input.label": "What is your name?",
-  "waitingRoom.user.input.placeholder": "Enter your name",
+  "waitingRoom.title": "Prepare to join",
+  "waitingRoom.user.input.title": "Enter your name",
+  "waitingRoom.user.input.label": "Name",
+  "waitingRoom.user.input.error": "Name cannot be empty or contain special characters",
   "zoom.reset": "Reset Zoom",
   "zoom.start": "Start Zooming",
   "zoom.out": "Zoom out",
diff --git a/frontend/src/locales/es-MX.json b/frontend/src/locales/es-MX.json
index 66f1fbac8..232fadc8a 100644
--- a/frontend/src/locales/es-MX.json
+++ b/frontend/src/locales/es-MX.json
@@ -1,201 +1,201 @@
 {
-  "archiveList.archive.createdAt": "Iniciada el: {{createdAt}}",
-  "archiveList.archive.index": "Grabación {{index}}",
-  "archiveList.download.tooltip": "Descargar grabación {{id}}",
-  "archiveList.empty": "No hay grabaciones de esta reunión",
-  "archiveList.error.text": "Ocurrió un error al cargar las grabaciones de esta reunión",
-  "archiveList.error.tooltip": "Esta grabación falló o ya expiró",
-  "archiveList.label": "Grabaciones",
-  "archiveList.loading.tooltip": "Esta grabación aún no está lista para descargarse",
-  "backgroundEffects.ariaLabel": "efectos de fondo",
-  "backgroundEffects.choice": "Elige un efecto de fondo",
-  "backgroundEffects.limit": "Llegaste al límite máximo de imágenes personalizadas",
-  "backgroundEffects.recommended.note": "Nota: Las imágenes solo se guardan localmente en tu navegador.",
-  "backgroundEffects.recommended.specs": "Recomendado: imagen JPG/PNG de 1280x720 de resolución.",
-  "backgroundEffects.title": "Efectos de fondo",
-  "backgroundEffects.title.tabs": "Tabs de efectos de fondo",
-  "backgroundEffects.tabs.backgrounds": "Fondos",
-  "backgroundEffects.tabs.addBackground": "Agregar fondo",
-  "backgroundEffects.video.disabled": "No tienes habilitado el video",
-  "backgroundEffects.invalidFileType": "Solo se permiten imágenes JPG, PNG, GIF o BMP.",
-  "backgroundEffects.fileTooLarge": "La imagen debe pesar menos de {{maxSize}}MB.",
-  "backgroundEffects.processingError": "No se pudo procesar la imagen subida.",
-  "backgroundEffects.storageError": "No se pudo guardar la imagen.",
-  "backgroundEffects.linkPlaceholder": "Liga desde la web",
-  "backgroundEffects.dragDropText": "Arrastra y suelta, o da clic aquí para subir imagen,",
-  "backgroundEffects.maxSize": "Máx {{maxSize}}MB",
-  "backgroundEffects.removeBackground": "Quitar fondo",
-  "backgroundEffects.slightBlur": "Desenfoque ligero del fondo",
-  "backgroundEffects.strongBlur": "Desenfoque fuerte del fondo",
-  "backgroundEffects.yourBackground": "Tu fondo",
-  "backgroundEffects.deleteTooltipInUse": "No puedes eliminar este fondo mientras esté en uso",
-  "backgroundEffects.deleteTooltip": "Eliminar fondo",
-  "backgroundEffects.deleteAriaLabel": "Eliminar fondo personalizado",
-  "backgroundEffects.backgrounds.bookshelfRoom": "Cuarto con librero",
-  "backgroundEffects.backgrounds.busyRoom": "Sala ocupada",
-  "backgroundEffects.backgrounds.duneView": "Vista de dunas",
-  "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
-  "backgroundEffects.backgrounds.library": "Biblioteca",
-  "backgroundEffects.backgrounds.newYork": "Nueva York",
-  "backgroundEffects.backgrounds.plane": "Avión",
-  "backgroundEffects.backgrounds.whiteRoom": "Cuarto blanco",
-  "button.apply": "Aplicar",
-  "button.camera": "Cámara",
-  "button.cancel": "Cancelar",
-  "button.close": "Cerrar",
-  "button.createRoom": "Crear una nueva sala",
-  "button.startNewRoom": "Iniciar una nueva videoconferencia",
-  "button.joinExistingMeeting": "Unirse a una reunión existente",
-  "button.joinWaitingRoom": "Unirse a la sala de espera",
-  "button.join": "Unirse",
-  "button.mute": "Silenciar",
-  "button.send": "Enviar",
-  "button.speaker": "Altavoz",
-  "captions.ariaLabel": "botón de subtítulos",
-  "captions.disable": "Desactivar subtítulos",
-  "captions.enable": "Activar subtítulos",
-  "captions.errors": "Error en subtítulos: {{captionsErrorResponse}}",
-  "chat.ariaLabel": "abrir/cerrar chat",
-  "chat.close": "Cerrar chat",
-  "chat.copied": "Copiado",
-  "chat.copy": "Copiar al portapapeles",
-  "chat.input.placeholder": "Escribe un mensaje",
-  "chat.meetingUrl": "URL de la reunión:",
-  "chat.open": "Abrir chat",
-  "chat.title": "Chat",
-  "common.or": "o",
-  "connectionAlert.quality.message": "Revisa tu conexión. Tu video puede desactivarse para mejorar la experiencia.",
-  "connectionAlert.quality.title": "Problema de calidad de video",
-  "connectionAlert.reconnecting.message": "Revisa tu conexión de internet",
-  "connectionAlert.reconnecting.title": "Conexión perdida",
-  "deviceAccessAlert.askDeviceMessage": "Para entrar a la sala de video, tu navegador pedirá acceso a la cámara y el micrófono.",
-  "deviceAccessAlert.deniedDeviceMessage": "Parece que tu navegador tiene bloqueado el acceso a tu cámara o micrófono. Restablece los permisos desde la configuración del navegador.",
-  "deviceAccessAlert.imageAlt": "Diálogo de acceso",
-  "devices.audio.ariaLabel": "menú de dispositivos de audio",
-  "devices.audio.defaultLabel": "Predeterminado del sistema",
-  "devices.audio.disable": "Apagar micrófono",
-  "devices.audio.enable": "Encender micrófono",
-  "devices.audio.microphone.ariaLabel": "activar/desactivar audio",
-  "devices.audio.microphone.full": "Micrófono",
-  "devices.audio.microphone.short": "Mic",
-  "devices.audio.microphone.state.on": "Encender micrófono",
-  "devices.audio.microphone.state.off": "Apagar micrófono",
-  "devices.audio.noiseSuppression": "Supresión avanzada de ruido",
-  "devices.audio.speakers.full": "Bocinas",
-  "devices.buttons.ariaLabel": "botón dividido",
-  "devices.settings.ariaLabel": "configuración de dispositivos",
-  "devices.video.ariaLabel": "menú de dispositivos de video",
-  "devices.video.blur.ariaLabel": "Activar/desactivar desenfoque de fondo",
-  "devices.video.blur.label": "Desenfocar fondo",
-  "devices.video.camera.ariaLabel": "activar/desactivar video",
-  "devices.video.camera.button.ariaLabel": "video",
-  "devices.video.camera.state.on": "Encender cámara",
-  "devices.video.camera.state.off": "Apagar cámara",
-  "devices.video.camera.full": "Cámara",
-  "devices.video.disable": "Apagar video",
-  "devices.video.enable": "Encender video",
-  "emoji.ariaLabel": "abrir menú de emojis",
-  "emoji.tooltip": "Exprésate",
-  "errors.unknown": "Ocurrió un error desconocido",
-  "feedbackForm.ariaLabel": "abrir/cerrar formulario de reporte",
-  "feedbackForm.close": "Cerrar formulario",
-  "feedbackForm.disclaiamer.label": "Por favor no incluyas datos sensibles.",
-  "feedbackForm.disclaiamer.screenshot": "Una captura de pantalla nos ayuda a entender mejor el problema (opcional).",
-  "feedbackForm.field.issue.label": "Describe el problema",
-  "feedbackForm.field.issue.type": "Descripción",
-  "feedbackForm.field.name.label": "Tu nombre",
-  "feedbackForm.field.name.type": "Nombre",
-  "feedbackForm.field.title.label": "Cuando pasó el problema, ¿qué estabas haciendo?",
-  "feedbackForm.field.title.type": "Título",
-  "feedbackForm.helperText.error": "{{field}} es obligatorio y debe tener menos de {{limit}} caracteres",
-  "feedbackForm.open": "Abrir formulario de reporte",
-  "feedbackForm.submitted.content": "¡Gracias! Tu aporte nos ayuda a mejorar la aplicación y resolver problemas.",
-  "feedbackForm.submitted.error": "Algo salió mal. Intenta de nuevo.",
-  "feedbackForm.submitted.thanks": "¡Gracias por tus comentarios!",
-  "feedbackForm.submitted.track": "Puedes dar seguimiento aquí.",
-  "feedbackForm.title": "Reportar problema",
-  "filePicker.addScreenshot": "Agregar captura",
-  "filePicker.attachedScreenshot": "Captura adjunta",
-  "filePicker.capture": "Tomar captura de pantalla",
-  "filePicker.delete": "Eliminar captura",
-  "filePicker.sizeLimit": "El tamaño máximo es 20MB. Sube otro archivo.",
-  "footer.github.title": "Aplicación de referencia de video de Vonage",
-  "imageStorage.imagesExceedSize": "Las imágenes son muy grandes para guardar (~4MB máx).",
-  "imageStorage.storageFailure": "No se pudieron guardar las imágenes en el almacenamiento local.",
-  "imageStorage.duplicateImage": "Esta imagen ya fue agregada.",
-  "imageStorage.fileReadError": "No se pudo leer el archivo de imagen.",
-  "imageStorage.invalidExtension": "Extensión de imagen no válida.",
-  "imageStorage.invalidUrl": "URL de imagen no válida.",
-  "imageStorage.convertError": "No se pudo convertir la imagen.",
-  "imageStorage.loadError": "No se pudo cargar la imagen.",
-  "githubTooltip": "Visita nuestro repositorio en GitHub",
-  "goodBye.back": "Regresar al inicio",
-  "goodBye.reEnter": "Volver a entrar",
-  "goodbye.default.header": "Saliste de la sala",
-  "goodbye.default.message": "Esperamos que la hayas pasado bien",
-  "landing.welcome.subtitle": "Impulsa tu negocio con videos que transforman la satisfacción del cliente.",
-  "landing.welcome.title.1": "Mejora",
-  "landing.welcome.title.2": "la comunicación",
-  "landing.welcome.title.3": "por video",
-  "landing.primary.word": "video",
-  "layout.tooltip.isPinningPresent": "No se puede cambiar el diseño mientras alguien esté fijado",
-  "layout.tooltip.isScreenSharePresent": "No se puede cambiar el diseño mientras se comparte pantalla",
-  "layout.tooltip.switchToActiveSpeaker": "Cambiar a vista de orador activo",
-  "layout.tooltip.switchToGrid": "Cambiar a vista de cuadrícula",
-  "mutedAlert.message.forceMuted": "Otro participante te silenció. Haz clic en el micrófono para activarlo.",
-  "mutedAlert.message.muted": "¿Estás hablando? Tu micrófono está apagado. Haz clic en el micrófono para encenderlo.",
-  "participants.list.ariaLabel": "abrir/cerrar lista de participantes",
-  "participants.list.close": "Cerrar lista de participantes",
-  "participants.list.open": "Abrir lista de participantes",
-  "participants.maxPin": "No puedes fijar más mosaicos",
-  "participants.mute.dialog.content": "¿Silenciar a {{participantName}} para todos en la llamada? Solo {{participantName}} puede encenderse de nuevo.",
-  "participants.mute.tooltip": "Silenciar micrófono de {{participantName}}",
-  "participants.pin": "Fijar a {{participantName}}",
-  "participants.pin.video": "Fijar video de {{participantName}}",
-  "participants.screen": "Pantalla de {{participantName}}",
-  "participants.title": "Participantes",
-  "participants.unpin": "Quitar fijación de {{participantName}}",
-  "participants.unpin.video": "Quitar fijación de video de {{participantName}}",
-  "publishingErrors.accessDenied.message": "Parece que tu navegador bloqueó el acceso a tu {{device}}. Restablece los permisos desde la configuración.",
-  "publishingErrors.accessDenied.title": "Acceso a {{device}} denegado",
-  "publishingErrors.blocked.message": "No pudimos conectarte con la sala. Revisa tu conexión e inténtalo de nuevo.",
-  "publishingErrors.blocked.title": "Problemas para entrar a la sala",
-  "subscribingErrors.blocked.message": "No pudimos conectarte con la sala. Revisa tu conexión e inténtalo de nuevo.",
-  "subscribingErrors.blocked.title": "Problemas para entrar a la sala",
-  "recording.start.dialog.content": "¡Asegúrate que todos estén listos! Podrás descargar la grabación en la página de \"Despedida\" al salir.",
-  "recording.start.dialog.title": "¿Iniciar grabación?",
-  "recording.start.title": "Iniciar grabación",
-  "recording.stop.dialog.content": "Podrás descargar la grabación en la página de \"Despedida\" al salir.",
-  "recording.stop.dialog.title": "¿Detener grabación?",
-  "recording.stop.title": "Detener grabación",
-  "recording.tooltip.ariaLabel": "diseño de video",
-  "room.exit.ariaLabel": "salir",
-  "room.exit.tooltip": "Salir de la reunión",
-  "room.input.helper": "No se permite dejar el campo vacío, espacios ni caracteres especiales",
-  "room.input.label": "Nombre de sala",
-  "screenSharing.dialog.action": "Comenzar a compartir pantalla",
-  "screenSharing.dialog.content": "Alguien más está compartiendo pantalla. Si continúas, su pantalla dejará de mostrarse.",
-  "screenSharing.dialog.title": "¿Quieres compartir tu pantalla?",
-  "screenSharing.title.start": "Iniciar compartir pantalla",
-  "screenSharing.title.stop": "Dejar de compartir pantalla",
-  "screenSharing.tooltip.ariaLabel": "Iniciar o detener compartir pantalla",
-  "soundTest.start": "Probar bocinas",
-  "soundTest.stop": "Detener prueba",
-  "toolbar.tooltip.ariaLabel": "abrir menú extra de la barra",
-  "toolbar.tooltip.title": "Acceder a opciones adicionales",
-  "unsupportedBrowser.header": "Tu navegador no es compatible",
-  "unsupportedBrowser.message": "Usa alguno de nuestros navegadores compatibles.",
-  "unsupportedBrowser.supported.downloadLink": "Descargar {{browser}}",
-  "unsupportedBrowser.supported.title": "Navegadores compatibles:",
-  "unknown.device": "Dispositivo desconocido",
-  "user.unknown": "usuario desconocido",
-  "user.you": "Tú",
-  "waitingRoom.title": "Prepárate para unirte:",
-  "waitingRoom.user.input.label": "¿Cuál es tu nombre?",
-  "waitingRoom.user.input.placeholder": "Escribe tu nombre",
-  "zoom.reset": "Restablecer zoom",
-  "zoom.start": "Iniciar zoom",
-  "zoom.out": "Alejar zoom",
-  "zoom.in": "Acercar zoom",
-  "zoom.current": "Zoom actual"
+    "archiveList.archive.createdAt": "Iniciada el: {{createdAt}}",
+    "archiveList.archive.index": "Grabación {{index}}",
+    "archiveList.download.tooltip": "Descargar grabación {{id}}",
+    "archiveList.empty": "No hay grabaciones de esta reunión",
+    "archiveList.error.text": "Ocurrió un error al cargar las grabaciones de esta reunión",
+    "archiveList.error.tooltip": "Esta grabación falló o ya expiró",
+    "archiveList.label": "Grabaciones",
+    "archiveList.loading.tooltip": "Esta grabación aún no está lista para descargarse",
+    "backgroundEffects.ariaLabel": "efectos de fondo",
+    "backgroundEffects.choice": "Elige un efecto de fondo",
+    "backgroundEffects.limit": "Llegaste al límite máximo de imágenes personalizadas",
+    "backgroundEffects.recommended.note": "Nota: Las imágenes solo se guardan localmente en tu navegador.",
+    "backgroundEffects.recommended.specs": "Recomendado: imagen JPG/PNG de 1280x720 de resolución.",
+    "backgroundEffects.title": "Efectos de fondo",
+    "backgroundEffects.title.tabs": "Tabs de efectos de fondo",
+    "backgroundEffects.tabs.backgrounds": "Fondos",
+    "backgroundEffects.tabs.addBackground": "Agregar fondo",
+    "backgroundEffects.video.disabled": "No tienes habilitado el video",
+    "backgroundEffects.invalidFileType": "Solo se permiten imágenes JPG, PNG, GIF o BMP.",
+    "backgroundEffects.fileTooLarge": "La imagen debe pesar menos de {{maxSize}}MB.",
+    "backgroundEffects.processingError": "No se pudo procesar la imagen subida.",
+    "backgroundEffects.storageError": "No se pudo guardar la imagen.",
+    "backgroundEffects.linkPlaceholder": "Liga desde la web",
+    "backgroundEffects.dragDropText": "Arrastra y suelta, o da clic aquí para subir imagen,",
+    "backgroundEffects.maxSize": "Máx {{maxSize}}MB",
+    "backgroundEffects.removeBackground": "Quitar fondo",
+    "backgroundEffects.slightBlur": "Desenfoque ligero del fondo",
+    "backgroundEffects.strongBlur": "Desenfoque fuerte del fondo",
+    "backgroundEffects.yourBackground": "Tu fondo",
+    "backgroundEffects.deleteTooltipInUse": "No puedes eliminar este fondo mientras esté en uso",
+    "backgroundEffects.deleteTooltip": "Eliminar fondo",
+    "backgroundEffects.deleteAriaLabel": "Eliminar fondo personalizado",
+    "backgroundEffects.backgrounds.bookshelfRoom": "Cuarto con librero",
+    "backgroundEffects.backgrounds.busyRoom": "Sala ocupada",
+    "backgroundEffects.backgrounds.duneView": "Vista de dunas",
+    "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
+    "backgroundEffects.backgrounds.library": "Biblioteca",
+    "backgroundEffects.backgrounds.newYork": "Nueva York",
+    "backgroundEffects.backgrounds.plane": "Avión",
+    "backgroundEffects.backgrounds.whiteRoom": "Cuarto blanco",
+    "button.apply": "Aplicar",
+    "button.camera": "Cámara",
+    "button.cancel": "Cancelar",
+    "button.close": "Cerrar",
+    "button.createRoom": "Crear una nueva sala",
+    "button.startNewRoom": "Iniciar una nueva videoconferencia",
+    "button.joinExistingMeeting": "Unirse a una reunión existente",
+    "button.joinWaitingRoom": "Unirse a la sala de espera",
+    "button.join": "Unirse a la reunión",
+    "button.mute": "Silenciar",
+    "button.send": "Enviar",
+    "button.speaker": "Altavoz",
+    "captions.ariaLabel": "botón de subtítulos",
+    "captions.disable": "Desactivar subtítulos",
+    "captions.enable": "Activar subtítulos",
+    "captions.errors": "Error en subtítulos: {{captionsErrorResponse}}",
+    "chat.ariaLabel": "abrir/cerrar chat",
+    "chat.close": "Cerrar chat",
+    "chat.copied": "Copiado",
+    "chat.copy": "Copiar al portapapeles",
+    "chat.input.placeholder": "Escribe un mensaje",
+    "chat.meetingUrl": "URL de la reunión:",
+    "chat.open": "Abrir chat",
+    "chat.title": "Chat",
+    "common.or": "o",
+    "connectionAlert.quality.message": "Revisa tu conexión. Tu video puede desactivarse para mejorar la experiencia.",
+    "connectionAlert.quality.title": "Problema de calidad de video",
+    "connectionAlert.reconnecting.message": "Revisa tu conexión de internet",
+    "connectionAlert.reconnecting.title": "Conexión perdida",
+    "deviceAccessAlert.askDeviceMessage": "Para entrar a la sala de video, tu navegador pedirá acceso a la cámara y el micrófono.",
+    "deviceAccessAlert.deniedDeviceMessage": "Parece que tu navegador tiene bloqueado el acceso a tu cámara o micrófono. Restablece los permisos desde la configuración del navegador.",
+    "deviceAccessAlert.imageAlt": "Diálogo de acceso",
+    "devices.audio.ariaLabel": "menú de dispositivos de audio",
+    "devices.audio.defaultLabel": "Predeterminado del sistema",
+    "devices.audio.disable": "Apagar micrófono",
+    "devices.audio.enable": "Encender micrófono",
+    "devices.audio.microphone.ariaLabel": "activar/desactivar audio",
+    "devices.audio.microphone.full": "Micrófono",
+    "devices.audio.microphone.short": "Mic",
+    "devices.audio.microphone.state.on": "Encender micrófono",
+    "devices.audio.microphone.state.off": "Apagar micrófono",
+    "devices.audio.noiseSuppression": "Supresión avanzada de ruido",
+    "devices.audio.speakers.full": "Bocinas",
+    "devices.buttons.ariaLabel": "botón dividido",
+    "devices.settings.ariaLabel": "configuración de dispositivos",
+    "devices.video.ariaLabel": "menú de dispositivos de video",
+    "devices.video.blur.ariaLabel": "Activar/desactivar desenfoque de fondo",
+    "devices.video.blur.label": "Desenfocar fondo",
+    "devices.video.camera.ariaLabel": "activar/desactivar video",
+    "devices.video.camera.state.on": "Encender cámara",
+    "devices.video.camera.state.off": "Apagar cámara",
+    "devices.video.camera.full": "Cámara",
+    "devices.video.disable": "Apagar video",
+    "devices.video.enable": "Encender video",
+    "emoji.ariaLabel": "abrir menú de emojis",
+    "emoji.tooltip": "Exprésate",
+    "errors.unknown": "Ocurrió un error desconocido",
+    "feedbackForm.ariaLabel": "abrir/cerrar formulario de reporte",
+    "feedbackForm.close": "Cerrar formulario",
+    "feedbackForm.disclaiamer.label": "Por favor no incluyas datos sensibles.",
+    "feedbackForm.disclaiamer.screenshot": "Una captura de pantalla nos ayuda a entender mejor el problema (opcional).",
+    "feedbackForm.field.issue.label": "Describe el problema",
+    "feedbackForm.field.issue.type": "Descripción",
+    "feedbackForm.field.name.label": "Tu nombre",
+    "feedbackForm.field.name.type": "Nombre",
+    "feedbackForm.field.title.label": "Cuando pasó el problema, ¿qué estabas haciendo?",
+    "feedbackForm.field.title.type": "Título",
+    "feedbackForm.helperText.error": "{{field}} es obligatorio y debe tener menos de {{limit}} caracteres",
+    "feedbackForm.open": "Abrir formulario de reporte",
+    "feedbackForm.submitted.content": "¡Gracias! Tu aporte nos ayuda a mejorar la aplicación y resolver problemas.",
+    "feedbackForm.submitted.error": "Algo salió mal. Intenta de nuevo.",
+    "feedbackForm.submitted.thanks": "¡Gracias por tus comentarios!",
+    "feedbackForm.submitted.track": "Puedes dar seguimiento aquí.",
+    "feedbackForm.title": "Reportar problema",
+    "filePicker.addScreenshot": "Agregar captura",
+    "filePicker.attachedScreenshot": "Captura adjunta",
+    "filePicker.capture": "Tomar captura de pantalla",
+    "filePicker.delete": "Eliminar captura",
+    "filePicker.sizeLimit": "El tamaño máximo es 20MB. Sube otro archivo.",
+    "footer.github.title": "Aplicación de referencia de video de Vonage",
+    "imageStorage.imagesExceedSize": "Las imágenes son muy grandes para guardar (~4MB máx).",
+    "imageStorage.storageFailure": "No se pudieron guardar las imágenes en el almacenamiento local.",
+    "imageStorage.duplicateImage": "Esta imagen ya fue agregada.",
+    "imageStorage.fileReadError": "No se pudo leer el archivo de imagen.",
+    "imageStorage.invalidExtension": "Extensión de imagen no válida.",
+    "imageStorage.invalidUrl": "URL de imagen no válida.",
+    "imageStorage.convertError": "No se pudo convertir la imagen.",
+    "imageStorage.loadError": "No se pudo cargar la imagen.",
+    "githubTooltip": "Visita nuestro repositorio en GitHub",
+    "goodBye.back": "Regresar al inicio",
+    "goodBye.reEnter": "Volver a entrar",
+    "goodbye.default.header": "Saliste de la sala",
+    "goodbye.default.message": "Esperamos que la hayas pasado bien",
+    "landing.welcome.subtitle": "Impulsa tu negocio con videos que transforman la satisfacción del cliente.",
+    "landing.welcome.title.1": "Mejora",
+    "landing.welcome.title.2": "la comunicación",
+    "landing.welcome.title.3": "por video",
+    "landing.primary.word": "video",
+    "layout.tooltip.isPinningPresent": "No se puede cambiar el diseño mientras alguien esté fijado",
+    "layout.tooltip.isScreenSharePresent": "No se puede cambiar el diseño mientras se comparte pantalla",
+    "layout.tooltip.switchToActiveSpeaker": "Cambiar a vista de orador activo",
+    "layout.tooltip.switchToGrid": "Cambiar a vista de cuadrícula",
+    "mutedAlert.message.forceMuted": "Otro participante te silenció. Haz clic en el micrófono para activarlo.",
+    "mutedAlert.message.muted": "¿Estás hablando? Tu micrófono está apagado. Haz clic en el micrófono para encenderlo.",
+    "participants.list.ariaLabel": "abrir/cerrar lista de participantes",
+    "participants.list.close": "Cerrar lista de participantes",
+    "participants.list.open": "Abrir lista de participantes",
+    "participants.maxPin": "No puedes fijar más mosaicos",
+    "participants.mute.dialog.content": "¿Silenciar a {{participantName}} para todos en la llamada? Solo {{participantName}} puede encenderse de nuevo.",
+    "participants.mute.tooltip": "Silenciar micrófono de {{participantName}}",
+    "participants.pin": "Fijar a {{participantName}}",
+    "participants.pin.video": "Fijar video de {{participantName}}",
+    "participants.screen": "Pantalla de {{participantName}}",
+    "participants.title": "Participantes",
+    "participants.unpin": "Quitar fijación de {{participantName}}",
+    "participants.unpin.video": "Quitar fijación de video de {{participantName}}",
+    "publishingErrors.accessDenied.message": "Parece que tu navegador bloqueó el acceso a tu {{device}}. Restablece los permisos desde la configuración.",
+    "publishingErrors.accessDenied.title": "Acceso a {{device}} denegado",
+    "publishingErrors.blocked.message": "No pudimos conectarte con la sala. Revisa tu conexión e inténtalo de nuevo.",
+    "publishingErrors.blocked.title": "Problemas para entrar a la sala",
+    "subscribingErrors.blocked.message": "No pudimos conectarte con la sala. Revisa tu conexión e inténtalo de nuevo.",
+    "subscribingErrors.blocked.title": "Problemas para entrar a la sala",
+    "recording.start.dialog.content": "¡Asegúrate que todos estén listos! Podrás descargar la grabación en la página de \"Despedida\" al salir.",
+    "recording.start.dialog.title": "¿Iniciar grabación?",
+    "recording.start.title": "Iniciar grabación",
+    "recording.stop.dialog.content": "Podrás descargar la grabación en la página de \"Despedida\" al salir.",
+    "recording.stop.dialog.title": "¿Detener grabación?",
+    "recording.stop.title": "Detener grabación",
+    "recording.tooltip.ariaLabel": "diseño de video",
+    "room.exit.ariaLabel": "salir",
+    "room.exit.tooltip": "Salir de la reunión",
+    "room.input.helper": "No se permite dejar el campo vacío, espacios ni caracteres especiales",
+    "room.input.label": "Nombre de sala",
+    "screenSharing.dialog.action": "Comenzar a compartir pantalla",
+    "screenSharing.dialog.content": "Alguien más está compartiendo pantalla. Si continúas, su pantalla dejará de mostrarse.",
+    "screenSharing.dialog.title": "¿Quieres compartir tu pantalla?",
+    "screenSharing.title.start": "Iniciar compartir pantalla",
+    "screenSharing.title.stop": "Dejar de compartir pantalla",
+    "screenSharing.tooltip.ariaLabel": "Iniciar o detener compartir pantalla",
+    "soundTest.start": "Probar bocinas",
+    "soundTest.stop": "Detener prueba",
+    "toolbar.tooltip.ariaLabel": "abrir menú extra de la barra",
+    "toolbar.tooltip.title": "Acceder a opciones adicionales",
+    "unsupportedBrowser.header": "Tu navegador no es compatible",
+    "unsupportedBrowser.message": "Usa alguno de nuestros navegadores compatibles.",
+    "unsupportedBrowser.supported.downloadLink": "Descargar {{browser}}",
+    "unsupportedBrowser.supported.title": "Navegadores compatibles:",
+    "unknown.device": "Dispositivo desconocido",
+    "user.unknown": "usuario desconocido",
+    "user.you": "Tú",
+    "waitingRoom.title": "Prepárate para unirte",
+    "waitingRoom.user.input.title": "Escribe tu nombre",
+    "waitingRoom.user.input.label": "Nombre",
+    "waitingRoom.user.input.error": "El nombre no puede estar vacío ni contener caracteres especiales",
+    "zoom.reset": "Restablecer zoom",
+    "zoom.start": "Iniciar zoom",
+    "zoom.out": "Alejar zoom",
+    "zoom.in": "Acercar zoom",
+    "zoom.current": "Zoom actual"
 }
diff --git a/frontend/src/locales/es.json b/frontend/src/locales/es.json
index d87618eb2..86ef87a46 100644
--- a/frontend/src/locales/es.json
+++ b/frontend/src/locales/es.json
@@ -1,201 +1,201 @@
 {
-  "archiveList.archive.createdAt": "Iniciado en: {{createdAt}}",
-  "archiveList.archive.index": "Grabación {{index}}",
-  "archiveList.download.tooltip": "Descargar grabación {{id}}",
-  "archiveList.empty": "No hay grabaciones para esta reunión",
-  "archiveList.error.text": "Hubo un error al cargar las grabaciones de esta reunión",
-  "archiveList.error.tooltip": "Esta grabación falló o ha caducado",
-  "archiveList.label": "Grabaciones",
-  "archiveList.loading.tooltip": "Esta grabación aún no está lista para descargar",
-  "backgroundEffects.ariaLabel": "efectos de fondo",
-  "backgroundEffects.choice": "Elegir efecto de fondo",
-  "backgroundEffects.limit": "Has alcanzado el límite máximo de imágenes personalizadas",
-  "backgroundEffects.recommended.note": "Nota: Las imágenes se almacenan solo localmente en el navegador.",
-  "backgroundEffects.recommended.specs": "Recomendado: imagen JPG/PNG a 1280x720 de resolución.",
-  "backgroundEffects.title": "Efectos de fondo",
-  "backgroundEffects.title.tabs": "Pestañas de efectos de fondo",
-  "backgroundEffects.tabs.backgrounds": "Fondos",
-  "backgroundEffects.tabs.addBackground": "Añadir fondo",
-  "backgroundEffects.video.disabled": "No has habilitado el video",
-  "backgroundEffects.invalidFileType": "Solo se permiten imágenes JPG, PNG, GIF o BMP.",
-  "backgroundEffects.fileTooLarge": "La imagen debe ser menor a {{maxSize}}MB.",
-  "backgroundEffects.processingError": "Error al procesar la imagen subida.",
-  "backgroundEffects.storageError": "Error al guardar la imagen.",
-  "backgroundEffects.linkPlaceholder": "Enlace desde la web",
-  "backgroundEffects.dragDropText": "Arrastra y suelta, o haz clic aquí para subir imagen,",
-  "backgroundEffects.maxSize": "Máx {{maxSize}}MB",
-  "backgroundEffects.removeBackground": "Quitar fondo",
-  "backgroundEffects.slightBlur": "Desenfoque ligero del fondo",
-  "backgroundEffects.strongBlur": "Desenfoque fuerte del fondo",
-  "backgroundEffects.yourBackground": "Tu fondo",
-  "backgroundEffects.deleteTooltipInUse": "No puedes eliminar este fondo mientras esté en uso",
-  "backgroundEffects.deleteTooltip": "Eliminar fondo",
-  "backgroundEffects.deleteAriaLabel": "Eliminar fondo personalizado",
-  "backgroundEffects.backgrounds.bookshelfRoom": "Habitación con estantería",
-  "backgroundEffects.backgrounds.busyRoom": "Habitación ocupada",
-  "backgroundEffects.backgrounds.duneView": "Vista de dunas",
-  "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
-  "backgroundEffects.backgrounds.library": "Biblioteca",
-  "backgroundEffects.backgrounds.newYork": "Nueva York",
-  "backgroundEffects.backgrounds.plane": "Avión",
-  "backgroundEffects.backgrounds.whiteRoom": "Habitación blanca",
-  "button.apply": "Aplicar",
-  "button.camera": "Cámara",
-  "button.cancel": "Cancelar",
-  "button.close": "Cerrar",
-  "button.createRoom": "Crear una nueva sala",
-  "button.startNewRoom": "Iniciar una nueva videoconferencia",
-  "button.joinExistingMeeting": "Unirse a una reunión existente",
-  "button.joinWaitingRoom": "Unirse a la sala de espera",
-  "button.join": "Unirse",
-  "button.mute": "Silenciar",
-  "button.send": "Enviar",
-  "button.speaker": "Altavoz",
-  "captions.ariaLabel": "botón de subtítulos",
-  "captions.disable": "Desactivar subtítulos",
-  "captions.enable": "Activar subtítulos",
-  "captions.errors": "Error de subtítulos: {{captionsErrorResponse}}",
-  "chat.ariaLabel": "alternar chat",
-  "chat.close": "Cerrar chat",
-  "chat.copied": "Copiado",
-  "chat.copy": "Copiar al portapapeles",
-  "chat.input.placeholder": "Enviar un mensaje",
-  "chat.meetingUrl": "URL de la reunión:",
-  "chat.open": "Abrir chat",
-  "chat.title": "Chat",
-  "common.or": "o",
-  "connectionAlert.quality.message": "Por favor verifica tu conectividad. Tu video puede estar deshabilitado para mejorar la experiencia.",
-  "connectionAlert.quality.title": "Problema de calidad de video",
-  "connectionAlert.reconnecting.message": "Por favor verifica tu conexión de red",
-  "connectionAlert.reconnecting.title": "Conexión perdida",
-  "deviceAccessAlert.askDeviceMessage": "Para unirte a la sala de video, tu navegador solicitará acceso a tu cámara y micrófono.",
-  "deviceAccessAlert.deniedDeviceMessage": "Parece que tu navegador tiene bloqueado el acceso a tu cámara y/o micrófono. Restablece los permisos desde la interfaz del navegador.",
-  "deviceAccessAlert.imageAlt": "Diálogo de acceso",
-  "devices.audio.ariaLabel": "desplegable de dispositivos de audio",
-  "devices.audio.defaultLabel": "Predeterminado del sistema",
-  "devices.audio.disable": "Desactivar micrófono",
-  "devices.audio.enable": "Activar micrófono",
-  "devices.audio.microphone.ariaLabel": "alternar audio",
-  "devices.audio.microphone.full": "Micrófono",
-  "devices.audio.microphone.short": "Mic",
-  "devices.audio.microphone.state.on": "Activar micrófono",
-  "devices.audio.microphone.state.off": "Desactivar micrófono",
-  "devices.audio.noiseSuppression": "Supresión avanzada de ruido",
-  "devices.audio.speakers.full": "Altavoces",
-  "devices.buttons.ariaLabel": "botón dividido",
-  "devices.settings.ariaLabel": "configuración de dispositivos",
-  "devices.video.ariaLabel": "desplegable de dispositivos de video",
-  "devices.video.blur.ariaLabel": "Alternar desenfoque de fondo",
-  "devices.video.blur.label": "Desenfoca tu fondo",
-  "devices.video.camera.ariaLabel": "alternar video",
-  "devices.video.camera.button.ariaLabel": "video",
-  "devices.video.camera.state.on": "Activar cámara",
-  "devices.video.camera.state.off": "Desactivar cámara",
-  "devices.video.camera.full": "Cámara",
-  "devices.video.disable": "Desactivar video",
-  "devices.video.enable": "Activar video",
-  "emoji.ariaLabel": "abrir menú de emojis",
-  "emoji.tooltip": "Exprésate",
-  "errors.unknown": "Ocurrió un error desconocido",
-  "feedbackForm.ariaLabel": "alternar formulario de reporte",
-  "feedbackForm.close": "Cerrar formulario de reporte",
-  "feedbackForm.disclaiamer.label": "Por favor no incluyas información sensible.",
-  "feedbackForm.disclaiamer.screenshot": "Una captura de pantalla nos ayudará a entender mejor el problema. (opcional)",
-  "feedbackForm.field.issue.label": "Describe tu problema",
-  "feedbackForm.field.issue.type": "Descripción",
-  "feedbackForm.field.name.label": "Dinos tu nombre",
-  "feedbackForm.field.name.type": "Tu nombre",
-  "feedbackForm.field.title.label": "Cuando notaste este problema, ¿qué estabas intentando hacer?",
-  "feedbackForm.field.title.type": "Título",
-  "feedbackForm.helperText.error": "{{field}} es obligatorio y debe tener menos de {{limit}} caracteres",
-  "feedbackForm.open": "Abrir formulario de reporte",
-  "feedbackForm.submitted.content": "Agradecemos mucho tu aporte, nos ayuda a mejorar la aplicación y resolver problemas.",
-  "feedbackForm.submitted.error": "Algo salió mal. Por favor intenta de nuevo.",
-  "feedbackForm.submitted.thanks": "¡Gracias por tu feedback!",
-  "feedbackForm.submitted.track": "Sigue tu progreso aquí.",
-  "feedbackForm.title": "Reportar problema",
-  "filePicker.addScreenshot": "Agregar captura",
-  "filePicker.attachedScreenshot": "Captura adjunta",
-  "filePicker.capture": "Capturar pantalla",
-  "filePicker.delete": "Eliminar captura",
-  "filePicker.sizeLimit": "El tamaño máximo de carga es 20MB. Por favor sube otro archivo.",
-  "footer.github.title": "Aplicación de referencia de video de Vonage",
-  "imageStorage.imagesExceedSize": "Las imágenes son demasiado grandes para almacenar (~4MB máx).",
-  "imageStorage.storageFailure": "Error al guardar las imágenes en el almacenamiento local.",
-  "imageStorage.duplicateImage": "Esta imagen ya ha sido agregada.",
-  "imageStorage.fileReadError": "Error al leer el archivo de imagen.",
-  "imageStorage.invalidExtension": "Extensión de imagen no válida.",
-  "imageStorage.invalidUrl": "URL de imagen no válida.",
-  "imageStorage.convertError": "No se pudo convertir la imagen.",
-  "imageStorage.loadError": "No se pudo cargar la imagen.",
-  "githubTooltip": "Visita nuestro repositorio en GitHub",
-  "goodBye.back": "Volver a la página de inicio",
-  "goodBye.reEnter": "Volver a entrar",
-  "goodbye.default.header": "Saliste de la sala",
-  "goodbye.default.message": "Esperamos que te hayas divertido",
-  "landing.welcome.subtitle": "Impulsa tu negocio con vídeos que transforman la satisfacción del cliente.",
-  "landing.welcome.title.1": "Mejora",
-  "landing.welcome.title.2": "la comunicación",
-  "landing.welcome.title.3": "por vídeo",
-  "landing.primary.word": "vídeo",
-  "layout.tooltip.isPinningPresent": "No se puede cambiar el diseño mientras un participante está fijado",
-  "layout.tooltip.isScreenSharePresent": "No se puede cambiar el diseño mientras se comparte pantalla",
-  "layout.tooltip.switchToActiveSpeaker": "Cambiar al diseño de orador activo",
-  "layout.tooltip.switchToGrid": "Cambiar al diseño de cuadrícula",
-  "mutedAlert.message.forceMuted": "Has sido silenciado por otro participante. Haz clic en el micrófono para activarlo.",
-  "mutedAlert.message.muted": "¿Estás hablando? Tu micrófono está apagado. Haz clic en el micrófono para encenderlo.",
-  "participants.list.ariaLabel": "alternar lista de participantes",
-  "participants.list.close": "Cerrar lista de participantes",
-  "participants.list.open": "Abrir lista de participantes",
-  "participants.maxPin": "No puedes fijar más mosaicos",
-  "participants.mute.dialog.content": "¿Silenciar a {{participantName}} para todos en la llamada? Solo {{participantName}} puede activarse de nuevo.",
-  "participants.mute.tooltip": "Silenciar el micrófono de {{participantName}}",
-  "participants.pin": "Fijar a {{participantName}}",
-  "participants.pin.video": "Fijar el video de {{participantName}}",
-  "participants.screen": "Pantalla de {{participantName}}",
-  "participants.title": "Participantes",
-  "participants.unpin": "Desfijar a {{participantName}}",
-  "participants.unpin.video": "Desfijar el video de {{participantName}}",
-  "publishingErrors.accessDenied.message": "Parece que tu navegador tiene bloqueado el acceso a tu {{device}}. Restablece los permisos desde la interfaz del navegador.",
-  "publishingErrors.accessDenied.title": "Acceso a {{device}} denegado",
-  "publishingErrors.blocked.message": "Tenemos problemas para conectarte con otros en la sala. Por favor revisa tu red e intenta de nuevo.",
-  "publishingErrors.blocked.title": "Dificultades para unirse a la sala",
-  "subscribingErrors.blocked.message": "Tenemos problemas para conectarte con otros en la sala. Por favor revisa tu red e intenta de nuevo.",
-  "subscribingErrors.blocked.title": "Dificultades para unirse a la sala",
-  "recording.start.dialog.content": "¡Asegúrate de que todos estén listos! Puedes descargar la grabación desde la página de \"Despedida\" después de salir de la sala.",
-  "recording.start.dialog.title": "¿Iniciar grabación?",
-  "recording.start.title": "Iniciar grabación",
-  "recording.stop.dialog.content": "Puedes descargar la grabación desde la página de \"Despedida\" después de salir de la sala.",
-  "recording.stop.dialog.title": "¿Detener grabación?",
-  "recording.stop.title": "Detener grabación",
-  "recording.tooltip.ariaLabel": "diseño de video",
-  "room.exit.ariaLabel": "salir",
-  "room.exit.tooltip": "Salir de la reunión",
-  "room.input.helper": "No se permite dejar el campo vacío, espacios ni caracteres especiales",
-  "room.input.label": "Nombre de sala",
-  "screenSharing.dialog.action": "Comenzar a compartir tu pantalla",
-  "screenSharing.dialog.content": "Parece que alguien más está compartiendo su pantalla. Si continúas, su pantalla dejará de compartirse.",
-  "screenSharing.dialog.title": "¿Deseas compartir tu pantalla?",
-  "screenSharing.title.start": "Iniciar compartir pantalla",
-  "screenSharing.title.stop": "Detener compartir pantalla",
-  "screenSharing.tooltip.ariaLabel": "Iniciar o detener compartir pantalla",
-  "soundTest.start": "Probar altavoces",
-  "soundTest.stop": "Detener prueba",
-  "toolbar.tooltip.ariaLabel": "abrir menú de barra de herramientas adicional",
-  "toolbar.tooltip.title": "Acceder a elementos adicionales de la barra",
-  "unsupportedBrowser.header": "Tu navegador no es compatible",
-  "unsupportedBrowser.message": "Por favor usa uno de nuestros navegadores compatibles.",
-  "unsupportedBrowser.supported.downloadLink": "Enlace de descarga para {{browser}}",
-  "unsupportedBrowser.supported.title": "Navegadores compatibles:",
-  "unknown.device": "Dispositivo desconocido",
-  "user.unknown": "usuario desconocido",
-  "user.you": "Tú",
-  "waitingRoom.title": "Prepararse para unirse:",
-  "waitingRoom.user.input.label": "¿Cuál es tu nombre?",
-  "waitingRoom.user.input.placeholder": "Ingresa tu nombre",
-  "zoom.reset": "Restablecer zoom",
-  "zoom.start": "Iniciar zoom",
-  "zoom.out": "Alejar zoom",
-  "zoom.in": "Acercar zoom",
-  "zoom.current": "Zoom actual"
+    "archiveList.archive.createdAt": "Iniciado en: {{createdAt}}",
+    "archiveList.archive.index": "Grabación {{index}}",
+    "archiveList.download.tooltip": "Descargar grabación {{id}}",
+    "archiveList.empty": "No hay grabaciones para esta reunión",
+    "archiveList.error.text": "Hubo un error al cargar las grabaciones de esta reunión",
+    "archiveList.error.tooltip": "Esta grabación falló o ha caducado",
+    "archiveList.label": "Grabaciones",
+    "archiveList.loading.tooltip": "Esta grabación aún no está lista para descargar",
+    "backgroundEffects.ariaLabel": "efectos de fondo",
+    "backgroundEffects.choice": "Elegir efecto de fondo",
+    "backgroundEffects.limit": "Has alcanzado el límite máximo de imágenes personalizadas",
+    "backgroundEffects.recommended.note": "Nota: Las imágenes se almacenan solo localmente en el navegador.",
+    "backgroundEffects.recommended.specs": "Recomendado: imagen JPG/PNG a 1280x720 de resolución.",
+    "backgroundEffects.title": "Efectos de fondo",
+    "backgroundEffects.title.tabs": "Pestañas de efectos de fondo",
+    "backgroundEffects.tabs.backgrounds": "Fondos",
+    "backgroundEffects.tabs.addBackground": "Añadir fondo",
+    "backgroundEffects.video.disabled": "No has habilitado el video",
+    "backgroundEffects.invalidFileType": "Solo se permiten imágenes JPG, PNG, GIF o BMP.",
+    "backgroundEffects.fileTooLarge": "La imagen debe ser menor a {{maxSize}}MB.",
+    "backgroundEffects.processingError": "Error al procesar la imagen subida.",
+    "backgroundEffects.storageError": "Error al guardar la imagen.",
+    "backgroundEffects.linkPlaceholder": "Enlace desde la web",
+    "backgroundEffects.dragDropText": "Arrastra y suelta, o haz clic aquí para subir imagen,",
+    "backgroundEffects.maxSize": "Máx {{maxSize}}MB",
+    "backgroundEffects.removeBackground": "Quitar fondo",
+    "backgroundEffects.slightBlur": "Desenfoque ligero del fondo",
+    "backgroundEffects.strongBlur": "Desenfoque fuerte del fondo",
+    "backgroundEffects.yourBackground": "Tu fondo",
+    "backgroundEffects.deleteTooltipInUse": "No puedes eliminar este fondo mientras esté en uso",
+    "backgroundEffects.deleteTooltip": "Eliminar fondo",
+    "backgroundEffects.deleteAriaLabel": "Eliminar fondo personalizado",
+    "backgroundEffects.backgrounds.bookshelfRoom": "Habitación con estantería",
+    "backgroundEffects.backgrounds.busyRoom": "Habitación ocupada",
+    "backgroundEffects.backgrounds.duneView": "Vista de dunas",
+    "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
+    "backgroundEffects.backgrounds.library": "Biblioteca",
+    "backgroundEffects.backgrounds.newYork": "Nueva York",
+    "backgroundEffects.backgrounds.plane": "Avión",
+    "backgroundEffects.backgrounds.whiteRoom": "Habitación blanca",
+    "button.apply": "Aplicar",
+    "button.camera": "Cámara",
+    "button.cancel": "Cancelar",
+    "button.close": "Cerrar",
+    "button.createRoom": "Crear una nueva sala",
+    "button.startNewRoom": "Iniciar una nueva videoconferencia",
+    "button.joinExistingMeeting": "Unirse a una reunión existente",
+    "button.joinWaitingRoom": "Unirse a la sala de espera",
+    "button.join": "Unirse a la reunión",
+    "button.mute": "Silenciar",
+    "button.send": "Enviar",
+    "button.speaker": "Altavoz",
+    "captions.ariaLabel": "botón de subtítulos",
+    "captions.disable": "Desactivar subtítulos",
+    "captions.enable": "Activar subtítulos",
+    "captions.errors": "Error de subtítulos: {{captionsErrorResponse}}",
+    "chat.ariaLabel": "alternar chat",
+    "chat.close": "Cerrar chat",
+    "chat.copied": "Copiado",
+    "chat.copy": "Copiar al portapapeles",
+    "chat.input.placeholder": "Enviar un mensaje",
+    "chat.meetingUrl": "URL de la reunión:",
+    "chat.open": "Abrir chat",
+    "chat.title": "Chat",
+    "common.or": "o",
+    "connectionAlert.quality.message": "Por favor verifica tu conectividad. Tu video puede estar deshabilitado para mejorar la experiencia.",
+    "connectionAlert.quality.title": "Problema de calidad de video",
+    "connectionAlert.reconnecting.message": "Por favor verifica tu conexión de red",
+    "connectionAlert.reconnecting.title": "Conexión perdida",
+    "deviceAccessAlert.askDeviceMessage": "Para unirte a la sala de video, tu navegador solicitará acceso a tu cámara y micrófono.",
+    "deviceAccessAlert.deniedDeviceMessage": "Parece que tu navegador tiene bloqueado el acceso a tu cámara y/o micrófono. Restablece los permisos desde la interfaz del navegador.",
+    "deviceAccessAlert.imageAlt": "Diálogo de acceso",
+    "devices.audio.ariaLabel": "desplegable de dispositivos de audio",
+    "devices.audio.defaultLabel": "Predeterminado del sistema",
+    "devices.audio.disable": "Desactivar micrófono",
+    "devices.audio.enable": "Activar micrófono",
+    "devices.audio.microphone.ariaLabel": "alternar audio",
+    "devices.audio.microphone.full": "Micrófono",
+    "devices.audio.microphone.short": "Mic",
+    "devices.audio.microphone.state.on": "Activar micrófono",
+    "devices.audio.microphone.state.off": "Desactivar micrófono",
+    "devices.audio.noiseSuppression": "Supresión avanzada de ruido",
+    "devices.audio.speakers.full": "Altavoces",
+    "devices.buttons.ariaLabel": "botón dividido",
+    "devices.settings.ariaLabel": "configuración de dispositivos",
+    "devices.video.ariaLabel": "desplegable de dispositivos de video",
+    "devices.video.blur.ariaLabel": "Alternar desenfoque de fondo",
+    "devices.video.blur.label": "Desenfoca tu fondo",
+    "devices.video.camera.ariaLabel": "alternar video",
+    "devices.video.camera.state.on": "Activar cámara",
+    "devices.video.camera.state.off": "Desactivar cámara",
+    "devices.video.camera.full": "Cámara",
+    "devices.video.disable": "Desactivar video",
+    "devices.video.enable": "Activar video",
+    "emoji.ariaLabel": "abrir menú de emojis",
+    "emoji.tooltip": "Exprésate",
+    "errors.unknown": "Ocurrió un error desconocido",
+    "feedbackForm.ariaLabel": "alternar formulario de reporte",
+    "feedbackForm.close": "Cerrar formulario de reporte",
+    "feedbackForm.disclaiamer.label": "Por favor no incluyas información sensible.",
+    "feedbackForm.disclaiamer.screenshot": "Una captura de pantalla nos ayudará a entender mejor el problema. (opcional)",
+    "feedbackForm.field.issue.label": "Describe tu problema",
+    "feedbackForm.field.issue.type": "Descripción",
+    "feedbackForm.field.name.label": "Dinos tu nombre",
+    "feedbackForm.field.name.type": "Tu nombre",
+    "feedbackForm.field.title.label": "Cuando notaste este problema, ¿qué estabas intentando hacer?",
+    "feedbackForm.field.title.type": "Título",
+    "feedbackForm.helperText.error": "{{field}} es obligatorio y debe tener menos de {{limit}} caracteres",
+    "feedbackForm.open": "Abrir formulario de reporte",
+    "feedbackForm.submitted.content": "Agradecemos mucho tu aporte, nos ayuda a mejorar la aplicación y resolver problemas.",
+    "feedbackForm.submitted.error": "Algo salió mal. Por favor intenta de nuevo.",
+    "feedbackForm.submitted.thanks": "¡Gracias por tu feedback!",
+    "feedbackForm.submitted.track": "Sigue tu progreso aquí.",
+    "feedbackForm.title": "Reportar problema",
+    "filePicker.addScreenshot": "Agregar captura",
+    "filePicker.attachedScreenshot": "Captura adjunta",
+    "filePicker.capture": "Capturar pantalla",
+    "filePicker.delete": "Eliminar captura",
+    "filePicker.sizeLimit": "El tamaño máximo de carga es 20MB. Por favor sube otro archivo.",
+    "footer.github.title": "Aplicación de referencia de video de Vonage",
+    "imageStorage.imagesExceedSize": "Las imágenes son demasiado grandes para almacenar (~4MB máx).",
+    "imageStorage.storageFailure": "Error al guardar las imágenes en el almacenamiento local.",
+    "imageStorage.duplicateImage": "Esta imagen ya ha sido agregada.",
+    "imageStorage.fileReadError": "Error al leer el archivo de imagen.",
+    "imageStorage.invalidExtension": "Extensión de imagen no válida.",
+    "imageStorage.invalidUrl": "URL de imagen no válida.",
+    "imageStorage.convertError": "No se pudo convertir la imagen.",
+    "imageStorage.loadError": "No se pudo cargar la imagen.",
+    "githubTooltip": "Visita nuestro repositorio en GitHub",
+    "goodBye.back": "Volver a la página de inicio",
+    "goodBye.reEnter": "Volver a entrar",
+    "goodbye.default.header": "Saliste de la sala",
+    "goodbye.default.message": "Esperamos que te hayas divertido",
+    "landing.welcome.subtitle": "Impulsa tu negocio con vídeos que transforman la satisfacción del cliente.",
+    "landing.welcome.title.1": "Mejora",
+    "landing.welcome.title.2": "la comunicación",
+    "landing.welcome.title.3": "por vídeo",
+    "landing.primary.word": "vídeo",
+    "layout.tooltip.isPinningPresent": "No se puede cambiar el diseño mientras un participante está fijado",
+    "layout.tooltip.isScreenSharePresent": "No se puede cambiar el diseño mientras se comparte pantalla",
+    "layout.tooltip.switchToActiveSpeaker": "Cambiar al diseño de orador activo",
+    "layout.tooltip.switchToGrid": "Cambiar al diseño de cuadrícula",
+    "mutedAlert.message.forceMuted": "Has sido silenciado por otro participante. Haz clic en el micrófono para activarlo.",
+    "mutedAlert.message.muted": "¿Estás hablando? Tu micrófono está apagado. Haz clic en el micrófono para encenderlo.",
+    "participants.list.ariaLabel": "alternar lista de participantes",
+    "participants.list.close": "Cerrar lista de participantes",
+    "participants.list.open": "Abrir lista de participantes",
+    "participants.maxPin": "No puedes fijar más mosaicos",
+    "participants.mute.dialog.content": "¿Silenciar a {{participantName}} para todos en la llamada? Solo {{participantName}} puede activarse de nuevo.",
+    "participants.mute.tooltip": "Silenciar el micrófono de {{participantName}}",
+    "participants.pin": "Fijar a {{participantName}}",
+    "participants.pin.video": "Fijar el video de {{participantName}}",
+    "participants.screen": "Pantalla de {{participantName}}",
+    "participants.title": "Participantes",
+    "participants.unpin": "Desfijar a {{participantName}}",
+    "participants.unpin.video": "Desfijar el video de {{participantName}}",
+    "publishingErrors.accessDenied.message": "Parece que tu navegador tiene bloqueado el acceso a tu {{device}}. Restablece los permisos desde la interfaz del navegador.",
+    "publishingErrors.accessDenied.title": "Acceso a {{device}} denegado",
+    "publishingErrors.blocked.message": "Tenemos problemas para conectarte con otros en la sala. Por favor revisa tu red e intenta de nuevo.",
+    "publishingErrors.blocked.title": "Dificultades para unirse a la sala",
+    "subscribingErrors.blocked.message": "Tenemos problemas para conectarte con otros en la sala. Por favor revisa tu red e intenta de nuevo.",
+    "subscribingErrors.blocked.title": "Dificultades para unirse a la sala",
+    "recording.start.dialog.content": "¡Asegúrate de que todos estén listos! Puedes descargar la grabación desde la página de \"Despedida\" después de salir de la sala.",
+    "recording.start.dialog.title": "¿Iniciar grabación?",
+    "recording.start.title": "Iniciar grabación",
+    "recording.stop.dialog.content": "Puedes descargar la grabación desde la página de \"Despedida\" después de salir de la sala.",
+    "recording.stop.dialog.title": "¿Detener grabación?",
+    "recording.stop.title": "Detener grabación",
+    "recording.tooltip.ariaLabel": "diseño de video",
+    "room.exit.ariaLabel": "salir",
+    "room.exit.tooltip": "Salir de la reunión",
+    "room.input.helper": "No se permite dejar el campo vacío, espacios ni caracteres especiales",
+    "room.input.label": "Nombre de sala",
+    "screenSharing.dialog.action": "Comenzar a compartir tu pantalla",
+    "screenSharing.dialog.content": "Parece que alguien más está compartiendo su pantalla. Si continúas, su pantalla dejará de compartirse.",
+    "screenSharing.dialog.title": "¿Deseas compartir tu pantalla?",
+    "screenSharing.title.start": "Iniciar compartir pantalla",
+    "screenSharing.title.stop": "Detener compartir pantalla",
+    "screenSharing.tooltip.ariaLabel": "Iniciar o detener compartir pantalla",
+    "soundTest.start": "Probar altavoces",
+    "soundTest.stop": "Detener prueba",
+    "toolbar.tooltip.ariaLabel": "abrir menú de barra de herramientas adicional",
+    "toolbar.tooltip.title": "Acceder a elementos adicionales de la barra",
+    "unsupportedBrowser.header": "Tu navegador no es compatible",
+    "unsupportedBrowser.message": "Por favor usa uno de nuestros navegadores compatibles.",
+    "unsupportedBrowser.supported.downloadLink": "Enlace de descarga para {{browser}}",
+    "unsupportedBrowser.supported.title": "Navegadores compatibles:",
+    "unknown.device": "Dispositivo desconocido",
+    "user.unknown": "usuario desconocido",
+    "user.you": "Tú",
+    "waitingRoom.title": "Prepararse para unirse",
+    "waitingRoom.user.input.title": "Ingresa tu nombre",
+    "waitingRoom.user.input.label": "Nombre",
+    "waitingRoom.user.input.error": "El nombre no puede estar vacío ni contener caracteres especiales",
+    "zoom.reset": "Restablecer zoom",
+    "zoom.start": "Iniciar zoom",
+    "zoom.out": "Alejar zoom",
+    "zoom.in": "Acercar zoom",
+    "zoom.current": "Zoom actual"
 }
diff --git a/frontend/src/locales/it.json b/frontend/src/locales/it.json
index 3aefe2f0b..b1089171a 100644
--- a/frontend/src/locales/it.json
+++ b/frontend/src/locales/it.json
@@ -1,201 +1,201 @@
 {
-  "archiveList.archive.createdAt": "Iniziato il: {{createdAt}}",
-  "archiveList.archive.index": "Registrazione {{index}}",
-  "archiveList.download.tooltip": "Scarica registrazione {{id}}",
-  "archiveList.empty": "Non ci sono registrazioni per questa riunione",
-  "archiveList.error.text": "Si è verificato un errore durante il caricamento delle registrazioni di questa riunione",
-  "archiveList.error.tooltip": "Questa registrazione è fallita o è scaduta",
-  "archiveList.label": "Registrazioni",
-  "archiveList.loading.tooltip": "Questa registrazione non è ancora pronta per il download",
-  "backgroundEffects.ariaLabel": "Sfondi ed Effetti",
-  "backgroundEffects.choice": "Scegli effetto di sfondo",
-  "backgroundEffects.limit": "Hai raggiunto il limite massimo di immagini personalizzate",
-  "backgroundEffects.recommended.note": "Nota: le immagini vengono memorizzate solo localmente nel browser.",
-  "backgroundEffects.recommended.specs": "Consigliato: immagini JPG/PNG a risoluzione 1280x720.",
-  "backgroundEffects.title": "Sfondi ed Effetti",
-  "backgroundEffects.title.tabs": "Schede di effetti di sfondo",
-  "backgroundEffects.tabs.backgrounds": "Sfondi",
-  "backgroundEffects.tabs.addBackground": "Aggiungi sfondo",
-  "backgroundEffects.video.disabled": "Non hai abilitato il video",
-  "backgroundEffects.invalidFileType": "Sono consentite solo immagini JPG, PNG, GIF o BMP.",
-  "backgroundEffects.fileTooLarge": "L'immagine deve essere inferiore a {{maxSize}}MB.",
-  "backgroundEffects.processingError": "Errore nell'elaborazione dell'immagine caricata.",
-  "backgroundEffects.storageError": "Errore nel salvataggio dell'immagine.",
-  "backgroundEffects.linkPlaceholder": "Link dal web",
-  "backgroundEffects.dragDropText": "Trascina e rilascia, o clicca qui per caricare l'immagine,",
-  "backgroundEffects.maxSize": "Max {{maxSize}}MB",
-  "backgroundEffects.removeBackground": "Rimuovi sfondo",
-  "backgroundEffects.slightBlur": "Sfocatura leggera dello sfondo",
-  "backgroundEffects.strongBlur": "Sfocatura forte dello sfondo",
-  "backgroundEffects.yourBackground": "Il tuo sfondo",
-  "backgroundEffects.deleteTooltipInUse": "Non puoi rimuovere questo sfondo mentre è in uso",
-  "backgroundEffects.deleteTooltip": "Rimuovi sfondo",
-  "backgroundEffects.deleteAriaLabel": "Rimuovi sfondo personalizzato",
-  "backgroundEffects.backgrounds.bookshelfRoom": "Stanza con libreria",
-  "backgroundEffects.backgrounds.busyRoom": "Stanza occupata",
-  "backgroundEffects.backgrounds.duneView": "Vista delle dune",
-  "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
-  "backgroundEffects.backgrounds.library": "Biblioteca",
-  "backgroundEffects.backgrounds.newYork": "New York",
-  "backgroundEffects.backgrounds.plane": "Aereo",
-  "backgroundEffects.backgrounds.whiteRoom": "Stanza bianca",
-  "button.apply": "Applica",
-  "button.camera": "Camera",
-  "button.cancel": "Annulla",
-  "button.close": "Chiudi",
-  "button.createRoom": "Crea una nuova stanza",
-  "button.startNewRoom": "Inizia una nuova videoconferenza",
-  "button.joinExistingMeeting": "Unisciti a una riunione esistente",
-  "button.joinWaitingRoom": "Unisciti alla sala d'attesa",
-  "button.join": "Partecipa",
-  "button.mute": "Disattiva audio",
-  "button.send": "Invia",
-  "button.speaker": "Altoparlante",
-  "captions.ariaLabel": "pulsante sottotitoli",
-  "captions.disable": "Disattiva sottotitoli",
-  "captions.enable": "Attiva sottotitoli",
-  "captions.errors": "Errore sottotitoli: {{captionsErrorResponse}}",
-  "chat.ariaLabel": "attiva/disattiva chat",
-  "chat.close": "Chiudi chat",
-  "chat.copied": "Copiato",
-  "chat.copy": "Copia negli appunti",
-  "chat.input.placeholder": "Invia un messaggio",
-  "chat.meetingUrl": "URL riunione:",
-  "chat.open": "Apri chat",
-  "chat.title": "Chat",
-  "common.or": "o",
-  "connectionAlert.quality.message": "Controlla la tua connessione. Il video potrebbe essere disattivato per migliorare l'esperienza.",
-  "connectionAlert.quality.title": "Problema relativo alla qualità del video",
-  "connectionAlert.reconnecting.message": "Verifica la tua connessione di rete",
-  "connectionAlert.reconnecting.title": "Connessione persa",
-  "deviceAccessAlert.askDeviceMessage": "Per partecipare alla Riunione, il browser richiederà l'accesso a camera e microfono.",
-  "deviceAccessAlert.deniedDeviceMessage": "Sembra che il browser non possa accedere alla camera o al microfono. Reimposta i permessi tramite l'interfaccia del browser.",
-  "deviceAccessAlert.imageAlt": "Dialogo accesso",
-  "devices.audio.ariaLabel": "dispositivi audio",
-  "devices.audio.defaultLabel": "Predefinito sistema",
-  "devices.audio.disable": "Disattiva microfono",
-  "devices.audio.enable": "Attiva microfono",
-  "devices.audio.microphone.ariaLabel": "attiva/disattiva audio",
-  "devices.audio.microphone.full": "Microfono",
-  "devices.audio.microphone.short": "Mic",
-  "devices.audio.microphone.state.on": "Attiva microfono",
-  "devices.audio.microphone.state.off": "Disattiva microfono",
-  "devices.audio.noiseSuppression": "Soppressione rumore avanzata",
-  "devices.audio.speakers.full": "Altoparlanti",
-  "devices.buttons.ariaLabel": "pulsante diviso",
-  "devices.settings.ariaLabel": "impostazioni dispositivi",
-  "devices.video.ariaLabel": "dispositivi video",
-  "devices.video.blur.ariaLabel": "Attiva la sfocatura dello sfondo",
-  "devices.video.blur.label": "Sfoca lo sfondo",
-  "devices.video.camera.ariaLabel": "attiva/disattiva video",
-  "devices.video.camera.button.ariaLabel": "video",
-  "devices.video.camera.state.on": "Attiva camera",
-  "devices.video.camera.state.off": "Disattiva camera",
-  "devices.video.camera.full": "Camera",
-  "devices.video.disable": "Disattiva video",
-  "devices.video.enable": "Attiva video",
-  "emoji.ariaLabel": "apri menu emoji",
-  "emoji.tooltip": "Esprimiti",
-  "errors.unknown": "Errore sconosciuto",
-  "feedbackForm.ariaLabel": "attiva modulo segnalazione",
-  "feedbackForm.close": "Chiudi modulo segnalazione",
-  "feedbackForm.disclaiamer.label": "Non includere informazioni sensibili.",
-  "feedbackForm.disclaiamer.screenshot": "Uno screenshot ci aiuterà a capire meglio il problema. (opzionale)",
-  "feedbackForm.field.issue.label": "Descrivi il problema",
-  "feedbackForm.field.issue.type": "Descrizione",
-  "feedbackForm.field.name.label": "Indicaci il tuo nome",
-  "feedbackForm.field.name.type": "Il tuo nome",
-  "feedbackForm.field.title.label": "Quando hai notato questo problema, cosa stavi facendo?",
-  "feedbackForm.field.title.type": "Titolo",
-  "feedbackForm.helperText.error": "{{field}} è richiesto e deve essere inferiore a {{limit}} caratteri",
-  "feedbackForm.open": "Apri modulo segnalazione",
-  "feedbackForm.submitted.content": "Grazie per il tuo feedback, ci aiuta a migliorare l'app.",
-  "feedbackForm.submitted.error": "Si è verificato un errore. Riprova.",
-  "feedbackForm.submitted.thanks": "Grazie per il tuo feedback!",
-  "feedbackForm.submitted.track": "Segui i progressi qui.",
-  "feedbackForm.title": "Segnala problema",
-  "filePicker.addScreenshot": "Aggiungi screenshot",
-  "filePicker.attachedScreenshot": "Screenshot allegato",
-  "filePicker.capture": "Cattura screenshot",
-  "filePicker.delete": "Elimina screenshot",
-  "filePicker.sizeLimit": "La dimensione massima del file è 20MB. Carica un altro file.",
-  "footer.github.title": "Applicazione di riferimento video di Vonage",
-  "imageStorage.imagesExceedSize": "Le immagini sono troppo grandi per essere archiviate (~4MB max).",
-  "imageStorage.storageFailure": "Impossibile salvare le immagini nel localStorage.",
-  "imageStorage.duplicateImage": "Questa immagine è già stata aggiunta.",
-  "imageStorage.fileReadError": "Impossibile leggere il file immagine.",
-  "imageStorage.invalidExtension": "Estensione immagine non valida.",
-  "imageStorage.invalidUrl": "URL immagine non valido.",
-  "imageStorage.convertError": "Impossibile convertire l'immagine.",
-  "imageStorage.loadError": "Impossibile caricare l'immagine.",
-  "githubTooltip": "Visita il nostro GitHub",
-  "goodBye.back": "Torna alla pagina iniziale",
-  "goodBye.reEnter": "Rientra",
-  "goodbye.default.header": "Hai lasciato la stanza",
-  "goodbye.default.message": "Speriamo che ti sia divertito",
-  "landing.welcome.subtitle": "Potenzia la tua attività con video che trasformano la soddisfazione del cliente.",
-  "landing.welcome.title.1": "Migliora",
-  "landing.welcome.title.2": "la comunicazione",
-  "landing.welcome.title.3": "per video",
-  "landing.primary.word": "video",
-  "layout.tooltip.isPinningPresent": "Impossibile cambiare layout mentre un partecipante è fissato",
-  "layout.tooltip.isScreenSharePresent": "Impossibile cambiare il layout mentre è attiva la condivisione dello schermo",
-  "layout.tooltip.switchToActiveSpeaker": "Passa al layout Oratore in evidenza",
-  "layout.tooltip.switchToGrid": "Passa al layout Griglia",
-  "mutedAlert.message.forceMuted": "Sei stato disattivato da un altro partecipante. Clicca sul microfono per riattivarlo.",
-  "mutedAlert.message.muted": "Stai parlando? Il tuo microfono è attualmente disattivato. Clicca sul microfono per attivarlo.",
-  "participants.list.ariaLabel": "attiva/disattiva la lista dei partecipanti",
-  "participants.list.close": "Chiudi la lista dei partecipanti",
-  "participants.list.open": "Apri la lista dei partecipanti",
-  "participants.maxPin": "Non puoi fissare altre tile",
-  "participants.mute.dialog.content": "Disattivare {{participantName}} per tutti nella chiamata? Solo {{participantName}} può riattivarsi.",
-  "participants.mute.tooltip": "Disattiva microfono di {{participantName}}",
-  "participants.pin": "Fissa {{participantName}}",
-  "participants.pin.video": "Fissa video di {{participantName}}",
-  "participants.screen": "Schermo di {{participantName}}",
-  "participants.title": "Partecipanti",
-  "participants.unpin": "Sblocca {{participantName}}",
-  "participants.unpin.video": "Sblocca video di {{participantName}}",
-  "publishingErrors.accessDenied.message": "Sembra che il browser non possa accedere al tuo {{device}}. Reimposta i permessi tramite il browser.",
-  "publishingErrors.accessDenied.title": "L'accesso a {{device}} è stato negato",
-  "publishingErrors.blocked.message": "Problemi di connessione con altri nella stanza. Controlla la rete e riprova.",
-  "publishingErrors.blocked.title": "Difficoltà a unirsi alla stanza",
-  "subscribingErrors.blocked.message": "Problemi di connessione con altri nella stanza. Controlla la rete e riprova.",
-  "subscribingErrors.blocked.title": "Difficoltà a unirsi alla stanza",
-  "recording.start.dialog.content": "Assicurati che tutti siano pronti! Puoi scaricare la registrazione dalla pagina \"Addio\" dopo aver lasciato la stanza.",
-  "recording.start.dialog.title": "Avvia registrazione?",
-  "recording.start.title": "Avvia registrazione",
-  "recording.stop.dialog.content": "Puoi scaricare la registrazione dalla pagina \"Addio\" dopo aver lasciato la stanza.",
-  "recording.stop.dialog.title": "Interrompere la registrazione?",
-  "recording.stop.title": "Interrompi registrazione",
-  "recording.tooltip.ariaLabel": "layout video",
-  "room.exit.ariaLabel": "esci",
-  "room.exit.tooltip": "Esci dalla riunione",
-  "room.input.helper": "Non può essere vuoto, contenere spazi o caratteri speciali",
-  "room.input.label": "Nome della stanza",
-  "screenSharing.dialog.action": "Inizia condivisione schermo",
-  "screenSharing.dialog.content": "Sembra che qualcun altro stia condividendo lo schermo. Se continui, il loro schermo non sarà più condiviso.",
-  "screenSharing.dialog.title": "Vuoi condividere il tuo schermo?",
-  "screenSharing.title.start": "Avvia condivisione schermo",
-  "screenSharing.title.stop": "Interrompi condivisione schermo",
-  "screenSharing.tooltip.ariaLabel": "Avvia o interrompi condivisione schermo",
-  "soundTest.start": "Test altoparlanti",
-  "soundTest.stop": "Interrompi test",
-  "toolbar.tooltip.ariaLabel": "apri menu strumenti aggiuntivi",
-  "toolbar.tooltip.title": "Accedi agli strumenti aggiuntivi",
-  "unsupportedBrowser.header": "Browser non supportato",
-  "unsupportedBrowser.message": "Usa uno dei nostri browser supportati.",
-  "unsupportedBrowser.supported.downloadLink": "Collegamento per scaricare {{browser}}",
-  "unsupportedBrowser.supported.title": "Browser supportati:",
-  "unknown.device": "Dispositivo sconosciuto",
-  "user.unknown": "utente sconosciuto",
-  "user.you": "Tu",
-  "waitingRoom.title": "Preparati per unirti:",
-  "waitingRoom.user.input.label": "Qual è il tuo nome?",
-  "waitingRoom.user.input.placeholder": "Inserisci il tuo nome",
-  "zoom.reset": "Reimposta zoom",
-  "zoom.start": "Inizia zoom",
-  "zoom.out": "Zoom indietro",
-  "zoom.in": "Zoom avanti",
-  "zoom.current": "Zoom attuale"
+    "archiveList.archive.createdAt": "Iniziato il: {{createdAt}}",
+    "archiveList.archive.index": "Registrazione {{index}}",
+    "archiveList.download.tooltip": "Scarica registrazione {{id}}",
+    "archiveList.empty": "Non ci sono registrazioni per questa riunione",
+    "archiveList.error.text": "Si è verificato un errore durante il caricamento delle registrazioni di questa riunione",
+    "archiveList.error.tooltip": "Questa registrazione è fallita o è scaduta",
+    "archiveList.label": "Registrazioni",
+    "archiveList.loading.tooltip": "Questa registrazione non è ancora pronta per il download",
+    "backgroundEffects.ariaLabel": "Sfondi ed Effetti",
+    "backgroundEffects.choice": "Scegli effetto di sfondo",
+    "backgroundEffects.limit": "Hai raggiunto il limite massimo di immagini personalizzate",
+    "backgroundEffects.recommended.note": "Nota: le immagini vengono memorizzate solo localmente nel browser.",
+    "backgroundEffects.recommended.specs": "Consigliato: immagini JPG/PNG a risoluzione 1280x720.",
+    "backgroundEffects.title": "Sfondi ed Effetti",
+    "backgroundEffects.title.tabs": "Schede di effetti di sfondo",
+    "backgroundEffects.tabs.backgrounds": "Sfondi",
+    "backgroundEffects.tabs.addBackground": "Aggiungi sfondo",
+    "backgroundEffects.video.disabled": "Non hai abilitato il video",
+    "backgroundEffects.invalidFileType": "Sono consentite solo immagini JPG, PNG, GIF o BMP.",
+    "backgroundEffects.fileTooLarge": "L'immagine deve essere inferiore a {{maxSize}}MB.",
+    "backgroundEffects.processingError": "Errore nell'elaborazione dell'immagine caricata.",
+    "backgroundEffects.storageError": "Errore nel salvataggio dell'immagine.",
+    "backgroundEffects.linkPlaceholder": "Link dal web",
+    "backgroundEffects.dragDropText": "Trascina e rilascia, o clicca qui per caricare l'immagine,",
+    "backgroundEffects.maxSize": "Max {{maxSize}}MB",
+    "backgroundEffects.removeBackground": "Rimuovi sfondo",
+    "backgroundEffects.slightBlur": "Sfocatura leggera dello sfondo",
+    "backgroundEffects.strongBlur": "Sfocatura forte dello sfondo",
+    "backgroundEffects.yourBackground": "Il tuo sfondo",
+    "backgroundEffects.deleteTooltipInUse": "Non puoi rimuovere questo sfondo mentre è in uso",
+    "backgroundEffects.deleteTooltip": "Rimuovi sfondo",
+    "backgroundEffects.deleteAriaLabel": "Rimuovi sfondo personalizzato",
+    "backgroundEffects.backgrounds.bookshelfRoom": "Stanza con libreria",
+    "backgroundEffects.backgrounds.busyRoom": "Stanza occupata",
+    "backgroundEffects.backgrounds.duneView": "Vista delle dune",
+    "backgroundEffects.backgrounds.hogwarts": "Hogwarts",
+    "backgroundEffects.backgrounds.library": "Biblioteca",
+    "backgroundEffects.backgrounds.newYork": "New York",
+    "backgroundEffects.backgrounds.plane": "Aereo",
+    "backgroundEffects.backgrounds.whiteRoom": "Stanza bianca",
+    "button.apply": "Applica",
+    "button.camera": "Camera",
+    "button.cancel": "Annulla",
+    "button.close": "Chiudi",
+    "button.createRoom": "Crea una nuova stanza",
+    "button.startNewRoom": "Inizia una nuova videoconferenza",
+    "button.joinExistingMeeting": "Unisciti a una riunione esistente",
+    "button.joinWaitingRoom": "Unisciti alla sala d'attesa",
+    "button.join": "Partecipa alla riunione",
+    "button.mute": "Disattiva audio",
+    "button.send": "Invia",
+    "button.speaker": "Altoparlante",
+    "captions.ariaLabel": "pulsante sottotitoli",
+    "captions.disable": "Disattiva sottotitoli",
+    "captions.enable": "Attiva sottotitoli",
+    "captions.errors": "Errore sottotitoli: {{captionsErrorResponse}}",
+    "chat.ariaLabel": "attiva/disattiva chat",
+    "chat.close": "Chiudi chat",
+    "chat.copied": "Copiato",
+    "chat.copy": "Copia negli appunti",
+    "chat.input.placeholder": "Invia un messaggio",
+    "chat.meetingUrl": "URL riunione:",
+    "chat.open": "Apri chat",
+    "chat.title": "Chat",
+    "common.or": "o",
+    "connectionAlert.quality.message": "Controlla la tua connessione. Il video potrebbe essere disattivato per migliorare l'esperienza.",
+    "connectionAlert.quality.title": "Problema relativo alla qualità del video",
+    "connectionAlert.reconnecting.message": "Verifica la tua connessione di rete",
+    "connectionAlert.reconnecting.title": "Connessione persa",
+    "deviceAccessAlert.askDeviceMessage": "Per partecipare alla Riunione, il browser richiederà l'accesso a camera e microfono.",
+    "deviceAccessAlert.deniedDeviceMessage": "Sembra che il browser non possa accedere alla camera o al microfono. Reimposta i permessi tramite l'interfaccia del browser.",
+    "deviceAccessAlert.imageAlt": "Dialogo accesso",
+    "devices.audio.ariaLabel": "dispositivi audio",
+    "devices.audio.defaultLabel": "Predefinito sistema",
+    "devices.audio.disable": "Disattiva microfono",
+    "devices.audio.enable": "Attiva microfono",
+    "devices.audio.microphone.ariaLabel": "attiva/disattiva audio",
+    "devices.audio.microphone.full": "Microfono",
+    "devices.audio.microphone.short": "Mic",
+    "devices.audio.microphone.state.on": "Attiva microfono",
+    "devices.audio.microphone.state.off": "Disattiva microfono",
+    "devices.audio.noiseSuppression": "Soppressione rumore avanzata",
+    "devices.audio.speakers.full": "Altoparlanti",
+    "devices.buttons.ariaLabel": "pulsante diviso",
+    "devices.settings.ariaLabel": "impostazioni dispositivi",
+    "devices.video.ariaLabel": "dispositivi video",
+    "devices.video.blur.ariaLabel": "Attiva la sfocatura dello sfondo",
+    "devices.video.blur.label": "Sfoca lo sfondo",
+    "devices.video.camera.ariaLabel": "attiva/disattiva video",
+    "devices.video.camera.state.on": "Attiva camera",
+    "devices.video.camera.state.off": "Disattiva camera",
+    "devices.video.camera.full": "Camera",
+    "devices.video.disable": "Disattiva video",
+    "devices.video.enable": "Attiva video",
+    "emoji.ariaLabel": "apri menu emoji",
+    "emoji.tooltip": "Esprimiti",
+    "errors.unknown": "Errore sconosciuto",
+    "feedbackForm.ariaLabel": "attiva modulo segnalazione",
+    "feedbackForm.close": "Chiudi modulo segnalazione",
+    "feedbackForm.disclaiamer.label": "Non includere informazioni sensibili.",
+    "feedbackForm.disclaiamer.screenshot": "Uno screenshot ci aiuterà a capire meglio il problema. (opzionale)",
+    "feedbackForm.field.issue.label": "Descrivi il problema",
+    "feedbackForm.field.issue.type": "Descrizione",
+    "feedbackForm.field.name.label": "Indicaci il tuo nome",
+    "feedbackForm.field.name.type": "Il tuo nome",
+    "feedbackForm.field.title.label": "Quando hai notato questo problema, cosa stavi facendo?",
+    "feedbackForm.field.title.type": "Titolo",
+    "feedbackForm.helperText.error": "{{field}} è richiesto e deve essere inferiore a {{limit}} caratteri",
+    "feedbackForm.open": "Apri modulo segnalazione",
+    "feedbackForm.submitted.content": "Grazie per il tuo feedback, ci aiuta a migliorare l'app.",
+    "feedbackForm.submitted.error": "Si è verificato un errore. Riprova.",
+    "feedbackForm.submitted.thanks": "Grazie per il tuo feedback!",
+    "feedbackForm.submitted.track": "Segui i progressi qui.",
+    "feedbackForm.title": "Segnala problema",
+    "filePicker.addScreenshot": "Aggiungi screenshot",
+    "filePicker.attachedScreenshot": "Screenshot allegato",
+    "filePicker.capture": "Cattura screenshot",
+    "filePicker.delete": "Elimina screenshot",
+    "filePicker.sizeLimit": "La dimensione massima del file è 20MB. Carica un altro file.",
+    "footer.github.title": "Applicazione di riferimento video di Vonage",
+    "imageStorage.imagesExceedSize": "Le immagini sono troppo grandi per essere archiviate (~4MB max).",
+    "imageStorage.storageFailure": "Impossibile salvare le immagini nel localStorage.",
+    "imageStorage.duplicateImage": "Questa immagine è già stata aggiunta.",
+    "imageStorage.fileReadError": "Impossibile leggere il file immagine.",
+    "imageStorage.invalidExtension": "Estensione immagine non valida.",
+    "imageStorage.invalidUrl": "URL immagine non valido.",
+    "imageStorage.convertError": "Impossibile convertire l'immagine.",
+    "imageStorage.loadError": "Impossibile caricare l'immagine.",
+    "githubTooltip": "Visita il nostro GitHub",
+    "goodBye.back": "Torna alla pagina iniziale",
+    "goodBye.reEnter": "Rientra",
+    "goodbye.default.header": "Hai lasciato la stanza",
+    "goodbye.default.message": "Speriamo che ti sia divertito",
+    "landing.welcome.subtitle": "Potenzia la tua attività con video che trasformano la soddisfazione del cliente.",
+    "landing.welcome.title.1": "Migliora",
+    "landing.welcome.title.2": "la comunicazione",
+    "landing.welcome.title.3": "per video",
+    "landing.primary.word": "video",
+    "layout.tooltip.isPinningPresent": "Impossibile cambiare layout mentre un partecipante è fissato",
+    "layout.tooltip.isScreenSharePresent": "Impossibile cambiare il layout mentre è attiva la condivisione dello schermo",
+    "layout.tooltip.switchToActiveSpeaker": "Passa al layout Oratore in evidenza",
+    "layout.tooltip.switchToGrid": "Passa al layout Griglia",
+    "mutedAlert.message.forceMuted": "Sei stato disattivato da un altro partecipante. Clicca sul microfono per riattivarlo.",
+    "mutedAlert.message.muted": "Stai parlando? Il tuo microfono è attualmente disattivato. Clicca sul microfono per attivarlo.",
+    "participants.list.ariaLabel": "attiva/disattiva la lista dei partecipanti",
+    "participants.list.close": "Chiudi la lista dei partecipanti",
+    "participants.list.open": "Apri la lista dei partecipanti",
+    "participants.maxPin": "Non puoi fissare altre tile",
+    "participants.mute.dialog.content": "Disattivare {{participantName}} per tutti nella chiamata? Solo {{participantName}} può riattivarsi.",
+    "participants.mute.tooltip": "Disattiva microfono di {{participantName}}",
+    "participants.pin": "Fissa {{participantName}}",
+    "participants.pin.video": "Fissa video di {{participantName}}",
+    "participants.screen": "Schermo di {{participantName}}",
+    "participants.title": "Partecipanti",
+    "participants.unpin": "Sblocca {{participantName}}",
+    "participants.unpin.video": "Sblocca video di {{participantName}}",
+    "publishingErrors.accessDenied.message": "Sembra che il browser non possa accedere al tuo {{device}}. Reimposta i permessi tramite il browser.",
+    "publishingErrors.accessDenied.title": "L'accesso a {{device}} è stato negato",
+    "publishingErrors.blocked.message": "Problemi di connessione con altri nella stanza. Controlla la rete e riprova.",
+    "publishingErrors.blocked.title": "Difficoltà a unirsi alla stanza",
+    "subscribingErrors.blocked.message": "Problemi di connessione con altri nella stanza. Controlla la rete e riprova.",
+    "subscribingErrors.blocked.title": "Difficoltà a unirsi alla stanza",
+    "recording.start.dialog.content": "Assicurati che tutti siano pronti! Puoi scaricare la registrazione dalla pagina \"Addio\" dopo aver lasciato la stanza.",
+    "recording.start.dialog.title": "Avvia registrazione?",
+    "recording.start.title": "Avvia registrazione",
+    "recording.stop.dialog.content": "Puoi scaricare la registrazione dalla pagina \"Addio\" dopo aver lasciato la stanza.",
+    "recording.stop.dialog.title": "Interrompere la registrazione?",
+    "recording.stop.title": "Interrompi registrazione",
+    "recording.tooltip.ariaLabel": "layout video",
+    "room.exit.ariaLabel": "esci",
+    "room.exit.tooltip": "Esci dalla riunione",
+    "room.input.helper": "Non può essere vuoto, contenere spazi o caratteri speciali",
+    "room.input.label": "Nome della stanza",
+    "screenSharing.dialog.action": "Inizia condivisione schermo",
+    "screenSharing.dialog.content": "Sembra che qualcun altro stia condividendo lo schermo. Se continui, il loro schermo non sarà più condiviso.",
+    "screenSharing.dialog.title": "Vuoi condividere il tuo schermo?",
+    "screenSharing.title.start": "Avvia condivisione schermo",
+    "screenSharing.title.stop": "Interrompi condivisione schermo",
+    "screenSharing.tooltip.ariaLabel": "Avvia o interrompi condivisione schermo",
+    "soundTest.start": "Test altoparlanti",
+    "soundTest.stop": "Interrompi test",
+    "toolbar.tooltip.ariaLabel": "apri menu strumenti aggiuntivi",
+    "toolbar.tooltip.title": "Accedi agli strumenti aggiuntivi",
+    "unsupportedBrowser.header": "Browser non supportato",
+    "unsupportedBrowser.message": "Usa uno dei nostri browser supportati.",
+    "unsupportedBrowser.supported.downloadLink": "Collegamento per scaricare {{browser}}",
+    "unsupportedBrowser.supported.title": "Browser supportati:",
+    "unknown.device": "Dispositivo sconosciuto",
+    "user.unknown": "utente sconosciuto",
+    "user.you": "Tu",
+    "waitingRoom.title": "Preparati per unirti",
+    "waitingRoom.user.input.title": "Inserisci il tuo nome",
+    "waitingRoom.user.input.label": "Nome",
+    "waitingRoom.user.input.error": "Il nome non può essere vuoto né contenere caratteri speciali",
+    "zoom.reset": "Reimposta zoom",
+    "zoom.start": "Inizia zoom",
+    "zoom.out": "Zoom indietro",
+    "zoom.in": "Zoom avanti",
+    "zoom.current": "Zoom attuale"
 }
diff --git a/frontend/src/pages/WaitingRoom/WaitingRoom.spec.tsx b/frontend/src/pages/WaitingRoom/WaitingRoom.spec.tsx
index 57eed33b3..074bd9c74 100644
--- a/frontend/src/pages/WaitingRoom/WaitingRoom.spec.tsx
+++ b/frontend/src/pages/WaitingRoom/WaitingRoom.spec.tsx
@@ -171,7 +171,7 @@ describe('WaitingRoom', () => {
     expect(screen.getByText('test-room-name')).toBeInTheDocument();
 
     // Submit a name to navigate away from the waiting room
-    const input = screen.getByPlaceholderText('Enter your name');
+    const input = screen.getByRole('textbox', { name: /name/i });
     await user.type(input, 'Betsey Trotwood');
     expect(input).toHaveValue('Betsey Trotwood');
 
diff --git a/frontend/src/pages/WaitingRoom/WaitingRoom.tsx b/frontend/src/pages/WaitingRoom/WaitingRoom.tsx
index 9f0d08e11..5f4c90bf5 100644
--- a/frontend/src/pages/WaitingRoom/WaitingRoom.tsx
+++ b/frontend/src/pages/WaitingRoom/WaitingRoom.tsx
@@ -12,6 +12,7 @@ import DeviceAccessAlert from '../../components/DeviceAccessAlert';
 import { getStorageItem, STORAGE_KEYS } from '../../utils/storage';
 import useIsSmallViewport from '../../hooks/useIsSmallViewport';
 import useBackgroundPublisherContext from '../../hooks/useBackgroundPublisherContext';
+import { BackgroundEffectsDialogProvider } from '../../Context/BackgroundEffectsDialog';
 
 /**
  * WaitingRoom Component
@@ -96,41 +97,43 @@ const WaitingRoom = (): ReactElement => {
   };
 
   return (
-    <Box data-testid="waitingRoom">
-      <FlexLayout>
-        <FlexLayout.Banner>
-          <Banner />
-        </FlexLayout.Banner>
-        <FlexLayout.Left>
-          <div
-            className={`max-w-full flex-col ${isSmallViewport ? '' : 'h-[394px]'} sm: inline-flex`}
-          >
-            <VideoContainer username={username} />
-            {accessStatus === DEVICE_ACCESS_STATUS.ACCEPTED && (
-              <ControlPanel
-                handleAudioInputOpen={handleAudioInputOpen}
-                handleVideoInputOpen={handleVideoInputOpen}
-                handleAudioOutputOpen={handleAudioOutputOpen}
-                handleClose={handleClose}
-                openAudioInput={openAudioInput}
-                openVideoInput={openVideoInput}
-                openAudioOutput={openAudioOutput}
-                anchorEl={anchorEl}
-              />
-            )}
-          </div>
-        </FlexLayout.Left>
-        <FlexLayout.Right>
-          <UsernameInput username={username} setUsername={setUsername} />
-        </FlexLayout.Right>
-        <FlexLayout.Footer>
-          <Footer />
-        </FlexLayout.Footer>
-      </FlexLayout>
-      {accessStatus !== DEVICE_ACCESS_STATUS.ACCEPTED && (
-        <DeviceAccessAlert accessStatus={accessStatus} />
-      )}
-    </Box>
+    <BackgroundEffectsDialogProvider>
+      <Box data-testid="waitingRoom">
+        <FlexLayout leftPadding={{ xs: '16px 0', sm: 3 }}>
+          <FlexLayout.Banner>
+            <Banner />
+          </FlexLayout.Banner>
+          <FlexLayout.Left>
+            <div
+              className={`max-w-full flex-col ${isSmallViewport ? '' : 'h-[394px]'} sm: inline-flex`}
+            >
+              <VideoContainer username={username} />
+              {accessStatus === DEVICE_ACCESS_STATUS.ACCEPTED && (
+                <ControlPanel
+                  handleAudioInputOpen={handleAudioInputOpen}
+                  handleVideoInputOpen={handleVideoInputOpen}
+                  handleAudioOutputOpen={handleAudioOutputOpen}
+                  handleClose={handleClose}
+                  openAudioInput={openAudioInput}
+                  openVideoInput={openVideoInput}
+                  openAudioOutput={openAudioOutput}
+                  anchorEl={anchorEl}
+                />
+              )}
+            </div>
+          </FlexLayout.Left>
+          <FlexLayout.Right>
+            <UsernameInput username={username} setUsername={setUsername} />
+          </FlexLayout.Right>
+          <FlexLayout.Footer>
+            <Footer />
+          </FlexLayout.Footer>
+        </FlexLayout>
+        {accessStatus !== DEVICE_ACCESS_STATUS.ACCEPTED && (
+          <DeviceAccessAlert accessStatus={accessStatus} />
+        )}
+      </Box>
+    </BackgroundEffectsDialogProvider>
   );
 };
 
diff --git a/frontend/src/utils/isValidUserName/index.ts b/frontend/src/utils/isValidUserName/index.ts
new file mode 100644
index 000000000..01319e55d
--- /dev/null
+++ b/frontend/src/utils/isValidUserName/index.ts
@@ -0,0 +1,3 @@
+import isValidRoomName from './isValidUserName';
+
+export default isValidRoomName;
diff --git a/frontend/src/utils/isValidUserName/isValidUserName.spec.ts b/frontend/src/utils/isValidUserName/isValidUserName.spec.ts
new file mode 100644
index 000000000..d06ab4314
--- /dev/null
+++ b/frontend/src/utils/isValidUserName/isValidUserName.spec.ts
@@ -0,0 +1,56 @@
+import { describe, it, expect } from 'vitest';
+import isValidUserName from './isValidUserName';
+
+describe('isValidUserName', () => {
+  describe('valid usernames', () => {
+    const validCases = [
+      { input: 'John Doe', description: 'name with space' },
+      { input: 'María García', description: 'name with accents' },
+      { input: "O'Brien", description: 'name with apostrophe' },
+      { input: 'Jean-Pierre', description: 'name with hyphen' },
+      { input: 'User_123', description: 'name with underscore and numbers' },
+      { input: 'John.Smith', description: 'name with period' },
+      { input: 'A', description: 'single character' },
+      { input: 'User', description: 'simple name' },
+      { input: 'José Luis', description: 'name with special character' },
+    ];
+
+    validCases.forEach(({ input, description }) => {
+      it(`should return true for ${description}: "${input}"`, () => {
+        expect(isValidUserName(input)).toBe(true);
+      });
+    });
+  });
+
+  describe('invalid usernames', () => {
+    const invalidCases = [
+      { input: '', description: 'empty string' },
+      { input: '   ', description: 'only whitespace' },
+      { input: ' John', description: 'leading space' },
+      { input: 'John ', description: 'trailing space' },
+      { input: 'John  Doe', description: 'multiple consecutive spaces' },
+      { input: 'John@Doe', description: 'special character @' },
+      { input: 'John#Doe', description: 'special character #' },
+      { input: 'John$Doe', description: 'special character $' },
+      { input: 'John<script>', description: 'dangerous characters' },
+      { input: 'a'.repeat(61), description: 'exceeds max length (61 chars)' },
+    ];
+
+    invalidCases.forEach(({ input, description }) => {
+      it(`should return false for ${description}: "${input}"`, () => {
+        expect(isValidUserName(input)).toBe(false);
+      });
+    });
+  });
+
+  describe('edge cases', () => {
+    it('should return true for exactly 60 characters', () => {
+      const sixtyChars = 'a'.repeat(60);
+      expect(isValidUserName(sixtyChars)).toBe(true);
+    });
+
+    it('should return false for username that is only trimmed to valid', () => {
+      expect(isValidUserName('  ValidName  ')).toBe(false);
+    });
+  });
+});
diff --git a/frontend/src/utils/isValidUserName/isValidUserName.ts b/frontend/src/utils/isValidUserName/isValidUserName.ts
new file mode 100644
index 000000000..286a1dc8a
--- /dev/null
+++ b/frontend/src/utils/isValidUserName/isValidUserName.ts
@@ -0,0 +1,43 @@
+/**
+ * Validates a username for video calls
+ * @param {string} name - The username to validate
+ * @returns {boolean} true if the username is valid, false otherwise
+ *
+ * Rules:
+ * - Must not be empty or only whitespace
+ * - Length between 1 and 60 characters (after trimming)
+ * - Can contain letters, numbers, spaces, hyphens, underscores, apostrophes, and periods
+ * - Cannot have multiple consecutive spaces
+ * - Cannot start or end with spaces
+ */
+const isValidUserName = (name: string): boolean => {
+  // Check if empty or only whitespace
+  if (!name || name.trim() === '') {
+    return false;
+  }
+
+  const trimmedName = name.trim();
+
+  // Check length (1-60 characters)
+  if (trimmedName.length < 1 || trimmedName.length > 60) {
+    return false;
+  }
+
+  // Check if name is different from trimmed (starts/ends with spaces)
+  if (name !== trimmedName) {
+    return false;
+  }
+
+  // Check for multiple consecutive spaces
+  if (/\s{2,}/.test(name)) {
+    return false;
+  }
+
+  // Allow letters, numbers, spaces, hyphens, underscores, apostrophes, and periods
+  // Unicode letters support for international names
+  const regex = /^[\p{L}\p{N}\s._'-]+$/u;
+
+  return regex.test(name);
+};
+
+export default isValidUserName;
diff --git a/integration-tests/tests/landing.spec.ts b/integration-tests/tests/landing.spec.ts
index 1ada7fa8d..7a7ebb49a 100644
--- a/integration-tests/tests/landing.spec.ts
+++ b/integration-tests/tests/landing.spec.ts
@@ -17,8 +17,8 @@ test('should navigate to waiting room then publish in room via room name textbox
   await page.waitForSelector('.video__element', { state: 'visible' });
 
   await page.waitForTimeout(1000);
-  await page.getByPlaceholder('Enter your name').fill('some-user');
-  await page.getByRole('button', { name: 'Join' }).click();
+  await page.getByLabel('Name').fill('some-user');
+  await page.getByRole('button', { name: 'Join meeting' }).click();
 
   await expect(page).toHaveURL(`${baseURL}room/some-room`);
 
@@ -35,10 +35,8 @@ test('should navigate to waiting room then publish in room via Create room butto
   await page.waitForSelector('.video__element', { state: 'visible' });
 
   await page.waitForTimeout(1000);
-  await expect(page.getByRole('button', { name: 'Join' })).toHaveAttribute('disabled', '');
-
-  await page.getByPlaceholder('Enter your name').fill('some-user');
-  await page.getByRole('button', { name: 'Join' }).click();
+  await page.getByLabel('Name').fill('some-user');
+  await page.getByRole('button', { name: 'Join meeting' }).click();
 
   await expect(page.url()).toContain('room/');
 
@@ -64,7 +62,7 @@ test('User should be able to navigate to the next page using enter key', async (
   // This is needed for the DeviceAccessAlert to hide
   await page.waitForSelector('[role="dialog"]', { state: 'hidden' });
 
-  await page.getByPlaceholder('Enter your name').fill('some-user');
+  await page.getByLabel('Name').fill('some-user');
 
   await page.keyboard.press('Enter');
 
diff --git a/integration-tests/tests/utils.ts b/integration-tests/tests/utils.ts
index 2cee93d56..1aa54a8ae 100644
--- a/integration-tests/tests/utils.ts
+++ b/integration-tests/tests/utils.ts
@@ -26,7 +26,7 @@ export const openMeetingRoomWithSettings = async ({
   browserName?: string;
 }) => {
   await page.goto(`${baseURL}waiting-room/${roomName}`);
-  await page.getByPlaceholder('Enter your name').fill(username);
+  await page.getByLabel('Name').fill(username);
   await waitAndClickFirefox(page, browserName);
   if (videoOff) {
     await page.getByTestId('VideocamIcon').click();
@@ -36,5 +36,5 @@ export const openMeetingRoomWithSettings = async ({
     await page.getByTestId('MicIcon').click();
     await expect(page.getByTestId('MicOffIcon')).toBeVisible();
   }
-  await page.getByRole('button', { name: 'Join' }).click();
+  await page.getByRole('button', { name: 'Join meeting' }).click();
 };
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Electron-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Electron-linux.png
index 3ef8e5614..0c6c13404 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Electron-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Electron-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png
index 3ef8e5614..0c6c13404 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Microsoft-Edge-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Microsoft-Edge-linux.png
index 3ef8e5614..0c6c13404 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Microsoft-Edge-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Microsoft-Edge-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Mobile-Chrome-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Mobile-Chrome-linux.png
index 3ef8e5614..0c6c13404 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Mobile-Chrome-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Mobile-Chrome-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Opera-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Opera-linux.png
index 6cc5beef4..cd2a98892 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Opera-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-Opera-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-firefox-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-firefox-linux.png
index 3ef8e5614..0c6c13404 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-firefox-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Landing-page-UI-test-1-firefox-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Electron-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Electron-linux.png
index 831c5e0cc..dd2fcce24 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Electron-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Electron-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png
index 831c5e0cc..dd2fcce24 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Microsoft-Edge-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Microsoft-Edge-linux.png
index 831c5e0cc..dd2fcce24 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Microsoft-Edge-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Microsoft-Edge-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Mobile-Chrome-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Mobile-Chrome-linux.png
index 831c5e0cc..dd2fcce24 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Mobile-Chrome-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Mobile-Chrome-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Opera-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Opera-linux.png
index 82b229d78..6ffe1c298 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Opera-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-Opera-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-firefox-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-firefox-linux.png
index 831c5e0cc..dd2fcce24 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-firefox-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Unsupported-browser-page-UI-test-1-firefox-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Electron-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Electron-linux.png
index 5e53ea53e..7a209c20d 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Electron-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Electron-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png
index 5e53ea53e..7a209c20d 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Google-Chrome-Fake-Devices-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Microsoft-Edge-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Microsoft-Edge-linux.png
index 5e53ea53e..7a209c20d 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Microsoft-Edge-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Microsoft-Edge-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Mobile-Chrome-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Mobile-Chrome-linux.png
index 5e53ea53e..7a209c20d 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Mobile-Chrome-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Mobile-Chrome-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Opera-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Opera-linux.png
index 67a6b44cd..f7f17d37e 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Opera-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-Opera-linux.png differ
diff --git a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-firefox-linux.png b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-firefox-linux.png
index 5e53ea53e..7a209c20d 100644
Binary files a/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-firefox-linux.png and b/integration-tests/tests/visualComparisons.spec.ts-snapshots/Waiting-page-UI-test-1-firefox-linux.png differ
diff --git a/integration-tests/tests/waitingRoom.spec.ts b/integration-tests/tests/waitingRoom.spec.ts
index 7bd3c708e..d98774855 100644
--- a/integration-tests/tests/waitingRoom.spec.ts
+++ b/integration-tests/tests/waitingRoom.spec.ts
@@ -19,8 +19,8 @@ test('The buttons in the meeting room should match those in the waiting room wit
   if (browserName !== 'firefox') {
     await expect(page.getByTestId('portraitIcon')).toBeVisible();
   }
-  await page.getByPlaceholder('Enter your name').fill('some-user');
-  await page.getByRole('button', { name: 'Join' }).click({ force: true });
+  await page.getByLabel('Name').fill('some-user');
+  await page.getByRole('button', { name: 'Join meeting' }).click({ force: true });
 
   expect(page.url()).toContain('room/test-room');
   await page.waitForSelector('.publisher', { state: 'visible' });
@@ -53,8 +53,8 @@ test('The buttons in the meeting room should match those in the waiting room wit
   if (browserName !== 'firefox') {
     await expect(page.getByTestId('portraitIcon')).toBeVisible();
   }
-  await page.getByPlaceholder('Enter your name').fill('some user');
-  await page.getByRole('button', { name: 'Join' }).click({ force: true });
+  await page.getByLabel('Name').fill('some user');
+  await page.getByRole('button', { name: 'Join meeting' }).click({ force: true });
 
   expect(page.url()).toContain('room/test-room');
   await page.waitForSelector('.publisher', { state: 'visible' });
diff --git a/libs/ui/src/Box/Box.tsx b/libs/ui/src/Box/Box.tsx
index 0bafcaf01..162165ec3 100644
--- a/libs/ui/src/Box/Box.tsx
+++ b/libs/ui/src/Box/Box.tsx
@@ -2,7 +2,7 @@ import { Box as MUIBox, BoxProps as MUIBoxProps } from '@mui/material';
 import { ElementType } from 'react';
 
 // Support "component" with intrinsic attributes
-type BoxProps<C extends ElementType = 'div'> = MUIBoxProps<C, { component?: C }>;
+export type BoxProps<C extends React.ElementType = 'div'> = MUIBoxProps<C, { component?: C }>;
 
 const Box = <C extends ElementType = 'div'>(props: BoxProps<C>) => {
   return <MUIBox {...props} />;
diff --git a/libs/ui/src/ButtonBase/ButtonBase.spec.tsx b/libs/ui/src/ButtonBase/ButtonBase.spec.tsx
new file mode 100644
index 000000000..acf0fd8e9
--- /dev/null
+++ b/libs/ui/src/ButtonBase/ButtonBase.spec.tsx
@@ -0,0 +1,42 @@
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import userEvent from '@testing-library/user-event';
+import ButtonBase from './ButtonBase';
+
+describe('ButtonBase', () => {
+  it('renders children correctly', () => {
+    render(<ButtonBase>Click me</ButtonBase>);
+
+    expect(screen.getByText('Click me')).toBeInTheDocument();
+  });
+
+  it('handles onClick event', async () => {
+    const user = userEvent.setup();
+    const handleClick = vi.fn();
+
+    render(<ButtonBase onClick={handleClick}>Click me</ButtonBase>);
+
+    const button = screen.getByText('Click me');
+    await user.click(button);
+
+    expect(handleClick).toHaveBeenCalledTimes(1);
+  });
+
+  it('forwards additional props to the underlying MUI ButtonBase component', () => {
+    render(
+      <ButtonBase data-testid="custom-button" aria-label="Test button">
+        Content
+      </ButtonBase>
+    );
+
+    const button = screen.getByTestId('custom-button');
+    expect(button).toHaveAttribute('aria-label', 'Test button');
+  });
+
+  it('supports different button types', () => {
+    render(<ButtonBase type="submit">Submit</ButtonBase>);
+
+    const button = screen.getByText('Submit');
+    expect(button).toHaveAttribute('type', 'submit');
+  });
+});
diff --git a/libs/ui/src/ButtonBase/ButtonBase.story.tsx b/libs/ui/src/ButtonBase/ButtonBase.story.tsx
new file mode 100644
index 000000000..e69de29bb
diff --git a/libs/ui/src/ButtonBase/ButtonBase.tsx b/libs/ui/src/ButtonBase/ButtonBase.tsx
new file mode 100644
index 000000000..00901ac97
--- /dev/null
+++ b/libs/ui/src/ButtonBase/ButtonBase.tsx
@@ -0,0 +1,9 @@
+import { ButtonBase as MUIButtonBase, ButtonBaseProps as MUIButtonBaseProps } from '@mui/material';
+
+type ButtonBaseProps = MUIButtonBaseProps;
+
+const ButtonBase = (buttonBaseProps: ButtonBaseProps) => {
+  return <MUIButtonBase {...buttonBaseProps} />;
+};
+
+export default ButtonBase;
diff --git a/libs/ui/src/ButtonBase/index.ts b/libs/ui/src/ButtonBase/index.ts
new file mode 100644
index 000000000..1fb2f96bc
--- /dev/null
+++ b/libs/ui/src/ButtonBase/index.ts
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-restricted-exports
+export { default } from './ButtonBase';
diff --git a/libs/ui/src/Card/Card.spec.tsx b/libs/ui/src/Card/Card.spec.tsx
new file mode 100644
index 000000000..d0c52da95
--- /dev/null
+++ b/libs/ui/src/Card/Card.spec.tsx
@@ -0,0 +1,51 @@
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import React from 'react';
+import Card from './Card';
+
+describe('Card', () => {
+  it('renders children correctly', () => {
+    render(<Card>Test content</Card>);
+
+    expect(screen.getByText('Test content')).toBeInTheDocument();
+  });
+
+  it('applies custom sx props', () => {
+    const { container } = render(<Card sx={{ backgroundColor: 'red' }}>Content</Card>);
+
+    const card = container.firstChild as HTMLElement;
+    expect(card).toBeInTheDocument();
+  });
+
+  it('renders as form when component prop is passed', () => {
+    const handleSubmit = vi.fn((e: React.FormEvent) => e.preventDefault());
+
+    const { container } = render(
+      <Card component="form" onSubmit={handleSubmit}>
+        <button type="submit">Submit</button>
+      </Card>
+    );
+
+    const form = container.querySelector('form');
+    expect(form).toBeInTheDocument();
+    expect(form?.tagName).toBe('FORM');
+  });
+
+  it('forwards additional props to the underlying Box component', () => {
+    render(
+      <Card data-testid="custom-card" aria-label="Test card">
+        Content
+      </Card>
+    );
+
+    const card = screen.getByTestId('custom-card');
+    expect(card).toHaveAttribute('aria-label', 'Test card');
+  });
+
+  it('merges sx props correctly', () => {
+    const { container } = render(<Card sx={{ margin: 2 }}>Content</Card>);
+
+    const card = container.firstChild as HTMLElement;
+    expect(card).toBeInTheDocument();
+  });
+});
diff --git a/libs/ui/src/Card/Card.story.tsx b/libs/ui/src/Card/Card.story.tsx
new file mode 100644
index 000000000..e69de29bb
diff --git a/libs/ui/src/Card/Card.tsx b/libs/ui/src/Card/Card.tsx
new file mode 100644
index 000000000..d14df8279
--- /dev/null
+++ b/libs/ui/src/Card/Card.tsx
@@ -0,0 +1,28 @@
+import useCustomTheme from '@Context/Theme';
+import Box, { BoxProps } from '@ui/Box/Box';
+import React from 'react';
+
+type CardProps<C extends React.ElementType = 'div'> = BoxProps<C>;
+
+const Card = <C extends React.ElementType = 'div'>({ sx, ...cardProps }: CardProps<C>) => {
+  const theme = useCustomTheme();
+
+  return (
+    <Box<C>
+      sx={{
+        maxWidth: { xs: '100%', md: '500px' },
+        flex: 1,
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'start',
+        bgcolor: theme.colors.surface,
+        padding: { xs: '0px 0px 0px 0px', md: '40px' },
+        borderRadius: theme.shapes.borderRadiusMedium,
+        ...sx,
+      }}
+      {...(cardProps as BoxProps<C>)}
+    />
+  );
+};
+
+export default Card;
diff --git a/libs/ui/src/Card/index.ts b/libs/ui/src/Card/index.ts
new file mode 100644
index 000000000..b6be9d784
--- /dev/null
+++ b/libs/ui/src/Card/index.ts
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-restricted-exports
+export { default } from './Card';
diff --git a/libs/ui/src/FlexLayout/FlexLayout.tsx b/libs/ui/src/FlexLayout/FlexLayout.tsx
index 9b81c3638..13620ccb3 100644
--- a/libs/ui/src/FlexLayout/FlexLayout.tsx
+++ b/libs/ui/src/FlexLayout/FlexLayout.tsx
@@ -5,7 +5,24 @@ import Box from '@ui/Box';
 type WithChildren<T = object> = T & { children?: React.ReactNode };
 
 export type FlexLayoutProps = WithChildren<{
-  padding?: number;
+  leftPadding?:
+    | number
+    | {
+        xs?: string | number;
+        sm?: string | number;
+        md?: string | number;
+        lg?: string | number;
+        xl?: string | number;
+      };
+  rightPadding?:
+    | number
+    | {
+        xs?: string | number;
+        sm?: string | number;
+        md?: string | number;
+        lg?: string | number;
+        xl?: string | number;
+      };
   leftFlex?: number;
   rightFlex?: number;
   leftAlign?: { alignItems: string; justifyContent: string };
@@ -57,7 +74,8 @@ type FlexLayoutComponent = React.FC<FlexLayoutProps> & {
 
 const FlexLayout: FlexLayoutComponent = ({
   children,
-  padding = 3,
+  leftPadding = 3,
+  rightPadding = 3,
   leftFlex = 1,
   rightFlex = 1,
   leftAlign = { alignItems: 'center', justifyContent: 'center' },
@@ -88,7 +106,7 @@ const FlexLayout: FlexLayoutComponent = ({
               display: 'flex',
               alignItems: leftAlign.alignItems,
               justifyContent: leftAlign.justifyContent,
-              p: padding,
+              p: leftPadding,
               bgcolor: leftBackgroundColor,
               overflow: 'hidden',
             }}
@@ -104,7 +122,7 @@ const FlexLayout: FlexLayoutComponent = ({
               display: 'flex',
               alignItems: rightAlign.alignItems,
               justifyContent: rightAlign.justifyContent,
-              p: padding,
+              p: rightPadding,
               bgcolor: rightBackgroundColor,
             }}
           >