/* =========================================
   Boquetron — Custom CSS overrides
   ========================================= */

/* ── MOBILE (< 1200px): wordmark a la izquierda, sin avatar ── */

/* En móvil el brand-logo NO usa posicionamiento absoluto;
   queda en el flujo normal alineado a la izquierda */
.navbar-custom .navbar-brand-logo img,
.navbar-custom.top-nav-short .navbar-brand-logo img,
.navbar-custom.top-nav-short-permanent .navbar-brand-logo img {
   height: 4rem;       /* altura cómoda para móvil */
   width: auto;        /* preserva el aspect ratio */
}

/* Padding del navbar en móvil: más compacto */
.navbar-custom,
.navbar-custom.top-nav-short,
.navbar-custom.top-nav-short-permanent {
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
   overflow: visible;
}

/* En móvil el brand-logo queda en el flujo normal (no absolute) */
.navbar-custom .navbar-brand-logo {
   position: static;
   transform: none;
   padding-top: 0;
   padding-bottom: 0;
}

/* Ocultamos el avatar en móvil */
.navbar-custom .avatar-container {
   display: none;
}

/* Margen del intro-header para compensar la altura del navbar en móvil
   (navbar ~5.5rem = logo 4rem + padding 0.75×2) */
.intro-header {
   margin-top: 6.5rem;
}

/* ── ESCRITORIO (≥ 1200px): layout original ── */

@media (min-width: 1200px) {

   /* Wordmark: centrado con absolute positioning */
   .navbar-custom .navbar-brand-logo {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      padding-top: 0;
      padding-bottom: 0;
      white-space: nowrap;
   }

   /* Logo más grande en escritorio */
   .navbar-custom .navbar-brand-logo img,
   .navbar-custom.top-nav-short .navbar-brand-logo img,
   .navbar-custom.top-nav-short-permanent .navbar-brand-logo img {
      height: 7.3rem;
      width: auto;
   }

   /* Padding del navbar en escritorio */
   .navbar-custom,
   .navbar-custom.top-nav-short,
   .navbar-custom.top-nav-short-permanent {
      padding-top: 1.2rem;
      padding-bottom: 1.2rem;
   }

   /* Avatar: visible en escritorio, en el flujo, a la izquierda */
   .navbar-custom .avatar-container {
      display: flex;
      position: static;
      left: auto;
      bottom: auto;
      width: auto;
      align-items: center;
      order: -1;
      margin-right: 0.75rem;
   }

   /* Cancela overrides de pantalla grande del tema */
   .navbar-custom.top-nav-regular .avatar-container {
      width: auto;
      bottom: auto;
   }

   /* Tamaño del icono del avatar */
   .navbar-custom .avatar-container .avatar-img-border {
      width: 3rem;
      margin-left: 0;
   }

   .navbar-custom .avatar-container .avatar-img {
      width: 3rem;
      height: 3rem;
      object-fit: cover;
   }

   /* Evita que desaparezca al hacer scroll */
   .navbar-custom.top-nav-short .avatar-container {
      opacity: 1;
      visibility: visible;
   }

   /* Margen del intro-header en escritorio: navbar ~9.7rem */
   .intro-header {
      margin-top: 10.5rem;
   }
}