/* Barkodsal shared navbar: one canonical theme for every public page. */
.modern-navbar{position:relative;z-index:1050;width:100%;padding:10px 0!important;background:#fff!important;background-image:none!important;border-top:3px solid #173f35!important;border-bottom:1px solid #dfe5ee!important;box-shadow:0 10px 28px rgba(15,23,42,.10)!important;color:#172033!important}
.modern-navbar .container{display:flex;align-items:center;max-width:1320px}.modern-navbar .navbar-brand{display:flex;align-items:center;gap:10px;margin:0;color:#172554!important;text-decoration:none}.modern-navbar .brand-mark{display:grid;place-items:center;width:46px;height:46px;flex:0 0 46px;padding:4px;border:1px solid #d8e0eb;border-radius:13px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.12)}.modern-navbar .brand-program-icon{display:block;width:38px;height:38px;object-fit:contain}.modern-navbar .brand-copy{display:flex;flex-direction:column;line-height:1.12}.modern-navbar .brand-copy strong{font-size:1.05rem;font-weight:850;color:#172554!important}.modern-navbar .brand-copy small{margin-top:3px;font-size:.65rem;font-weight:650;color:#667085!important}.modern-navbar .navbar-collapse{align-items:center}.modern-navbar .navbar-nav{gap:6px}
.modern-navbar .navbar-nav>.nav-item>.nav-link{display:flex;align-items:center;justify-content:center;min-height:44px;padding:9px 15px!important;margin:0;border:1px solid transparent!important;border-radius:11px;background:transparent!important;background-image:none!important;color:#344054!important;font-weight:750;box-shadow:none!important;transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease!important}.modern-navbar .navbar-nav>.nav-item>.nav-link:hover,.modern-navbar .navbar-nav>.nav-item>.nav-link:focus-visible,.modern-navbar .navbar-nav>.nav-item>.nav-link.active{background:#eef3ff!important;color:#315bea!important;border-color:#d7e0fb!important;transform:translateY(-1px)}
.modern-navbar .navbar-actions{display:flex;align-items:center;gap:8px;margin:0!important}.modern-navbar .navbar-actions .language-switcher{margin:0!important}.modern-navbar .navbar-actions .btn-login,.modern-navbar .navbar-actions .btn-register,.modern-navbar .navbar-actions .language-switcher>.btn,.modern-navbar .navbar-actions .user-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin:0!important;padding:9px 16px!important;border-radius:11px!important;font-weight:750;text-decoration:none;transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease!important}.modern-navbar .navbar-actions .btn-login,.modern-navbar .navbar-actions .language-switcher>.btn,.modern-navbar .navbar-actions .user-toggle{background:#fff!important;background-image:none!important;color:#344054!important;border:1px solid #d7dee9!important;box-shadow:none!important;filter:none!important}.modern-navbar .navbar-actions .btn-login:hover,.modern-navbar .navbar-actions .btn-login:focus-visible,.modern-navbar .navbar-actions .language-switcher>.btn:hover,.modern-navbar .navbar-actions .language-switcher>.btn:focus-visible,.modern-navbar .navbar-actions .user-toggle:hover,.modern-navbar .navbar-actions .user-toggle:focus-visible{background:#eef3ff!important;color:#2447c5!important;border-color:#b9c8f5!important;box-shadow:0 8px 18px rgba(49,91,234,.12)!important;transform:translateY(-1px)!important}.modern-navbar .navbar-actions .btn-register{background:#315bea!important;background-image:none!important;color:#fff!important;border:1px solid #315bea!important;box-shadow:0 8px 18px rgba(49,91,234,.20)!important}.modern-navbar .navbar-actions .btn-register:hover,.modern-navbar .navbar-actions .btn-register:focus-visible{background:#2447c5!important;background-image:none!important;color:#fff!important;border-color:#2447c5!important;box-shadow:0 11px 24px rgba(36,71,197,.27)!important;transform:translateY(-1px)!important}.modern-navbar .navbar-actions *::before,.modern-navbar .navbar-nav .nav-link::before{display:none!important}
.modern-navbar .language-flag-img{width:23px;height:16px;object-fit:cover;border-radius:2px}.modern-navbar .dropdown-menu{z-index:2000;padding:8px;border:1px solid #e2e8f0;border-radius:13px;background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.14)}.modern-navbar .dropdown-item{padding:9px 12px;border-radius:9px;color:#344054!important;font-weight:600}.modern-navbar .dropdown-item:hover,.modern-navbar .dropdown-item:focus,.modern-navbar .dropdown-item.active{background:#eef3ff!important;color:#2447c5!important}.modern-navbar .avatar-wrapper{position:relative;display:inline-block!important;width:36px!important;height:36px!important;min-width:36px!important;flex:0 0 36px!important;margin:0!important}.modern-navbar .avatar-navbar{display:block!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;min-height:36px!important;max-height:36px!important;margin:0!important;padding:0!important;border:2px solid #315bea!important;border-radius:50%!important;object-fit:cover!important;box-sizing:border-box!important}.modern-navbar .online-dot{position:absolute;right:0;bottom:1px;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#12b76a}.modern-navbar .navbar-toggler{border:1px solid #d7dee9!important;background:#fff!important;box-shadow:none!important}
@media(max-width:1199.98px){.modern-navbar .brand-copy small{display:none}.modern-navbar .navbar-nav>.nav-item>.nav-link{padding-inline:11px!important}.modern-navbar .navbar-actions .btn-login,.modern-navbar .navbar-actions .btn-register,.modern-navbar .navbar-actions .language-switcher>.btn{padding-inline:12px!important}}@media(max-width:991.98px){.modern-navbar{padding:8px 0!important}.modern-navbar .navbar-collapse{margin-top:10px;padding:12px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;box-shadow:0 14px 30px rgba(15,23,42,.10)}.modern-navbar .navbar-nav{gap:4px}.modern-navbar .navbar-nav>.nav-item>.nav-link{justify-content:flex-start}.modern-navbar .navbar-actions{flex-wrap:wrap;margin-top:10px!important}.modern-navbar .navbar-actions>*{margin:0!important}}

/* Favicon palette lock shared identically by every page. */
.modern-navbar .navbar-nav>.nav-item>.nav-link:hover,.modern-navbar .navbar-nav>.nav-item>.nav-link:focus-visible,.modern-navbar .navbar-nav>.nav-item>.nav-link.active{background:#eef1ff!important;color:#4f46f5!important;border-color:#d8ddff!important}.modern-navbar .navbar-actions .btn-login:hover,.modern-navbar .navbar-actions .btn-login:focus-visible,.modern-navbar .navbar-actions .language-switcher>.btn:hover,.modern-navbar .navbar-actions .language-switcher>.btn:focus-visible,.modern-navbar .navbar-actions .user-toggle:hover,.modern-navbar .navbar-actions .user-toggle:focus-visible{background:#eef1ff!important;color:#4338ca!important;border-color:#b8c2fb!important;box-shadow:0 8px 18px rgba(79,70,245,.12)!important}.modern-navbar .navbar-actions .btn-register{background:linear-gradient(135deg,#2563ff,#4f46f5 54%,#7c2df3)!important;color:#fff!important;border-color:#4f46f5!important;box-shadow:0 9px 20px rgba(79,70,245,.22)!important}.modern-navbar .navbar-actions .btn-register:hover,.modern-navbar .navbar-actions .btn-register:focus-visible{background:linear-gradient(135deg,#1d4ed8,#4338ca 54%,#6d28d9)!important;color:#fff!important;border-color:#4338ca!important;box-shadow:0 12px 25px rgba(79,70,245,.28)!important}.modern-navbar .dropdown-item:hover,.modern-navbar .dropdown-item:focus,.modern-navbar .dropdown-item.active{background:#eef1ff!important;color:#4338ca!important}.modern-navbar .avatar-navbar{border-color:#4f46f5!important}

/* Single authoritative navbar cascade. The ID prevents page CSS from changing it. */
#siteNavbar{position:relative!important;z-index:1050!important;width:100%!important;min-height:72px!important;padding:9px 0!important;background:#fff!important;background-image:none!important;border-top:3px solid #172554!important;border-bottom:1px solid #dfe5ef!important;box-shadow:0 9px 26px rgba(23,37,84,.09)!important;color:#25324a!important;backdrop-filter:none!important}
#siteNavbar>.container{display:flex!important;align-items:center!important;max-width:1320px!important}
#siteNavbar .navbar-brand{display:flex!important;align-items:center!important;gap:10px!important;margin:0!important;color:#172554!important;text-decoration:none!important}
#siteNavbar .brand-mark{display:grid!important;place-items:center!important;width:46px!important;height:46px!important;flex:0 0 46px!important;padding:4px!important;border:1px solid #d8deeb!important;border-radius:13px!important;background:#fff!important;background-image:none!important;box-shadow:0 8px 18px rgba(23,37,84,.11)!important}
#siteNavbar .brand-program-icon{display:block!important;width:38px!important;height:38px!important;object-fit:contain!important;filter:none!important}
#siteNavbar .brand-copy{display:flex!important;flex-direction:column!important;line-height:1.12!important}#siteNavbar .brand-copy strong{color:#172554!important;font-size:1.05rem!important;font-weight:850!important}#siteNavbar .brand-copy small{margin-top:3px!important;color:#667085!important;font-size:.65rem!important;font-weight:650!important}
#siteNavbar .navbar-collapse{align-items:center!important}#siteNavbar .navbar-nav{gap:6px!important}
#siteNavbar .navbar-nav>.nav-item>.nav-link{display:flex!important;align-items:center!important;justify-content:center!important;min-height:44px!important;margin:0!important;padding:9px 15px!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;background-image:none!important;color:#344054!important;font-weight:750!important;box-shadow:none!important;filter:none!important;transform:none!important;transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease!important}
#siteNavbar .navbar-nav>.nav-item>.nav-link:hover,#siteNavbar .navbar-nav>.nav-item>.nav-link:focus-visible,#siteNavbar .navbar-nav>.nav-item>.nav-link.active{background:#eef1ff!important;background-image:none!important;color:#4f46f5!important;border-color:#d8ddff!important;box-shadow:none!important;filter:none!important;transform:translateY(-1px)!important}
#siteNavbar .navbar-actions{display:flex!important;align-items:center!important;gap:8px!important;margin:0!important}#siteNavbar .language-switcher{margin:0!important}
#siteNavbar .navbar-actions .btn-login,#siteNavbar .navbar-actions .btn-register,#siteNavbar .navbar-actions .language-switcher>.btn,#siteNavbar .navbar-actions .user-toggle{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-height:44px!important;margin:0!important;padding:9px 16px!important;border-radius:11px!important;font-weight:750!important;text-decoration:none!important;filter:none!important;transform:none!important;transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease!important}
#siteNavbar .navbar-actions .btn-login,#siteNavbar .navbar-actions .language-switcher>.btn,#siteNavbar .navbar-actions .user-toggle{border:1px solid #d7deea!important;background:#fff!important;background-image:none!important;color:#344054!important;box-shadow:none!important}
#siteNavbar .navbar-actions .btn-login:hover,#siteNavbar .navbar-actions .btn-login:focus-visible,#siteNavbar .navbar-actions .language-switcher>.btn:hover,#siteNavbar .navbar-actions .language-switcher>.btn:focus-visible,#siteNavbar .navbar-actions .user-toggle:hover,#siteNavbar .navbar-actions .user-toggle:focus-visible{border-color:#b8c2fb!important;background:#eef1ff!important;background-image:none!important;color:#4338ca!important;box-shadow:0 8px 18px rgba(79,70,245,.12)!important;filter:none!important;transform:translateY(-1px)!important}
#siteNavbar .navbar-actions .btn-register{border:1px solid #4f46f5!important;background:linear-gradient(135deg,#2563ff,#4f46f5 54%,#7c2df3)!important;color:#fff!important;box-shadow:0 9px 20px rgba(79,70,245,.22)!important}
#siteNavbar .navbar-actions .btn-register:hover,#siteNavbar .navbar-actions .btn-register:focus-visible{border-color:#4338ca!important;background:linear-gradient(135deg,#1d4ed8,#4338ca 54%,#6d28d9)!important;color:#fff!important;box-shadow:0 12px 25px rgba(79,70,245,.28)!important;transform:translateY(-1px)!important}
#siteNavbar .navbar-nav .nav-link::before,#siteNavbar .navbar-actions *::before{display:none!important}
#siteNavbar .language-flag-img{width:23px!important;height:16px!important;object-fit:cover!important;border-radius:2px!important}#siteNavbar .dropdown-menu{z-index:2000!important;padding:8px!important;border:1px solid #dfe5ef!important;border-radius:13px!important;background:#fff!important;box-shadow:0 18px 42px rgba(23,37,84,.14)!important}#siteNavbar .dropdown-item{padding:9px 12px!important;border-radius:9px!important;background:#fff!important;color:#344054!important;font-weight:600!important}#siteNavbar .dropdown-item:hover,#siteNavbar .dropdown-item:focus,#siteNavbar .dropdown-item.active{background:#eef1ff!important;color:#4338ca!important}
#siteNavbar .user-menu{min-width:168px!important;padding:8px!important}#siteNavbar .user-menu li{width:100%}#siteNavbar .user-menu .dropdown-item{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;min-height:40px!important;margin:0!important;padding:9px 14px!important;text-align:left!important}#siteNavbar .user-menu .dropdown-item i{display:none!important}#siteNavbar .user-menu .dropdown-divider{margin:7px 0!important}
#siteNavbar .avatar-wrapper{position:relative!important;display:inline-block!important;width:36px!important;height:36px!important;min-width:36px!important;flex:0 0 36px!important;margin:0!important}#siteNavbar .avatar-navbar{display:block!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;min-height:36px!important;max-height:36px!important;margin:0!important;padding:0!important;border:2px solid #4f46f5!important;border-radius:50%!important;object-fit:cover!important}#siteNavbar .online-dot{position:absolute!important;right:0!important;bottom:1px!important;width:10px!important;height:10px!important;border:2px solid #fff!important;border-radius:50%!important;background:#12b76a!important}
#siteNavbar .navbar-toggler{border:1px solid #d7deea!important;background:#fff!important;box-shadow:none!important}
#siteNavbar .navbar-toggler-icon{display:block!important;width:1.45em!important;height:1.45em!important;opacity:1!important;filter:none!important;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23172554' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")!important;background-repeat:no-repeat!important;background-position:center!important;background-size:100%!important}
#siteNavbar .navbar-toggler:hover,#siteNavbar .navbar-toggler:focus-visible{border-color:#b8c2fb!important;background:#eef1ff!important;box-shadow:0 0 0 4px rgba(79,70,245,.10)!important}
@media(max-width:1199.98px){#siteNavbar .brand-copy small{display:none!important}#siteNavbar .navbar-nav>.nav-item>.nav-link{padding-inline:11px!important}#siteNavbar .navbar-actions .btn-login,#siteNavbar .navbar-actions .btn-register,#siteNavbar .navbar-actions .language-switcher>.btn{padding-inline:12px!important}}@media(max-width:991.98px){#siteNavbar{padding:8px 0!important}#siteNavbar .navbar-collapse{margin-top:10px!important;padding:12px!important;border:1px solid #dfe5ef!important;border-radius:14px!important;background:#fff!important;box-shadow:0 14px 30px rgba(23,37,84,.10)!important}#siteNavbar .navbar-nav{gap:4px!important}#siteNavbar .navbar-nav>.nav-item>.nav-link{justify-content:flex-start!important}#siteNavbar .navbar-actions{flex-wrap:wrap!important;margin-top:10px!important}}

/* Transparent, native-resolution vector branding without a white tile. */
#siteNavbar .brand-mark,#siteNavbar .brand-mark:hover{padding:0!important;border:0!important;background:transparent!important;background-image:none!important;box-shadow:none!important;filter:none!important;transform:none!important;overflow:visible!important}
#siteNavbar .brand-program-icon,#siteNavbar .brand-program-icon:hover{width:46px!important;height:46px!important;max-width:46px!important;max-height:46px!important;border-radius:13px!important;opacity:1!important;filter:none!important;transform:none!important;image-rendering:auto!important}

/* Keep the viewport width identical on short and long pages. Without a
   reserved scrollbar lane, centered navbar content shifts on navigation. */
html{
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
}
#siteNavbar,
#siteNavbar>.container{
  box-sizing:border-box!important;
}

/* Modern floating navbar shadow; visual only, so page widths never move. */
#siteNavbar{
  border-bottom-color:#e2e6f1!important;
  box-shadow:0 1px 0 rgba(23,37,84,.045),0 7px 24px rgba(23,37,84,.105),0 16px 42px rgba(79,70,245,.045)!important;
}

/* Long translations stay on one line without breaking controls. */
#siteNavbar .navbar-nav>.nav-item>.nav-link,
#siteNavbar .navbar-actions .btn-login,
#siteNavbar .navbar-actions .btn-register,
#siteNavbar .navbar-actions .language-switcher>.btn,
#siteNavbar .navbar-actions .user-toggle,
#siteNavbar .language-name{white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important;flex-shrink:0!important}
#siteNavbar .navbar-collapse{min-width:0!important}
#siteNavbar .navbar-nav{min-width:0!important;flex-wrap:nowrap!important}
#siteNavbar .navbar-actions{flex:0 0 auto!important;white-space:nowrap!important}
#siteNavbar .language-switcher>.btn{width:auto!important;min-width:max-content!important}
@media (max-width:1399.98px) and (min-width:992px){
  #siteNavbar>.container{max-width:100%!important;padding-inline:18px!important}
  #siteNavbar .navbar-brand{gap:7px!important}
  #siteNavbar .brand-copy strong{font-size:.98rem!important}
  #siteNavbar .brand-copy small{display:none!important}
  #siteNavbar .navbar-nav{gap:2px!important}
  #siteNavbar .navbar-nav>.nav-item>.nav-link{padding-inline:9px!important;font-size:.88rem!important}
  #siteNavbar .navbar-actions{gap:6px!important}
  #siteNavbar .navbar-actions .btn-login,#siteNavbar .navbar-actions .btn-register,#siteNavbar .navbar-actions .language-switcher>.btn{padding-inline:10px!important;font-size:.88rem!important}
}
@media (max-width:1099.98px) and (min-width:992px){
  #siteNavbar .language-name{display:none!important}
  #siteNavbar .navbar-actions .language-switcher>.btn{min-width:46px!important;padding-inline:9px!important}
}
@media(max-width:991.98px){
  #siteNavbar .navbar-nav{flex-wrap:wrap!important}
  #siteNavbar .navbar-actions{width:100%!important;justify-content:center!important;white-space:normal!important}
  #siteNavbar .language-name{display:inline!important}
  #siteNavbar .navbar-actions .user-dropdown{display:flex!important;justify-content:center!important;width:100%!important;margin-inline:0!important}
  #siteNavbar .navbar-actions .user-toggle{margin-inline:auto!important}
  #siteNavbar .navbar-actions .user-menu{left:50%!important;right:auto!important;transform:translateX(-50%)!important}
}

/* On phones the language control is the first item inside the opened menu. */
#siteNavbar .navbar-mobile-language{display:none}
@media(max-width:991.98px){
  #siteNavbar .navbar-mobile-language{display:block!important;margin:0 0 8px!important}
  #siteNavbar .navbar-mobile-language .language-switcher{display:block!important;width:100%!important;margin:0!important}
  #siteNavbar .navbar-mobile-language .language-switcher>.btn{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;width:100%!important;min-width:0!important;min-height:44px!important;margin:0!important;padding:9px 13px!important;border:1px solid #d7deea!important;border-radius:11px!important;background:#fff!important;color:#344054!important;box-shadow:none!important}
  #siteNavbar .navbar-mobile-language .language-name{display:inline!important}
  #siteNavbar .navbar-mobile-language .dropdown-toggle::after{margin-left:auto!important}
  #siteNavbar .navbar-mobile-language .dropdown-menu{position:static!important;width:100%!important;margin-top:6px!important;transform:none!important}
}

/* Desktop: show the complete brand description and keep action buttons in one row. */
@media(min-width:992px){
  html body #siteNavbar>.container{width:calc(100% - 32px)!important;max-width:1540px!important;padding-inline:0!important}
  html body #siteNavbar .navbar-brand{flex:0 0 auto!important;min-width:max-content!important;margin-right:18px!important}
  html body #siteNavbar .brand-copy{flex:0 0 auto!important;min-width:max-content!important;overflow:visible!important}
  html body #siteNavbar .brand-copy small{display:block!important;width:max-content!important;max-width:none!important;white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
  html body #siteNavbar .navbar-collapse{display:flex!important;flex:1 1 auto!important;min-width:0!important;gap:14px!important}
  html body #siteNavbar .navbar-nav{flex:1 1 auto!important;justify-content:center!important;min-width:0!important}
  html body #siteNavbar .navbar-actions{display:flex!important;flex:0 0 auto!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;min-width:max-content!important}
  html body #siteNavbar .navbar-actions>*{position:relative!important;flex:0 0 auto!important;margin:0!important}
  html body #siteNavbar .navbar-desktop-language{display:block!important;flex:0 0 auto!important}
  html body #siteNavbar .navbar-actions .language-switcher{display:block!important;width:auto!important;margin:0!important}
  html body #siteNavbar .navbar-actions .btn-login,html body #siteNavbar .navbar-actions .btn-register{position:relative!important;z-index:1!important;flex:0 0 auto!important}
}
@media(min-width:992px) and (max-width:1399.98px){
  html body #siteNavbar>.container{width:calc(100% - 24px)!important}
  html body #siteNavbar .navbar-brand{flex:0 1 245px!important;min-width:180px!important;margin-right:10px!important}
  html body #siteNavbar .brand-copy{flex:1 1 auto!important;min-width:0!important}
  html body #siteNavbar .brand-copy small{width:auto!important;max-width:230px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;font-size:.58rem!important;line-height:1.15!important;letter-spacing:.15px!important}
  html body #siteNavbar .navbar-collapse{gap:8px!important}
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{padding-inline:7px!important;font-size:.82rem!important}
  html body #siteNavbar .navbar-actions{gap:5px!important}
  html body #siteNavbar .navbar-actions .btn-login,html body #siteNavbar .navbar-actions .btn-register,html body #siteNavbar .navbar-actions .language-switcher>.btn{padding-inline:8px!important;font-size:.82rem!important}
}

/* v117 — mobile navbar uses the exact same visual colors as desktop */
@media (max-width:991.98px){
  html body #siteNavbar,
  html body #siteNavbar.modern-navbar{
    background:#fff!important;
    background-color:#fff!important;
    background-image:none!important;
    color:#25324a!important;
  }

  html body #siteNavbar .navbar-collapse{
    background:#fff!important;
    background-color:#fff!important;
    background-image:none!important;
    border:1px solid #dfe5ef!important;
    box-shadow:0 14px 30px rgba(23,37,84,.10)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
    background:transparent!important;
    background-image:none!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
    border-color:transparent!important;
    box-shadow:none!important;
    opacity:1!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:hover,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:focus-visible,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link.active{
    background:#eef1ff!important;
    background-image:none!important;
    color:#4f46f5!important;
    -webkit-text-fill-color:#4f46f5!important;
    border-color:#d8ddff!important;
    opacity:1!important;
  }

  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn,
  html body #siteNavbar .navbar-actions .language-switcher>.btn,
  html body #siteNavbar .navbar-actions .btn-login,
  html body #siteNavbar .navbar-actions .user-toggle{
    background:#fff!important;
    background-color:#fff!important;
    background-image:none!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
    border:1px solid #d7deea!important;
    box-shadow:none!important;
    opacity:1!important;
  }

  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn:hover,
  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn:focus-visible,
  html body #siteNavbar .navbar-actions .language-switcher>.btn:hover,
  html body #siteNavbar .navbar-actions .language-switcher>.btn:focus-visible,
  html body #siteNavbar .navbar-actions .btn-login:hover,
  html body #siteNavbar .navbar-actions .btn-login:focus-visible,
  html body #siteNavbar .navbar-actions .user-toggle:hover,
  html body #siteNavbar .navbar-actions .user-toggle:focus-visible{
    background:#eef1ff!important;
    background-image:none!important;
    color:#4338ca!important;
    -webkit-text-fill-color:#4338ca!important;
    border-color:#b8c2fb!important;
    box-shadow:0 8px 18px rgba(79,70,245,.12)!important;
  }

  html body #siteNavbar .navbar-actions .btn-register{
    background:linear-gradient(135deg,#2563ff,#4f46f5 54%,#7c2df3)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    border-color:#4f46f5!important;
    box-shadow:0 9px 20px rgba(79,70,245,.22)!important;
  }

  html body #siteNavbar .navbar-actions .btn-register:hover,
  html body #siteNavbar .navbar-actions .btn-register:focus-visible{
    background:linear-gradient(135deg,#1d4ed8,#4338ca 54%,#6d28d9)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    border-color:#4338ca!important;
    box-shadow:0 12px 25px rgba(79,70,245,.28)!important;
  }

  html body #siteNavbar .navbar-brand,
  html body #siteNavbar .brand-copy strong{
    color:#172554!important;
    -webkit-text-fill-color:#172554!important;
  }

  html body #siteNavbar .brand-copy small{
    color:#667085!important;
    -webkit-text-fill-color:#667085!important;
  }

  html body #siteNavbar .dropdown-menu{
    background:#fff!important;
    background-image:none!important;
    border-color:#dfe5ef!important;
  }

  html body #siteNavbar .dropdown-item{
    background:#fff!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
  }

  html body #siteNavbar .dropdown-item:hover,
  html body #siteNavbar .dropdown-item:focus,
  html body #siteNavbar .dropdown-item.active{
    background:#eef1ff!important;
    color:#4338ca!important;
    -webkit-text-fill-color:#4338ca!important;
  }
}


