/* Header v2 (25/09/2026) — se carga DESPUÉS de estilo.css y solo agrega/ajusta.
   estilo.css no se tocó. Para volver al header anterior alcanza con restaurar
   templates/base.html desde _version_anterior_2026-09-25/. */

/* Un solo renglón: logo a la izquierda, Drive / Configuración / usuario a la derecha */
.banner-v2 .banner-in{padding:18px 26px 6px;justify-content:space-between}
.banner-v2 .marca-wrap{color:var(--tinta)}
.banner-v2 .marca-wrap:hover{text-decoration:none}
.banner-v2 .logo-casco{width:44px;height:44px;border-radius:11px}
.banner-v2 .logo-casco svg{width:26px;height:26px}
.banner-v2 .marca{font-size:24px}
.banner-v2 .marca-ver{text-transform:none;font-size:12px;font-weight:600;letter-spacing:.04em;margin-top:4px}

.banner-v2 .banner-acc{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.banner-v2 .chip-drive{background:var(--acento-tint);color:var(--acento-claro);border:1px solid transparent;
  padding:9px 16px;border-radius:999px;font-size:13.5px;font-weight:700}
.banner-v2 .chip-drive.on{background:var(--acento-claro);color:#fff}
.banner-v2 .chip-cfg{height:auto;padding:9px 16px;border-radius:999px;border:1px solid #D5D9D2;
  background:#fff;color:var(--tinta);font-size:13.5px;font-weight:700}
.banner-v2 .user-chip{border-radius:999px;padding:5px 12px 5px 5px;border-color:#D5D9D2}
.banner-v2 .user-ini{width:30px;height:30px;background:var(--oro-cta);color:#0B1F14;font-weight:800}

/* Menús desplegables */
.nav-drop-menu .nd-dest{background:var(--surface-2);font-weight:800;color:var(--tinta);margin-bottom:4px}
.nav-drop-menu a b{display:block;font-size:14.5px;color:var(--tinta)}
.nav-drop-menu a small{display:block;font-size:12.5px;font-weight:500;color:var(--suave);margin-top:1px}
.nav-drop-menu a:hover b{color:var(--acento-claro)}

@media (max-width:760px){
  .banner-v2 .banner-in{flex-direction:column;align-items:flex-start;gap:12px;padding:14px 16px 4px}
  .banner-v2 .marca{font-size:19px}
}

/* Cinta fija en todas las páginas (03/10/2026): el logo y el menú quedan arriba al bajar.
   base.html mide su alto y lo deja en --banner-h, para que lo que se pega debajo (la
   cabecera del cotizador, los #anclas) no quede tapado. En celular o ventanas muy bajas
   no se fija, para no comerse la pantalla. */
.banner-v2{position:sticky;top:0;z-index:50}
html{scroll-padding-top:calc(var(--banner-h,0px) + 12px)}
@media (max-width:760px),(max-height:560px){.banner-v2{position:static}}
@media print{.banner-v2{position:static}}

/* Cantidad de comprobantes esperando aprobación, al lado de "Finanzas" (07/10/2026). */
.nav-cuenta{display:inline-block;min-width:18px;padding:0 5px;border-radius:999px;background:#1AAD64;
  color:#fff;font-size:11px;font-weight:800;line-height:18px;text-align:center;vertical-align:1px}

/* 08/10/2026: la línea que separa el logo del menú va del logo al botón de usuario,
   igual que el contenido de la página (antes sobresalía 26 px de cada lado). */
.banner-v2 .nav{border-top:none;position:relative}
.banner-v2 .nav::before{content:"";position:absolute;top:0;left:26px;right:26px;border-top:1px solid var(--gris-borde)}
@media (max-width:760px){.banner-v2 .nav::before{left:0;right:0}}