/* Contenedor Principal */
.pwd-container {
  display: flex;
  flex-direction: column;
  gap: 5px;
  text-align: left;
  /*font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Unifica tipografía sans-serif */
}

/* Etiquetas (Labels) */
.pwd-container label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #0b1a30; /* Azul obscuro corporativo de Impulsarte */
  margin-bottom: 5px;
  letter-spacing: 0.3px;
}

/* Campos de entrada (Inputs) */
.pwd-container input[type="text"],
.pwd-container input[type="password"] {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ced4da;
  border-radius: 6px;
  font-size: 11px;
  font-family: inherit;
  background-color: #ffffff;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
  color: #212529;
}

/* Enfoque del input (Focus) */
.pwd-container input:focus {
  border-color: #0b1a30; /* Borde azul obscuro al seleccionar */
  outline: none;
  box-shadow: 0 0 0 3px rgba(11, 26, 48, 0.15);
}

/* Lista de validación */
/*.class-pwd {
  margin: 6px 0 0 0;
  padding: 8px 12px;
  border-radius: 6px;
  background: #f8f9f5;
  border-left: 3px solid #c8d437;
  font-size: 13px;
  list-style: none;
  box-sizing: border-box;
  width: 100%;
}*/
/* Lista de validación (estilo tooltip integrado) */
/*.class-pwd {
  display: none;
  margin: 6px 0 0 0;
  padding: 8px 12px;
  border-radius: 6px;
  background: #f8f9f5;
  border-left: 3px solid #c8d437;
  font-size: 13px;
  list-style: none;
  box-sizing: border-box;
  width: 100%;
}*/
.class-pwd {
  margin: 4px 0 0 0;      /* Pequeño margen superior para separar del input */
  padding: 0px 12px;
  border-radius: 6px;
  background: #f8f9fa;    /* Fondo suave (o el de tu alerta) */
  width: 100%;
  box-sizing: border-box;
  font-size: 11px;
  /* box-shadow: 0 4px 10px rgba(0,0,0,.2); */
  list-style: none;       /* Quita los bullets */
  line-height: normal;
}

/* Por defecto, ocultamos pwd2-info y mostramos pwd-info */
#pwd-info {
  display: block;  /* siempre visible */
} 

#pwd2-info {
  display: none;   /* oculto hasta que se muestre */
}

#pwd2-info.show {
  display: block;
}

.class-pwd li {
  display: flex;
  align-items: center;
  gap: 6px;
}

.class-pwd .ok {
  color: #2d7a2d;
}
.class-pwd .error {
  color: #c0392b;
}

.class-pwd .ok::before {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 6px;
  color: #2d7a2d;
}
.class-pwd .error::before {
  content: "\f00d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 6px;
  color: #c0392b;
}