/* v118 — force the opened mobile navbar interior to use desktop colors */
@media (max-width:991.98px){
  html body #siteNavbar .navbar-collapse,
  html body #siteNavbar .navbar-collapse.collapse,
  html body #siteNavbar .navbar-collapse.collapse.show,
  html body #siteNavbar .navbar-collapse.collapsing,
  html body #siteNavbar .navbar-collapse.show{
    background:#fff!important;
    background-color:#fff!important;
    background-image:none!important;
    color:#344054!important;
    border:1px solid #dfe5ef!important;
    box-shadow:0 14px 30px rgba(23,37,84,.10)!important;
    opacity:1!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  html body #siteNavbar .navbar-collapse::before,
  html body #siteNavbar .navbar-collapse::after,
  html body #siteNavbar .navbar-nav::before,
  html body #siteNavbar .navbar-nav::after,
  html body #siteNavbar .navbar-actions::before,
  html body #siteNavbar .navbar-actions::after{
    content:none!important;
    display:none!important;
    background:none!important;
  }

  html body #siteNavbar .navbar-nav,
  html body #siteNavbar .navbar-actions,
  html body #siteNavbar .navbar-mobile-language,
  html body #siteNavbar .navbar-desktop-language{
    background:transparent!important;
    background-image:none!important;
    color:#344054!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:link,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:visited{
    background:#fff!important;
    background-image:none!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
    border:1px solid transparent!important;
    opacity:1!important;
    filter:none!important;
    text-shadow:none!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link.active,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:hover,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:focus,
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link:focus-visible{
    background:#eef1ff!important;
    background-image:none!important;
    color:#4f46f5!important;
    -webkit-text-fill-color:#4f46f5!important;
    border-color:#d8ddff!important;
    opacity:1!important;
  }

  html body #siteNavbar .navbar-mobile-language .language-switcher,
  html body #siteNavbar .navbar-mobile-language .dropdown,
  html body #siteNavbar .navbar-mobile-language .dropdown-toggle{
    background:transparent!important;
  }

  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn,
  html body #siteNavbar .navbar-mobile-language .dropdown-toggle,
  html body #siteNavbar .navbar-actions .btn-login,
  html body #siteNavbar .navbar-actions .user-toggle{
    background:#fff!important;
    background-color:#fff!important;
    background-image:none!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
    border:1px solid #d7deea!important;
    opacity:1!important;
    filter:none!important;
    text-shadow:none!important;
  }

  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn:hover,
  html body #siteNavbar .navbar-mobile-language .language-switcher>.btn:focus,
  html body #siteNavbar .navbar-mobile-language .dropdown-toggle:hover,
  html body #siteNavbar .navbar-mobile-language .dropdown-toggle:focus,
  html body #siteNavbar .navbar-actions .btn-login:hover,
  html body #siteNavbar .navbar-actions .btn-login:focus,
  html body #siteNavbar .navbar-actions .user-toggle:hover,
  html body #siteNavbar .navbar-actions .user-toggle:focus{
    background:#eef1ff!important;
    color:#4338ca!important;
    -webkit-text-fill-color:#4338ca!important;
    border-color:#b8c2fb!important;
  }

  html body #siteNavbar .navbar-actions .btn-register,
  html body #siteNavbar .navbar-actions .btn-register:link,
  html body #siteNavbar .navbar-actions .btn-register:visited{
    background:linear-gradient(135deg,#2563ff,#4f46f5 54%,#7c2df3)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    border-color:#4f46f5!important;
  }

  html body #siteNavbar .navbar-actions .btn-register:hover,
  html body #siteNavbar .navbar-actions .btn-register:focus{
    background:linear-gradient(135deg,#1d4ed8,#4338ca 54%,#6d28d9)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
  }

  html body #siteNavbar .navbar-mobile-language .dropdown-menu,
  html body #siteNavbar .navbar-actions .dropdown-menu,
  html body #siteNavbar .user-menu{
    background:#fff!important;
    background-image:none!important;
    color:#344054!important;
    border:1px solid #dfe5ef!important;
    box-shadow:0 16px 34px rgba(23,37,84,.12)!important;
  }

  html body #siteNavbar .dropdown-item,
  html body #siteNavbar .dropdown-item:link,
  html body #siteNavbar .dropdown-item:visited{
    background:#fff!important;
    color:#344054!important;
    -webkit-text-fill-color:#344054!important;
  }

  html body #siteNavbar .dropdown-item:hover,
  html body #siteNavbar .dropdown-item:focus,
  html body #siteNavbar .dropdown-item.active{
    background:#eef1ff!important;
    color:#4338ca!important;
    -webkit-text-fill-color:#4338ca!important;
  }
}


