/* =====================================================================
   Memoria y Resistencia — barra de navegación (5 nov 2026).
   Va después de mr.css y rediseno.css: solo ajusta la cabecera v3.
   - Compu: enlaces con indicador de sección, flecha que gira al abrir,
     menús que nunca salen de la pantalla y la barra «Buscar o analizar».
   - Celular y tableta: barra de arriba más limpia y menú con íconos.
   ===================================================================== */
.cabecera-v3 { --nav-alto-boton: 2.6rem; }
.cabecera-v3.compacta {
  background: rgba(255, 255, 255, .9);
  backdrop-filter: saturate(1.8) blur(18px); -webkit-backdrop-filter: saturate(1.8) blur(18px);
}
.cabecera-v3 .nav-ico { display: none; }

/* Barra «Buscar o analizar» (abre el modal del buscador). */
.cabecera-v3 .nav-buscar {
  align-items: center; gap: .55rem; height: var(--nav-alto-boton); padding: 0 .45rem 0 .95rem; min-width: 12.5rem;
  border: 1px solid var(--mr-linea); border-radius: 999px; background: var(--mr-papel); color: var(--mr-piedra);
  font-size: .9rem; font-weight: 500; text-align: left; white-space: nowrap; cursor: text;
  transition: border-color .2s, background-color .2s, color .2s, box-shadow .2s;
}
.cabecera-v3 .nav-buscar > i { color: var(--mr-morado); font-size: .9rem; }
.cabecera-v3 .nav-buscar-texto { flex: 1; }
.cabecera-v3 .nav-buscar kbd {
  display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .35rem; margin-left: .35rem;
  font-family: var(--mr-sans); font-size: .75rem; font-weight: 600; color: var(--mr-piedra); background: #fff;
  border: 1px solid var(--mr-linea-2); border-bottom-width: 2px; border-radius: 6px; box-shadow: none;
}
.cabecera-v3 .nav-buscar:hover, .cabecera-v3 .nav-buscar[aria-expanded="true"] { border-color: var(--mr-morado); background: #fff; color: var(--mr-tinta); box-shadow: 0 0 0 3px rgba(123, 75, 183, .12); }
.cabecera-v3 .nav-buscar:focus-visible { outline: 3px solid var(--mr-cempa); outline-offset: 2px; }

@media (min-width: 1200px) {
  .cabecera-v3 .nav-centro > .nav-item > .nav-link {
    position: relative; padding: .5rem .85rem !important; border-radius: 999px; color: var(--mr-tinta);
    transition: background-color .15s, color .15s;
  }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link:hover,
  .cabecera-v3 .nav-centro > .nav-item > .nav-link[aria-expanded="true"] { background: var(--mr-papel); color: var(--mr-morado); }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link.active { background: var(--mr-morado-claro); color: var(--mr-morado); }
  /* La sección donde estás lleva un listón de colores debajo. */
  .cabecera-v3 .nav-centro > .nav-item > .nav-link.active::after {
    content: ""; position: absolute; left: 50%; bottom: -.5rem; width: 1.6rem; height: 3px; border-radius: 3px;
    transform: translateX(-50%); background: var(--mr-liston);
  }
  .cabecera-v3.compacta .nav-centro > .nav-item > .nav-link.active::after { bottom: -.32rem; }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link:focus-visible { outline: 3px solid var(--mr-cempa); outline-offset: 2px; }
  .cabecera-v3 .flecha-sub { transition: transform .2s ease; }
  .cabecera-v3 .nav-link[aria-expanded="true"] .flecha-sub { transform: rotate(180deg); }
  /* Ningún menú sale de la pantalla: si es más alto, se desplaza por dentro. */
  .cabecera-v3 .nav-centro .dropdown-menu {
    max-height: calc(100dvh - var(--alto-cabecera, 76px) - 1.25rem); overflow-y: auto; overscroll-behavior: contain;
    scrollbar-width: thin; box-shadow: 0 28px 60px -24px rgba(43, 24, 84, .45), 0 0 0 1px rgba(43, 24, 84, .05);
  }
  .cabecera-v3 .nav-acciones { gap: .45rem; }
  .cabecera-v3 .nav-donar { height: var(--nav-alto-boton); display: inline-flex; align-items: center; gap: .45rem; padding-inline: 1.1rem; border-radius: 999px; }
  .cabecera-v3 .nav-donar i { transition: transform .25s ease; }
  .cabecera-v3 .nav-donar:hover i { transform: scale(1.18); }
}
/* Pantallas medianas: la barra de búsqueda queda como lupa para que quepa el menú. */
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .cabecera-v3 .nav-buscar { min-width: 0; width: var(--nav-alto-boton); padding: 0; justify-content: center; border-radius: 50%; background: #fff; cursor: pointer; }
  .cabecera-v3 .nav-buscar-texto, .cabecera-v3 .nav-buscar kbd { display: none; }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link { padding-inline: .6rem !important; }
}

/* Celular y tableta */
@media (max-width: 1199.98px) {
  .cabecera-v3 .nav-acciones-movil { gap: .4rem !important; }
  .cabecera-v3 .btn-buscar-nav, .cabecera-v3 .navbar-toggler { border-radius: 12px; }
  .cabecera-v3 .btn-buscar-nav { background: var(--mr-papel); border-color: transparent; color: var(--mr-morado); }
  .cabecera-v3 .navbar-toggler[aria-expanded="true"] { background: var(--mr-morado); border-color: var(--mr-morado); color: #fff; }
  /* Menú abierto: cada sección con su ícono y la sección actual marcada. */
  .cabecera-v3 .nav-centro > .nav-item > .nav-link { display: flex; align-items: center; gap: .85rem; }
  .cabecera-v3 .nav-ico {
    display: inline-grid; place-items: center; flex: none; width: 2.4rem; height: 2.4rem; border-radius: 12px;
    background: var(--mr-papel); color: var(--mr-morado); font-size: 1rem;
  }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link .flecha-sub { margin-left: auto; transition: transform .2s ease; }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link[aria-expanded="true"] .flecha-sub { transform: rotate(180deg); }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link.active { background: transparent !important; color: var(--mr-morado); }
  .cabecera-v3 .nav-centro > .nav-item > .nav-link.active .nav-ico { background: var(--mr-morado); color: #fff; }
  .cabecera-v3 .nav-campo-buscar { color: var(--mr-tinta); }
  .cabecera-v3 .nav-campo-buscar > i { color: var(--mr-morado); }
}
@media (prefers-reduced-motion: reduce) {
  .cabecera-v3 .flecha-sub, .cabecera-v3 .nav-donar i, .cabecera-v3 .nav-buscar { transition: none; }
}
