/* Submenús agrupados del navbar (desktop, se abren al pasar el mouse). Estética Concert Hall: marfil + borde petrol + sombra newspaper-print. Solo aplica en desktop: en ≤767px el .fl-navbar-nav está display:none y manda el bottom-nav. */ .fl-navbar-grupo { position: relative; cursor: pointer; user-select: none; } /* El submenú ahora se mueve al por JS (navbar-grupos.js) y se muestra con la clase .rs-abierto. Ya NO necesitamos poner el navbar en overflow:visible (eso recortaba/destapaba overlays y generaba barras de scroll, sobre todo en la nube). El navbar queda recortado. */ .fl-navbar-grupo-flecha { margin-left: .15rem; opacity: .65; transition: transform .15s ease; } .fl-navbar-grupo:hover .fl-navbar-grupo-flecha, .fl-navbar-grupo:focus-within .fl-navbar-grupo-flecha { transform: rotate(180deg); } /* Puente invisible: deja bajar el mouse del trigger al menú sin que se cierre. */ .fl-navbar-grupo::after { content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 10px; } .fl-navbar-grupo-menu { position: fixed; /* JS le pone top/left bajo el botón → no lo recorta el navbar */ top: 60px; left: 0; min-width: 172px; background: var(--rs-marfil-50, #FBF7EE); border: 1.5px solid var(--rs-petrol-700, #11303D); border-radius: 12px; box-shadow: 0 10px 30px -10px rgba(6, 23, 34, .25); padding: .3rem; z-index: 9001; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .14s ease, transform .14s ease, visibility .14s; } /* El JS le agrega .rs-abierto al hacer hover (el menú ya vive en el , así que el :hover de CSS no lo alcanza). */ .fl-navbar-grupo-menu.rs-abierto { opacity: 1; visibility: visible; transform: translateY(0); } .fl-navbar-grupo-item { display: flex; align-items: center; gap: .48rem; padding: .39rem .58rem; border-radius: 7px; color: var(--rs-tinta-800, #182632); text-decoration: none; font-size: .83rem; white-space: nowrap; transition: background .12s ease, color .12s ease; } .fl-navbar-grupo-item:hover { background: var(--rs-petrol-50, #EAF1F4); color: var(--rs-petrol-700, #11303D); } .fl-navbar-grupo-item svg { width: 15px; height: 15px; flex: none; opacity: .8; } .fl-navbar-grupo-item--activo { background: var(--rs-petrol-700, #11303D); color: var(--rs-marfil-50, #FBF7EE); } .fl-navbar-grupo-item--activo svg { opacity: 1; }