fix(ui5-shellbar-branding): improve logo spacing and RTL support (#11945)

- Replaced margin-right with margin-inline-end for better RTL compatibility
- Added extra padding to the logo element
- Increased spacing between the logo and the title

Fixes #11897

Author: kgogov

packages/fiori/src/themes/ShellBar.css

@@ -159,7 +159,7 @@ slot[name="profile"] {
 	justify-content: center;
 	height: 100%;
 	overflow: hidden;
-	margin-left: 0.25rem;
+	margin-inline-start: 0.25rem;
 }
 
 .ui5-shellbar-menu-button--interactive .ui5-shellbar-menu-button-arrow {

packages/fiori/src/themes/ShellBarBranding.css

@@ -10,15 +10,16 @@
 	overflow: hidden;
 	display: flex;
 	align-items: center;
-	padding: .25rem .5rem .25rem .25rem;
+	padding-block: 0.25rem;
+	padding-inline: 0.25rem 0.5rem;
 	box-sizing: border-box;
 	cursor: pointer;
 	background: var(--sapButton_Lite_Background);
 	border: 1px solid var(--sapButton_Lite_BorderColor);
 	color: var(--sapShell_TextColor);
 	/* fix cutting of the focus outline */
 	margin-inline-start: 0.125rem;
-	margin-right: 8px;
+	margin-inline-end: .5rem;
 }
 
 .ui5-shellbar-branding-root:focus {
@@ -46,6 +47,7 @@
 	overflow: hidden;
 	text-overflow: ellipsis;
 	color: var(--sapShell_SubBrand_TextColor);
+	margin-inline-start: 0.25rem;
 }
 
 .ui5-shellbar-logo-area {
@@ -66,4 +68,5 @@
 	max-height: 2rem;
 	max-width: 3.75rem;
 	pointer-events: none;
+	padding-inline: 0.25rem;
 }