/* v120 — mobile notification bell sits immediately before the toggler */
@media(max-width:991.98px){
  html body #siteNavbar .container{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
  }

  html body #siteNavbar .navbar-brand{
    margin-right:auto!important;
  }

  html body #siteNavbar .mobile-navbar-notification{
    display:block!important;
    margin-left:auto!important;
    margin-right:8px!important;
    position:relative!important;
  }

  html[dir="rtl"] body #siteNavbar .mobile-navbar-notification{
    margin-left:8px!important;
    margin-right:auto!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-toggle{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    border:1px solid #d7deea!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#172554!important;
    box-shadow:none!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-toggle:hover,
  html body #siteNavbar .mobile-navbar-notification .notification-toggle:focus-visible{
    border-color:#b8c2fb!important;
    background:#eef1ff!important;
    color:#4338ca!important;
    box-shadow:0 0 0 4px rgba(79,70,245,.10)!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-bell-icon{
    width:20px!important;
    height:20px!important;
    stroke:currentColor!important;
    fill:none!important;
    stroke-width:1.9!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-menu{
    position:absolute!important;
    right:0!important;
    left:auto!important;
    top:calc(100% + 8px)!important;
    width:min(340px,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    margin:0!important;
  }

  html[dir="rtl"] body #siteNavbar .mobile-navbar-notification .notification-menu{
    right:auto!important;
    left:0!important;
  }

  html body #siteNavbar .desktop-navbar-notification{
    display:none!important;
  }

  html body #siteNavbar #mainNavbar{
    flex-basis:100%!important;
    width:100%!important;
  }
}

