/** * Navbar (escritorio + móvil): carga explícita al final del para que * no quede tapada por CSS embebido del AssetMapper / caché de app.scss. */ html body:not(#homepage) { padding-top: 4.85rem !important; } @media (min-width: 992px) { html body:not(#homepage) { padding-top: 6.35rem !important; } } html body header nav.navbar { --bs-navbar-padding-y: 0.55rem !important; padding-top: 0.55rem !important; padding-bottom: 0.55rem !important; min-height: 0 !important; } html body header nav.navbar .navbar-nav { margin-bottom: 0 !important; } /* Finanzas + campana + usuario: mismo grupo a la derecha en escritorio */ html body header nav.navbar .navbar-nav.navbar-toolbar { flex-direction: row; flex-wrap: wrap; align-items: center; } @media (min-width: 992px) { /* * Toolbar: w-100 en Twig deja width:100% en todos los breakpoints; en flex eso * evita que el ul crezca como "resto de fila" y el usuario queda pegado a la campana. * Forzar ancho automático + flex grow y empujar solo el bloque usuario al borde derecho. */ html body header nav.navbar #appNavbar.navbar-collapse { display: flex !important; flex-direction: row !important; } html body header nav.navbar .navbar-nav.navbar-toolbar { flex-wrap: nowrap !important; margin-left: auto !important; width: auto !important; max-width: none !important; flex: 1 1 0 !important; min-width: 0 !important; justify-content: flex-start !important; } html body header nav.navbar .navbar-nav.navbar-toolbar > .navbar-toolbar-user-end { margin-left: auto !important; width: auto !important; max-width: max-content !important; flex: 0 0 auto !important; } html body header nav.navbar .navbar-nav.navbar-toolbar > .navbar-toolbar-user-end > .nav-link { width: auto !important; } } @media (min-width: 992px) { html body header nav.navbar .navbar-brand-compact .tiro-navbar-logo { width: 36px !important; height: 36px !important; } html body header nav.navbar .navbar-brand-compact .fw-semibold { font-size: 1.15rem !important; line-height: 1.25 !important; } html body header nav.navbar .navbar-collapse { flex-wrap: nowrap !important; align-items: center !important; } html body header nav.navbar > .container { flex-wrap: nowrap !important; align-items: center !important; } html body header nav.navbar .nav-item { margin-left: 0 !important; } html body header nav.navbar .navbar-nav { align-items: center !important; column-gap: 0.2rem !important; } html body header nav.navbar .navbar-nav .nav-link { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; padding-left: 0.65rem !important; padding-right: 0.65rem !important; font-size: 1.05rem !important; line-height: 1.3 !important; } } @media (max-width: 991.98px) { html body header nav.navbar .nav-item { margin-left: 0 !important; } html body header nav.navbar .ms-auto .nav-item { width: 100%; } /* Fila ancha solo en menú colapsado; en lg el ancho lo fija el bloque anterior. */ html body header nav.navbar .navbar-nav.navbar-toolbar > .navbar-toolbar-user-end { width: 100% !important; max-width: none !important; } } /* Icono + texto en fila (con o sin spans .navbar-link-*) */ html body header nav.navbar .navbar-nav .nav-item > .nav-link, html body header nav.navbar .navbar-nav .dropdown-menu .dropdown-item { display: inline-flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; gap: 0.45rem !important; line-height: 1.3 !important; } @media (max-width: 991.98px) { html body header nav.navbar .navbar-nav .nav-item > .nav-link { font-size: 1.05rem !important; padding-top: 0.45rem !important; padding-bottom: 0.45rem !important; } } html body header nav.navbar .navbar-link-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; line-height: 0 !important; } html body header nav.navbar .navbar-link-icon svg { display: block !important; position: static !important; top: auto !important; vertical-align: middle !important; width: 1.3em !important; height: 1.3em !important; } html body header nav.navbar .navbar-link-label { white-space: nowrap !important; } html body header nav.navbar .btn-navbar-login { display: inline-flex !important; flex-direction: row !important; align-items: center !important; gap: 0.45rem !important; padding-top: 0.4rem !important; padding-bottom: 0.4rem !important; padding-left: 0.65rem !important; padding-right: 0.65rem !important; font-size: 1rem !important; line-height: 1.3 !important; } html body header nav.navbar .btn-navbar-login .navbar-link-icon { line-height: 0 !important; } /* Submenú Finanzas (y otros dropdowns del navbar) */ html body header nav.navbar .dropdown-menu .dropdown-item { font-size: 1.02rem !important; padding-top: 0.48rem !important; padding-bottom: 0.48rem !important; } /* * Campana CLU (al final: gana a .navbar-nav .nav-item > .nav-link). * Móvil: enlace fuera de .nav-item (bloque d-lg-none). */ html body header nav.navbar .navbar-nav .nav-item > a.nav-link.clu-nav-bell-link, html body header nav.navbar .d-flex.d-lg-none > a.clu-nav-bell-link { position: relative; display: inline-flex !important; flex-direction: row !important; align-items: center !important; gap: 0.15rem !important; line-height: 1 !important; } html body header nav.navbar a.clu-nav-bell-link svg { display: block !important; width: 1.2em !important; height: 1.2em !important; } html body header nav.navbar a.clu-nav-bell-link .clu-nav-bell-badge { position: static !important; transform: none !important; top: auto !important; left: auto !important; margin: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 1rem; min-height: 1rem; height: auto; padding: 0.08rem 0.32rem !important; font-size: 0.58rem !important; font-weight: 700 !important; line-height: 1.1 !important; border-radius: 999px !important; background-color: #dc3545 !important; background-image: none !important; color: #fff !important; border: 0 !important; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15); } /* Must beat the rule above (inline-flex !important); otherwise count=0 never hides on mobile. */ html body header nav.navbar a.clu-nav-bell-link .clu-nav-bell-badge.d-none { display: none !important; box-shadow: none; }