/* Additions scoped to Realengo multilingual components. */
#primary-menu-list > .rli-language-menu-item { align-self:center; padding:0; margin-left:12px; }
#primary-menu-list .rli-language-selector { display:inline-flex; align-items:center; gap:2px; padding:4px; border:1px solid #d4dbe5; border-radius:999px; white-space:nowrap; line-height:1; background:#fff; }
#primary-menu-list .rli-language-selector > a { display:inline-flex; align-items:center; justify-content:center; min-width:34px; min-height:34px; padding:6px 7px; margin:0; font:700 12px/1 Montserrat,Arial,sans-serif; color:#294e73; text-decoration:none; border-radius:50%; }
#primary-menu-list .rli-language-selector > a[aria-current="page"] { background:#0c4da2; color:#fff; }
#primary-menu-list .rli-language-selector > a:hover { background:#eaf1fb; color:#0c4da2; }
#primary-menu-list .rli-language-selector > a:focus-visible { outline:3px solid #e5ae26; outline-offset:2px; }

/* Desktop (theme breakpoint: 721px). The wider header must not apply on phones. */
@media (min-width:722px) {
  html[data-rli-lang="en"] .site-header,html[data-rli-lang="es"] .site-header { max-width:min(1300px, calc(100% - 48px)); }
  #primary-menu-list.menu-wrapper { flex-wrap:wrap; }
  /* Smaller menu text so the translated menu fits beside the logo on smaller screens. */
  #primary-menu-list > li:not(.rli-language-menu-item) > a { font-size:14px; padding-left:9px; padding-right:9px; }
  /* Compact language selector. */
  #primary-menu-list > .rli-language-menu-item { margin-left:8px; margin-right:var(--primary-nav--padding, 13px); }
  #primary-menu-list .rli-language-selector { gap:0; padding:2px; }
  #primary-menu-list .rli-language-selector > a { min-width:24px; min-height:24px; padding:0 5px; font-size:10px; letter-spacing:.02em; }
}
@media (min-width:722px) and (max-width:1199px) {
  #primary-menu-list > li:not(.rli-language-menu-item) > a { font-size:13px; padding-left:7px; padding-right:7px; }
}

/* Mobile (theme breakpoint: 721px). */
@media (max-width:721px) {
  /* No sideways page drag on iOS Safari/Chrome and Android Chrome
     (the closed off-canvas menu sits just outside the right edge). */
  html, body { overflow-x:hidden; }
  @supports (overflow-x:clip) { html, body { overflow-x:clip; } }

  /* Open menu: full-screen panel that scrolls on its own, sized to the visible area.
     The theme only does this up to 481px; between 482px and 721px the "Close" button
     overflowed to the right and widened the page. */
  .primary-navigation-open .primary-navigation { position:fixed; top:0; right:0; left:0; width:100%; z-index:2; }
  .primary-navigation-open .menu-button-container { position:absolute; top:0; right:0; left:0; width:100%; }
  .primary-navigation-open .primary-navigation > .primary-menu-container {
    position:fixed; top:0; right:0; bottom:0; left:0;
    width:100%; max-width:100%; height:100vh; height:100dvh;
    box-sizing:border-box;
    overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
    padding-bottom:calc(32px + env(safe-area-inset-bottom, 0px));
    transform:none; margin:0; z-index:499;
  }
  .admin-bar.primary-navigation-open .primary-navigation > .primary-menu-container { top:var(--global--admin-bar--height, 46px); height:calc(100dvh - var(--global--admin-bar--height, 46px)); }
  .primary-navigation-open #primary-menu-list { flex-direction:column; flex-wrap:nowrap; width:100%; }
  .primary-navigation-open #primary-menu-list > li { width:100%; max-width:100%; }

  /* Language selector first in the mobile menu, always visible without scrolling. */
  #primary-menu-list > .rli-language-menu-item { order:-1; align-self:flex-start; width:auto; margin:4px 0 20px; padding:0; }
  #primary-menu-list .rli-language-selector > a { min-width:44px; min-height:44px; font-size:13px; }
}
@media (min-width:482px) and (max-width:721px) {
  #primary-menu-list > .rli-language-menu-item { margin-left:var(--primary-nav--padding, 13px); }
}