@media(min-width:992px){
  html body #siteNavbar .mobile-navbar-notification{
    display:none!important;
  }

  html body #siteNavbar .desktop-navbar-notification{
    display:block!important;
  }
}


/* v121 — keep Barkodsal brand readable when sticky navbar switches to dark background */
html body #siteNavbar .brand-copy strong{
  transition:color .2s ease,-webkit-text-fill-color .2s ease!important;
}

html body #siteNavbar.is-scrolled .brand-copy strong{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

html body #siteNavbar.is-scrolled .brand-copy small{
  color:rgba(255,255,255,.78)!important;
  -webkit-text-fill-color:rgba(255,255,255,.78)!important;
}

/* At the top of the page preserve the existing desktop/mobile light-navbar colors. */
html body #siteNavbar:not(.is-scrolled) .brand-copy strong{
  color:#172554!important;
  -webkit-text-fill-color:#172554!important;
}

html body #siteNavbar:not(.is-scrolled) .brand-copy small{
  color:#667085!important;
  -webkit-text-fill-color:#667085!important;
}


/* v138 — canonical notification component restored across all pages */
html body #siteNavbar .notification-dropdown{position:relative!important}

html body #siteNavbar .notification-toggle{
  position:relative!important;display:grid!important;place-items:center!important;
  flex:0 0 42px!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
  padding:0!important;margin:0!important;border:1px solid #d7deea!important;border-radius:12px!important;
  background:#fff!important;background-image:none!important;color:#344054!important;box-shadow:none!important;
  line-height:1!important;overflow:visible!important;transition:.18s ease!important;
}
html body #siteNavbar .notification-toggle:hover,
html body #siteNavbar .notification-toggle:focus,
html body #siteNavbar .notification-toggle:focus-visible,
html body #siteNavbar .notification-dropdown.show>.notification-toggle{
  background:#eef1ff!important;color:#4338ca!important;border-color:#b8c2fb!important;
  box-shadow:0 8px 18px rgba(79,70,245,.12)!important;
}
html body #siteNavbar.is-scrolled .notification-toggle{
  background:rgba(255,255,255,.06)!important;color:#fff!important;border-color:rgba(199,210,254,.28)!important;
}
html body #siteNavbar.is-scrolled .notification-toggle:hover,
html body #siteNavbar.is-scrolled .notification-dropdown.show>.notification-toggle{
  background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(224,231,255,.46)!important;
}
html body #siteNavbar .notification-bell-icon{
  display:block!important;width:20px!important;height:20px!important;max-width:20px!important;max-height:20px!important;
  fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important;
  pointer-events:none!important;
}
html body #siteNavbar .notification-badge{
  position:absolute!important;top:-5px!important;right:-5px!important;display:grid!important;place-items:center!important;
  min-width:19px!important;height:19px!important;padding:0 5px!important;border:2px solid #fff!important;border-radius:999px!important;
  background:#ef4444!important;color:#fff!important;font-size:.62rem!important;font-weight:850!important;line-height:1!important;z-index:4!important;
}
html body #siteNavbar.is-scrolled .notification-badge{border-color:#172554!important}

