/* Barra superior en pantallas angostas (core/base.html): debajo de 900px los links pasan a una
   hoja que abre el botón «Menú» (core/js/nav_movil.js). Colores de theme.css. */
.nav-solo-movil { display: none; }
@media (max-width: 899.98px) {
    .nav-escritorio { display: none !important; }
    .nav-solo-movil { display: inline-flex; }
}
.nav-hoja { position: fixed; top: 3.5rem; left: 0; right: 0; bottom: 0; z-index: 41; overflow-y: auto;
    background: rgb(var(--c-card)); border-top: 1px solid rgb(var(--c-stroke)); }
.nav-hoja[hidden] { display: none; }
@media (min-width: 900px) { .nav-hoja { display: none !important; } }
.nav-hoja-cuerpo { display: flex; flex-direction: column; gap: 2px; padding: 0.75rem 1rem 1.5rem; max-width: 32rem; margin: 0 auto; }
.nav-hoja-item { display: flex; align-items: center; gap: 0.625rem; width: 100%; padding: 0.75rem 0.75rem;
    border-radius: 0.625rem; font-size: 0.9375rem; font-weight: 500; color: rgb(var(--c-txt-2)); text-align: left;
    background: none; border: 0; cursor: pointer; list-style: none; }
.nav-hoja-item:hover, .nav-hoja-item.active { background: rgb(var(--c-muted-bg)); color: rgb(var(--c-txt)); }
.nav-hoja-grupo > summary::-webkit-details-marker { display: none; }
.nav-hoja-grupo[open] > summary svg:last-child { transform: rotate(180deg); }
.nav-hoja-sub { padding-left: 1.75rem; }
.nav-hoja-sub .nav-hoja-item { padding: 0.5rem 0.75rem; font-size: 0.875rem; }
.nav-hoja-sep { height: 1px; margin: 0.5rem 0; background: rgb(var(--c-stroke)); }
.nav-hoja-usuario { display: flex; align-items: center; gap: 0.625rem; padding: 0.5rem 0.75rem; font-size: 0.8125rem;
    color: rgb(var(--c-txt-muted)); overflow-wrap: anywhere; }
body.nav-abierta { overflow: hidden; }

/* Ejecuciones en curso (core/js/en_curso.js): una píldora chica con el ícono girando. */
.en-curso { display: inline-flex; align-items: center; gap: 0.1875rem; height: 1.375rem; padding: 0 0.4375rem 0 0.3125rem;
    border-radius: 9999px; background: rgb(var(--c-primary) / .1); color: rgb(var(--c-primary)); font-size: 0.6875rem;
    font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1; }
.en-curso[hidden] { display: none; }
.en-curso:hover { background: rgb(var(--c-primary) / .18); }
.en-curso svg { width: 0.75rem; height: 0.75rem; animation: en-curso-gira 1.2s linear infinite; }
@keyframes en-curso-gira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .en-curso svg { animation: none; } }
