/* Estilos propios de Melu Mantenimiento (barra superior + login). El resto
   de las clases (.boton, .tabla, .form-seccion, .insignia, .indicador, etc.)
   vienen de base.css y panel.css, copiados tal cual de Melu Peluches. */

.mant-barra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--e4);
  padding: var(--e3) var(--e5);
  background: var(--superficie, #fff);
  border-bottom: 1px solid var(--borde);
  flex-wrap: wrap;
}

.mant-marca {
  font-weight: 700;
  font-size: var(--txt-lg);
  display: flex;
  align-items: center;
  gap: var(--e2);
}

.mant-nav {
  display: flex;
  gap: var(--e2);
  flex-wrap: wrap;
}

.mant-nav a {
  padding: var(--e2) var(--e3);
  border-radius: var(--radio-sm);
  font-size: var(--txt-sm);
  text-decoration: none;
  color: inherit;
}

.mant-nav a:hover { background: var(--fondo-alterno); }
.mant-nav a.activo { background: var(--fondo-alterno); font-weight: 600; }

.mant-contenido {
  max-width: 1100px;
  margin: 0 auto;
  padding: var(--e6) var(--e5);
}

.mant-login-caja {
  max-width: 380px;
  margin: var(--e20) auto;
  padding: var(--e6);
  background: var(--superficie, #fff);
  border-radius: var(--radio-lg);
  border: 1px solid var(--borde);
}