html body #siteNavbar .notification-menu{
  width:min(380px,calc(100vw - 24px))!important;min-width:0!important;max-width:380px!important;
  padding:0!important;border:1px solid #dfe4f0!important;border-radius:16px!important;overflow:hidden!important;
  background:#fff!important;background-image:none!important;color:#344054!important;box-shadow:0 18px 42px rgba(23,37,84,.14)!important;
}
html body #siteNavbar .notification-menu-head{
  padding:13px 15px!important;border-bottom:1px solid #edf0f5!important;background:#fff!important;color:#172554!important;
}
html body #siteNavbar .notification-menu-list{
  max-height:390px!important;overflow:auto!important;padding:7px!important;background:#fff!important;
}
html body #siteNavbar .notification-empty{padding:18px 12px!important;text-align:center!important;color:#7b8496!important;font-size:.82rem!important}
html body #siteNavbar .notification-item-form{margin:0!important}
html body #siteNavbar .notification-item{
  display:flex!important;width:100%!important;gap:10px!important;align-items:flex-start!important;padding:11px!important;
  border:0!important;border-radius:11px!important;background:#fff!important;color:#344054!important;text-align:left!important;
  cursor:pointer!important;box-shadow:none!important;
}
html body #siteNavbar .notification-item:hover{background:#f5f7ff!important}
html body #siteNavbar .notification-item.unread{background:#f1f4ff!important}
html body #siteNavbar .notification-item-icon{
  display:grid!important;place-items:center!important;flex:0 0 34px!important;width:34px!important;height:34px!important;
  min-width:34px!important;min-height:34px!important;max-width:34px!important;max-height:34px!important;padding:0!important;
  border-radius:10px!important;background:#e9edff!important;color:#4f46f5!important;overflow:hidden!important;
}
html body #siteNavbar .notification-item-icon i{
  display:block!important;margin:0!important;color:inherit!important;font-size:1rem!important;line-height:1!important;
}
html body #siteNavbar .notification-item-copy{display:grid!important;gap:3px!important;min-width:0!important;flex:1 1 auto!important}
html body #siteNavbar .notification-item-copy strong{color:#172554!important;font-size:.78rem!important;font-weight:850!important;line-height:1.35!important}
html body #siteNavbar .notification-item-copy small{color:#667085!important;font-size:.71rem!important;line-height:1.45!important;white-space:normal!important;overflow-wrap:anywhere!important}
html[dir="rtl"] body #siteNavbar .notification-item{text-align:right!important}
html[dir="rtl"] body #siteNavbar .notification-badge{right:auto!important;left:-5px!important}

