This is a Bug Report

Problem:
When switching to an RTL language, the logo overlaps with the menu, creating a layout issue as shown in the picture! This is different form the issue google/docsy#1442 and google/docsy#829 these issues are discussing switching the positioning for of menu elements to fit with RTL but the logo overlap problem is not observed in the docsy check: https://example.docsy.dev/fa/

The root cause of the problem is suspected to be the custom CSS applied in the k8s website. Here

body:lang(fa),
body:lang(ar),
body:lang(az),
body:lang(dv),
body:lang(he),
body:lang(ku),
body:lang(ur) {
  .navbar-brand {
    left: 16px;
  }
}

However, it's recommended to consider a more comprehensive solution. Refactoring the custom CSS added to the k8s website. We have big custom css (>1000 lines ) overriding the default docsy! might be necessary to avoid interfering with the default docsy styling. It's advisable to minimize overrides to essential elements, aligning with the purpose of using docsy. This approach ensures a cleaner separation between documentation content and web development concerns.
Page to Update:
https://deploy-preview-45056--kubernetes-io-main-staging.netlify.app/ar/