/*
 * shell.css: barra superior de View::navbar() en móvil y en la app instalada.
 * Solo lee variables de Tabler (regla 2 de house/). Va en todas las pantallas
 * con layout, después de house.css.
 */

/* Cabecera única de View::navbar(): un <header class="navbar"> con dos filas
   (1: hamburguesa, marca, iconos y cuenta; 2: menú). Que sea hija directa de
   .page es lo que deja a Tabler hacerla fija (data-bs-navbar=sticky) y oscura
   (data-bs-navbar-theme=dark) sin CSS propio.
   Fila 1 en una sola línea a cualquier ancho: la marca se trunca y, a la
   derecha, iconos y cuenta; sin esto, a 360-390 px los iconos bajaban de fila
   y el menú de la cuenta se salía por la izquierda. */
.house-barra > .house-barra-fila { flex-wrap: nowrap; }
.house-barra .navbar-brand { flex: 0 1 auto; min-width: 0; margin-right: auto; }
.house-barra .navbar-brand > a { min-width: 0; }
.house-barra .navbar-toggler,
.house-barra .house-barra-iconos { flex-shrink: 0; }
@media (max-width: 767.98px) {
  .house-barra .navbar-toggler { margin-right: var(--tblr-spacer-2); }
  .house-barra .house-barra-iconos { gap: var(--tblr-spacer-1); }
}

/* App instalada en iOS (viewport-fit=cover): la cabecera respeta el notch y los
   bordes redondeados (env() vale 0 fuera de esos casos). */
.house-barra { padding-top: env(safe-area-inset-top); }
.house-barra > .container-xl,
.house-barra > * > .container-xl {
  padding-left: max(calc(var(--tblr-gutter-x) * .5), env(safe-area-inset-left));
  padding-right: max(calc(var(--tblr-gutter-x) * .5), env(safe-area-inset-right));
}

/* Menú de la cuenta: nunca más ancho que la pantalla; nombre y email en caja
   normal (no el .dropdown-header en mayúsculas), el email con elipsis. */
.house-cuenta-menu { max-width: calc(100vw - var(--tblr-spacer-4)); }
.house-cuenta-quien { padding: var(--tblr-spacer-2) var(--tblr-spacer-3); min-width: 0; }

/* Nombre y correo junto al avatar: el correo largo se trunca (Tabler no pone tope). */
.house-cuenta-datos { min-width: 0; max-width: calc(var(--tblr-spacer-6) * 6); }
.house-barra .navbar-nav .nav-link .avatar { margin-inline-end: 0; }

/* Iconos de acción de la zona derecha (campana, ayuda, novedades): 18 px en
   vez de los 20 px de .icon y con menos aire lateral, para que no pesen más que el
   texto (14 px) ni el avatar-sm (32 px). El badge de la campana va a la esquina del icono. */
.house-barra-iconos .nav-link > .icon { width: 1.125rem; height: 1.125rem; min-width: 0; margin: 0; font-size: 1.125rem; }
.house-barra-iconos .nav-item > .nav-link { padding-inline: var(--tblr-spacer-2); }
.house-barra-iconos .nav-link .badge-notification { margin-top: var(--tblr-spacer-2) !important; margin-inline-end: var(--tblr-spacer-1) !important; }