@media(max-width:991.98px){
  html body #siteNavbar .notification-menu{
    position:fixed!important;left:12px!important;right:12px!important;top:76px!important;width:auto!important;max-width:none!important;
  }
}
@media(min-width:992px){
  html body #siteNavbar .desktop-navbar-notification .notification-menu{
    position:absolute!important;left:auto!important;right:0!important;top:calc(100% + 8px)!important;
  }
}


/* v139 — ONE canonical navbar geometry for every public/profile page.
   These are the desktop/home-page dimensions and locations. */
:root{
  --barkodsal-navbar-height:76px;
  --barkodsal-navbar-max:1540px;
  --barkodsal-navbar-side:16px;
}

html{
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
}

html body #siteNavbar.modern-navbar{
  position:sticky!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  height:var(--barkodsal-navbar-height)!important;
  min-height:var(--barkodsal-navbar-height)!important;
  max-height:var(--barkodsal-navbar-height)!important;
  padding:8px 0!important;
  margin:0!important;
  box-sizing:border-box!important;
  z-index:1050!important;
}

html body #siteNavbar.modern-navbar > .container{
  width:calc(100% - 32px)!important;
  max-width:var(--barkodsal-navbar-max)!important;
  height:100%!important;
  min-height:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  box-sizing:border-box!important;
}

html body #siteNavbar .navbar-brand{
  flex:0 0 auto!important;
  min-width:max-content!important;
  height:52px!important;
  margin:0 18px 0 0!important;
  padding:0!important;
  gap:10px!important;
  display:flex!important;
  align-items:center!important;
}

html[dir="rtl"] body #siteNavbar .navbar-brand{
  margin:0 0 0 18px!important;
}

html body #siteNavbar .brand-mark,
html body #siteNavbar .brand-program-icon{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  flex:0 0 46px!important;
}

html body #siteNavbar .brand-copy{
  flex:0 0 auto!important;
  min-width:max-content!important;
  max-width:none!important;
  line-height:1.12!important;
}

html body #siteNavbar .brand-copy strong{
  font-size:1.05rem!important;
  line-height:1.12!important;
}

html body #siteNavbar .brand-copy small{
  display:block!important;
  width:max-content!important;
  max-width:none!important;
  margin-top:3px!important;
  font-size:.65rem!important;
  line-height:1.12!important;
  white-space:nowrap!important;
}

html body #siteNavbar #mainNavbar.navbar-collapse{
  display:flex!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  gap:14px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

html body #siteNavbar .navbar-nav{
  display:flex!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
}

html body #siteNavbar .navbar-nav>.nav-item{
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
}

html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
  min-height:44px!important;
  height:44px!important;
  padding:9px 15px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
  font-size:.94rem!important;
  line-height:1.2!important;
  box-sizing:border-box!important;
}

html body #siteNavbar .navbar-actions{
  display:flex!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:max-content!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
  white-space:nowrap!important;
}

html body #siteNavbar .navbar-actions>*{
  flex:0 0 auto!important;
  margin:0!important;
}

html body #siteNavbar .navbar-actions .language-switcher>.btn,
html body #siteNavbar .navbar-actions .btn-login,
html body #siteNavbar .navbar-actions .btn-register,
html body #siteNavbar .navbar-actions .user-toggle{
  min-height:44px!important;
  height:44px!important;
  padding:9px 16px!important;
  margin:0!important;
  border-radius:11px!important;
  font-size:.94rem!important;
  line-height:1.2!important;
  box-sizing:border-box!important;
}

html body #siteNavbar .user-toggle{
  max-width:260px!important;
}

html body #siteNavbar .avatar-wrapper,
html body #siteNavbar .avatar-navbar{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  max-width:36px!important;
  max-height:36px!important;
}

/* Keep the notification control identical on Home, Documentation, Profile, etc. */
html body #siteNavbar .desktop-navbar-notification{
  flex:0 0 42px!important;
  width:42px!important;
  height:42px!important;
  margin:0!important;
}

html body #siteNavbar .desktop-navbar-notification .notification-toggle{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  max-width:42px!important;
  max-height:42px!important;
}

/* Never allow generic page/container styles to resize navbar children. */
html body.home-page #siteNavbar *,
html body.info-page #siteNavbar *,
html body.profile-page #siteNavbar *,
html body.purchase-page #siteNavbar *,
html body.auth-page #siteNavbar *{
  box-sizing:border-box!important;
}

/* Compact desktop keeps the SAME locations/sizing logic, only trims spacing
   enough to fit translations without changing page-to-page geometry. */
@media (min-width:992px) and (max-width:1399.98px){
  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 24px)!important;
    max-width:100%!important;
    padding-inline:0!important;
  }

  html body #siteNavbar .navbar-brand{
    margin-right:10px!important;
    gap:7px!important;
  }

  html[dir="rtl"] body #siteNavbar .navbar-brand{
    margin-right:0!important;
    margin-left:10px!important;
  }

  html body #siteNavbar .brand-copy small{
    display:none!important;
  }

  html body #siteNavbar #mainNavbar.navbar-collapse{
    gap:8px!important;
  }

  html body #siteNavbar .navbar-nav{
    gap:2px!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
    padding-inline:9px!important;
    font-size:.88rem!important;
  }

  html body #siteNavbar .navbar-actions{
    gap:6px!important;
  }

  html body #siteNavbar .navbar-actions .language-switcher>.btn,
  html body #siteNavbar .navbar-actions .btn-login,
  html body #siteNavbar .navbar-actions .btn-register,
  html body #siteNavbar .navbar-actions .user-toggle{
    padding-inline:10px!important;
    font-size:.88rem!important;
  }
}

/* Mobile keeps the existing opened-menu design, but top-row geometry is shared. */
@media(max-width:991.98px){
  html body #siteNavbar.modern-navbar{
    height:auto!important;
    max-height:none!important;
    min-height:70px!important;
    padding:8px 0!important;
  }

  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    min-height:54px!important;
    height:auto!important;
    flex-wrap:wrap!important;
  }

  html body #siteNavbar .navbar-brand{
    height:52px!important;
    margin-right:auto!important;
  }

  html[dir="rtl"] body #siteNavbar .navbar-brand{
    margin-right:0!important;
    margin-left:auto!important;
  }

  html body #siteNavbar #mainNavbar.navbar-collapse{
    flex-basis:100%!important;
    width:100%!important;
    height:auto!important;
    margin-top:10px!important;
    padding:12px!important;
    display:none!important;
    background:#fff!important;
    border:1px solid #dfe5ef!important;
    border-radius:14px!important;
    box-shadow:0 14px 30px rgba(23,37,84,.10)!important;
  }

  html body #siteNavbar #mainNavbar.navbar-collapse.show,
  html body #siteNavbar #mainNavbar.navbar-collapse.collapsing{
    display:block!important;
  }

  html body #siteNavbar .navbar-nav{
    height:auto!important;
    display:flex!important;
    align-items:stretch!important;
    flex-wrap:wrap!important;
    gap:4px!important;
  }

  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
    width:100%!important;
    height:auto!important;
    min-height:44px!important;
    justify-content:flex-start!important;
  }

  html body #siteNavbar .navbar-actions{
    width:100%!important;
    height:auto!important;
    margin-top:10px!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    white-space:normal!important;
  }
}


