/* === Logo Bancaribe (forzado) ===
   Reglas de alta especificidad para que siempre se vea grande y centrado.
   Edita max-width si quieres cambiar el tamaño límite.
*/

/* Selector específico al archivo */
img[src*="bancaribe-logo-nuevo"] {
  width: 100% !important;
  max-width: 32rem !important; /* ~512px */
  height: auto !important;
  display: block !important;
  margin: 24px auto !important;
  object-fit: contain !important;
}

/* Fallbacks si el src cambia (por hash o bundle) */
#root img[alt*="logo"],
#root img[src*="bancaribe"],
#root .logo-bancaribe,
#root .logo img {
  width: 100% !important;
  max-width: 32rem !important;
  height: auto !important;
  display: block !important;
  margin: 24px auto !important;
  object-fit: contain !important;
}

/* Evita que otros estilos limiten altura/ancho */
#root img { max-height: none !important; }

/* Opcional: caja que centra el logo si existe un contenedor header */
#root header .logo, #root .header .logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 0 !important;
}

/* === AUTO PATCH: subir logo + formulario === */
/* === Ajustes de espaciado para subir LOGO y FORM === */

/* Remueve padding/margin superior global */
html, body { margin-top: 0 !important; padding-top: 0 !important; }

/* Empuja todo el contenido visual hacia arriba */
#root { padding-top: 0 !important; }
#root > div { margin-top: -48px !important; } /* sube ~48px */

/* Coloca el logo oficial en la parte alta y reduce su separación */
#root img[src$="bancaribe-logo-nuevo.png"],
#root img[alt*="Bancaribe"],
#root img[alt*="Conexión Bancaribe"] {
  display: block !important;
  margin: 4px auto 8px !important; /* casi pegado al topbar */
  max-height: 86px !important;
  object-fit: contain !important;
}

/* Reduce espacios verticales sobrantes en contenedores comunes */
#root .container, #root .content, #root .main, #root .login-container, #root .card {
  margin-top: 4px !important;
  padding-top: 4px !important;
}

/* Compacta el formulario de login */
#root form { margin-top: 6px !important; }
#root form > * { margin-top: 10px !important; }
#root input, #root .input, #root button, #root .btn {
  margin-top: 10px !important;
}

/* Neutraliza clases utilitarias que añaden demasiado espacio (Tailwind/Vite build) */
#root [class*="mt-"], #root [class*="pt-"], #root [class*="py-"] {
  margin-top: min(10px, 2.5vh) !important;
  padding-top: min(10px, 2.5vh) !important;
}

/* Evita que el header genere hueco extra debajo */
#root header, #root .header {
  margin-bottom: 6px !important;
  padding-bottom: 0 !important;
}