/* v141 — mobile user avatar must stay fully inside the user button */
@media(max-width:991.98px){
  html body #siteNavbar #mainNavbar .navbar-actions .user-dropdown{
    display:flex!important;
    width:100%!important;
    justify-content:center!important;
    align-items:center!important;
  }

  html body #siteNavbar #mainNavbar .navbar-actions .user-toggle{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:min(260px,100%)!important;
    min-width:0!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    padding:5px 14px!important;
    margin:0 auto!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #siteNavbar #mainNavbar .navbar-actions .user-toggle .avatar-wrapper{
    position:relative!important;
    display:block!important;
    flex:0 0 32px!important;
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    max-width:32px!important;
    max-height:32px!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  html body #siteNavbar #mainNavbar .navbar-actions .user-toggle .avatar-navbar{
    display:block!important;
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    max-width:32px!important;
    max-height:32px!important;
    margin:0!important;
    padding:0!important;
    border-width:2px!important;
    border-radius:50%!important;
    object-fit:cover!important;
    object-position:center top!important;
    box-sizing:border-box!important;
    transform:none!important;
  }

  html body #siteNavbar #mainNavbar .navbar-actions .user-toggle .online-dot{
    right:-1px!important;
    bottom:-1px!important;
    width:9px!important;
    height:9px!important;
    border-width:2px!important;
  }

  html body #siteNavbar #mainNavbar .navbar-actions .user-toggle strong{
    display:block!important;
    min-width:0!important;
    max-width:150px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    line-height:1.2!important;
  }

  html[dir="rtl"] body #siteNavbar #mainNavbar .navbar-actions .user-toggle .avatar-wrapper{
    margin:0!important;
  }
}


/* v142 — mobile only: hide tagline and vertically center Barkodsal with logo */
@media(max-width:991.98px){
  html body #siteNavbar .navbar-brand{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:9px!important;
    height:52px!important;
    min-height:52px!important;
  }

  html body #siteNavbar .navbar-brand .brand-copy{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:46px!important;
    line-height:1!important;
  }

  html body #siteNavbar .navbar-brand .brand-copy strong{
    display:flex!important;
    align-items:center!important;
    height:46px!important;
    margin:0!important;
    padding:0!important;
    line-height:46px!important;
    font-size:1.05rem!important;
    white-space:nowrap!important;
  }

  html body #siteNavbar .navbar-brand .brand-copy small{
    display:none!important;
  }

  html body #siteNavbar .navbar-brand .brand-mark,
  html body #siteNavbar .navbar-brand .brand-program-icon{
    align-self:center!important;
    margin:0!important;
  }

  html[dir="rtl"] body #siteNavbar .navbar-brand{
    justify-content:flex-end!important;
  }
}


/* v143 — notification menu: mobile fits viewport, desktop icons always render */
html body #siteNavbar .notification-item-icon{
  display:grid!important;
  place-items:center!important;
  flex:0 0 34px!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  max-width:34px!important;
  max-height:34px!important;
  padding:0!important;
  border-radius:10px!important;
  background:#e9edff!important;
  color:#4f46f5!important;
  overflow:hidden!important;
}

html body #siteNavbar .notification-type-icon{
  display:block!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  max-width:18px!important;
  max-height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke!important;
}

@media(min-width:992px){
  html body #siteNavbar .desktop-navbar-notification .notification-menu{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    right:0!important;
    left:auto!important;
    width:380px!important;
    max-width:380px!important;
    max-height:min(520px,calc(100vh - 100px))!important;
  }

  html body #siteNavbar .desktop-navbar-notification .notification-menu-list{
    max-height:min(430px,calc(100vh - 170px))!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }

  html[dir="rtl"] body #siteNavbar .desktop-navbar-notification .notification-menu{
    right:auto!important;
    left:0!important;
  }
}

@media(max-width:991.98px){
  html body #siteNavbar .mobile-navbar-notification{
    position:static!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-menu{
    position:fixed!important;
    top:72px!important;
    left:12px!important;
    right:12px!important;
    bottom:auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    max-height:calc(100dvh - 84px)!important;
    margin:0!important;
    padding:0!important;
    border-radius:16px!important;
    overflow:hidden!important;
    z-index:2000!important;
    transform:none!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-menu-head{
    position:sticky!important;
    top:0!important;
    z-index:2!important;
    min-height:48px!important;
    display:flex!important;
    align-items:center!important;
    padding:12px 14px!important;
    background:#fff!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-menu-list{
    max-height:calc(100dvh - 132px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:7px!important;
    background:#fff!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-item{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    gap:10px!important;
    align-items:flex-start!important;
    padding:11px!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-item-copy{
    min-width:0!important;
    flex:1 1 auto!important;
  }

  html body #siteNavbar .mobile-navbar-notification .notification-item-copy strong,
  html body #siteNavbar .mobile-navbar-notification .notification-item-copy small{
    display:block!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  html[dir="rtl"] body #siteNavbar .mobile-navbar-notification .notification-menu{
    left:12px!important;
    right:12px!important;
  }
}

@supports not (height:100dvh){
  @media(max-width:991.98px){
    html body #siteNavbar .mobile-navbar-notification .notification-menu{
      max-height:calc(100vh - 84px)!important;
    }
    html body #siteNavbar .mobile-navbar-notification .notification-menu-list{
      max-height:calc(100vh - 132px)!important;
    }
  }
}


/* v144 marker: navbar geometry is finalized inline by includes/navbar.php so
   later page-specific styles cannot resize or reposition it. */


/* v145 — exact Home desktop navbar canvas on every page */
@media(min-width:1400px){
  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 32px)!important;
    max-width:1540px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

/* Keep the same Home proportions below 1540px without page-specific shifting. */
@media(min-width:1200px) and (max-width:1399.98px){
  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 24px)!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}

/* v148 — FINAL CANONICAL NAVBAR GEOMETRY
   One shared size/position source for Home, Documentation, Profile and every page
   that renders includes/navbar.php. Do not add page-specific navbar geometry. */
:root{
  --barkodsal-navbar-height:72px;
  --barkodsal-navbar-content-height:54px;
  --barkodsal-navbar-max-width:1540px;
  --barkodsal-navbar-side-gap:16px;
  --barkodsal-navbar-item-height:44px;
}

html body #siteNavbar.modern-navbar{
  position:sticky!important;
  inset:0 0 auto 0!important;
  width:100%!important;
  height:var(--barkodsal-navbar-height)!important;
  min-height:var(--barkodsal-navbar-height)!important;
  max-height:var(--barkodsal-navbar-height)!important;
  margin:0!important;
  padding:9px 0!important;
  box-sizing:border-box!important;
  z-index:1050!important;
}

html body #siteNavbar.modern-navbar > .container{
  width:calc(100% - (var(--barkodsal-navbar-side-gap) * 2))!important;
  max-width:var(--barkodsal-navbar-max-width)!important;
  height:var(--barkodsal-navbar-content-height)!important;
  min-height:var(--barkodsal-navbar-content-height)!important;
  max-height:var(--barkodsal-navbar-content-height)!important;
  margin:0 auto!important;
  padding:0 12px!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  box-sizing:border-box!important;
}

html body #siteNavbar .navbar-brand{
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  height:var(--barkodsal-navbar-content-height)!important;
  min-height:var(--barkodsal-navbar-content-height)!important;
  max-height:var(--barkodsal-navbar-content-height)!important;
  margin:0 18px 0 0!important;
  padding:0!important;
  gap:10px!important;
  white-space:nowrap!important;
}
html[dir="rtl"] body #siteNavbar .navbar-brand{
  margin:0 0 0 18px!important;
}

html body #siteNavbar .brand-mark{
  display:grid!important;
  place-items:center!important;
  flex:0 0 46px!important;
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:13px!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
  transition:none!important;
  overflow:visible!important;
}
html body #siteNavbar .brand-program-icon{
  display:block!important;
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:13px!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  transition:none!important;
  object-fit:contain!important;
}
/* Brand icon hover is intentionally disabled. The brand link remains clickable. */
html body #siteNavbar .navbar-brand:hover .brand-mark,
html body #siteNavbar .navbar-brand:focus .brand-mark,
html body #siteNavbar .navbar-brand:focus-visible .brand-mark,
html body #siteNavbar .brand-mark:hover,
html body #siteNavbar .brand-mark:focus,
html body #siteNavbar .navbar-brand:hover .brand-program-icon,
html body #siteNavbar .navbar-brand:focus .brand-program-icon,
html body #siteNavbar .navbar-brand:focus-visible .brand-program-icon,
html body #siteNavbar .brand-program-icon:hover,
html body #siteNavbar .brand-program-icon:focus{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  transition:none!important;
}

html body #siteNavbar .brand-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  min-width:max-content!important;
  max-width:none!important;
  line-height:1.12!important;
}
html body #siteNavbar .brand-copy strong{
  margin:0!important;
  font-size:1.05rem!important;
  line-height:1.12!important;
  white-space:nowrap!important;
}
html body #siteNavbar .brand-copy small{
  display:block!important;
  width:max-content!important;
  max-width:none!important;
  margin:3px 0 0!important;
  font-size:.65rem!important;
  line-height:1.12!important;
  white-space:nowrap!important;
}

html body #siteNavbar #mainNavbar.navbar-collapse{
  display:flex!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:var(--barkodsal-navbar-content-height)!important;
  min-height:var(--barkodsal-navbar-content-height)!important;
  max-height:var(--barkodsal-navbar-content-height)!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  gap:8px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
html body #siteNavbar .navbar-nav{
  display:flex!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:var(--barkodsal-navbar-content-height)!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
}
html body #siteNavbar .navbar-nav>.nav-item{
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
}
html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:var(--barkodsal-navbar-item-height)!important;
  min-height:var(--barkodsal-navbar-item-height)!important;
  max-height:var(--barkodsal-navbar-item-height)!important;
  margin:0!important;
  padding:9px 15px!important;
  font-size:.94rem!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
}
html body #siteNavbar .navbar-actions{
  display:flex!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:max-content!important;
  height:var(--barkodsal-navbar-content-height)!important;
  margin:0!important;
  padding:0!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
  white-space:nowrap!important;
}
html body #siteNavbar .navbar-actions>*{
  flex:0 0 auto!important;
  margin:0!important;
}
html body #siteNavbar .navbar-actions .language-switcher>.btn,
html body #siteNavbar .navbar-actions .btn-login,
html body #siteNavbar .navbar-actions .btn-register,
html body #siteNavbar .navbar-actions .user-toggle{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:var(--barkodsal-navbar-item-height)!important;
  min-height:var(--barkodsal-navbar-item-height)!important;
  max-height:var(--barkodsal-navbar-item-height)!important;
  margin:0!important;
  padding:9px 16px!important;
  border-radius:11px!important;
  font-size:.94rem!important;
  line-height:1.2!important;
  box-sizing:border-box!important;
}
html body #siteNavbar .avatar-wrapper,
html body #siteNavbar .avatar-navbar{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  max-width:36px!important;
  max-height:36px!important;
}
html body #siteNavbar .desktop-navbar-notification,
html body #siteNavbar .desktop-navbar-notification .notification-toggle{
  flex:0 0 42px!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  max-width:42px!important;
  max-height:42px!important;
  margin:0!important;
  padding:0!important;
}

@media (min-width:992px) and (max-width:1399.98px){
  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 24px)!important;
    max-width:100%!important;
    padding-inline:8px!important;
  }
  html body #siteNavbar .navbar-brand{margin-right:10px!important;gap:7px!important}
  html[dir="rtl"] body #siteNavbar .navbar-brand{margin-right:0!important;margin-left:10px!important}
  html body #siteNavbar .brand-copy small{display:none!important}
  html body #siteNavbar #mainNavbar.navbar-collapse{gap:8px!important}
  html body #siteNavbar .navbar-nav{gap:2px!important}
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{padding-inline:9px!important;font-size:.88rem!important}
  html body #siteNavbar .navbar-actions{gap:6px!important}
  html body #siteNavbar .navbar-actions .language-switcher>.btn,
  html body #siteNavbar .navbar-actions .btn-login,
  html body #siteNavbar .navbar-actions .btn-register,
  html body #siteNavbar .navbar-actions .user-toggle{padding-inline:10px!important;font-size:.88rem!important}
}

@media (max-width:991.98px){
  html body #siteNavbar.modern-navbar{
    height:auto!important;
    min-height:70px!important;
    max-height:none!important;
    padding:8px 0!important;
  }
  html body #siteNavbar.modern-navbar > .container{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    height:auto!important;
    min-height:54px!important;
    max-height:none!important;
    margin:0 auto!important;
    padding:0!important;
    flex-wrap:wrap!important;
  }
  html body #siteNavbar .navbar-brand{
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    margin:0 auto 0 0!important;
  }
  html[dir="rtl"] body #siteNavbar .navbar-brand{margin:0 0 0 auto!important}
  html body #siteNavbar .navbar-brand .brand-copy small{display:none!important}
  html body #siteNavbar .navbar-toggler{
    flex:0 0 44px!important;
    width:44px!important;height:44px!important;
    min-width:44px!important;min-height:44px!important;
    max-width:44px!important;max-height:44px!important;
    margin:0!important;padding:0!important;
  }
  html body #siteNavbar #mainNavbar.navbar-collapse{
    display:none!important;
    flex-basis:100%!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin-top:10px!important;
    padding:12px!important;
    background:#fff!important;
    border:1px solid #dfe5ef!important;
    border-radius:14px!important;
    box-shadow:0 14px 30px rgba(23,37,84,.10)!important;
  }
  html body #siteNavbar #mainNavbar.navbar-collapse.show,
  html body #siteNavbar #mainNavbar.navbar-collapse.collapsing{display:block!important}
  html body #siteNavbar .navbar-nav{
    height:auto!important;
    display:flex!important;
    align-items:stretch!important;
    flex-wrap:wrap!important;
    gap:4px!important;
  }
  html body #siteNavbar .navbar-nav>.nav-item>.nav-link{
    width:100%!important;
    height:auto!important;
    min-height:44px!important;
    max-height:none!important;
    justify-content:flex-start!important;
  }
  html body #siteNavbar .navbar-actions{
    width:100%!important;
    height:auto!important;
    margin-top:10px!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    white-space:normal!important;
  }
}